'use client';

import { FoxButtonGroup } from '@fox/core/components/fox-button-group';
import { FoxIconButton } from '@fox/core/components/fox-icon-button';

interface CodeRowActionsProps {
  /** 읽어 줄 이름에 붙는 대상 — "CMS004 수정"처럼 읽힌다. */
  target: string;
  onEdit: () => void;
  onDelete: () => void;
  deleting?: boolean;
}

/**
 * 두 목록이 함께 쓰는 "관리" 셀(시안 5402:13455) — 28×28 테두리 버튼 두 개.
 *
 * **누름이 위로 새지 않게 막는다** — 공통코드 행은 눌러서 고르는 행이라, 막지 않으면 수정·삭제를
 * 누를 때 선택까지 함께 바뀐다. 상세코드 행은 고를 수 없지만 같은 조각을 쓰므로 규칙을 여기 둔다.
 */
export function CodeRowActions({
  target,
  onEdit,
  onDelete,
  deleting = false,
}: CodeRowActionsProps) {
  return (
    <span
      onClick={(event) => event.stopPropagation()}
      onKeyDown={(event) => event.stopPropagation()}
    >
      <FoxButtonGroup size="sm">
        <FoxIconButton
          type="default"
          size="sm"
          icon={<i className="fox-ico fox-ico-PencilSimple" aria-hidden="true" />}
          label={`${target} 수정`}
          onAction={onEdit}
        />
        <FoxIconButton
          type="default"
          size="sm"
          icon={<i className="fox-ico fox-ico-Trash" aria-hidden="true" />}
          label={deleting ? `${target} 삭제 중` : `${target} 삭제`}
          disabled={deleting}
          onAction={onDelete}
        />
      </FoxButtonGroup>
    </span>
  );
}