'use client';

import { useState } from 'react';
import { FoxButtonGroup } from '@fox/core/components/fox-button-group';
import { FoxIconButton } from '@fox/core/components/fox-icon-button';
import { useFeedback } from '@/app/_hooks/use-feedback';
import type { CommonCode } from '@/lib/domain/common-code';
import type { Merchant } from '@/lib/domain/merchant';
import { MerchantFormModal } from './merchant-form-modal';

interface MerchantRowActionsProps {
  merchant: Merchant;
  businessCodes: CommonCode[];
}

/**
 * 수정은 모달을 열어 등록된 내용을 보여 준다 — 백엔드에 수정 API가 없어 모달이 조회
 * 전용으로 뜬다(`merchant-form-modal.tsx`의 `IS_EDIT_ENABLED`). API가 생기면 그 한 줄만
 * 바꾸면 여기는 손대지 않아도 된다.
 *
 * TODO(백엔드): 삭제 API도 없다(`/api/v1/mngr/voc`는 목록·등록뿐). 시안의 자리는 두되
 * 눌러도 할 수 있는 일이 없어 사유를 알린다.
 *
 * 어느 행의 버튼인지는 각 버튼 라벨이 말한다 — 감싼 요소의 `aria-label`은 의미 없는
 * 요소에 붙어 읽히지 않을 수 있다(공통코드 행과 같은 방식).
 */
export function MerchantRowActions({ merchant, businessCodes }: MerchantRowActionsProps) {
  const { showToast } = useFeedback();
  const [isDetailOpen, setIsDetailOpen] = useState(false);

  return (
    <>
      <FoxButtonGroup size="sm" align="center">
        <FoxIconButton
          type="default"
          size="sm"
          icon={<i className="fox-ico fox-ico-PencilSimple" aria-hidden="true" />}
          label={`${merchant.name} 수정`}
          onAction={() => setIsDetailOpen(true)}
        />
        <FoxIconButton
          type="default"
          size="sm"
          icon={<i className="fox-ico fox-ico-Trash" aria-hidden="true" />}
          label={`${merchant.name} 삭제`}
          onAction={() =>
            showToast({
              variant: 'warning',
              message: '가맹점 삭제 기능은 백엔드 준비 중입니다.',
            })
          }
        />
      </FoxButtonGroup>

      {isDetailOpen && (
        <MerchantFormModal
          merchant={merchant}
          businessCodes={businessCodes}
          onClose={() => setIsDetailOpen(false)}
        />
      )}
    </>
  );
}