"use client"

import * as React from "react"
import { HugeiconsIcon } from "@hugeicons/react"
import {
  Cancel01Icon,
  CheckmarkCircle02Icon,
  CheckmarkSquare01Icon,
  Delete02Icon,
  EyeIcon,
  PencilEdit01Icon,
  PrinterIcon,
} from "@hugeicons/core-free-icons"

import { Button } from "@/components/ui/button"
import { cn } from "@/lib/utils"

const ACTION_ICONS = {
  activate: CheckmarkCircle02Icon,
  cancel: Delete02Icon,
  close: Cancel01Icon,
  confirm: CheckmarkCircle02Icon,
  deactivate: Cancel01Icon,
  edit: PencilEdit01Icon,
  finalize: CheckmarkSquare01Icon,
  print: PrinterIcon,
  view: EyeIcon,
} as const

type RowActionKind = keyof typeof ACTION_ICONS

function RowActions({
  className,
  ...props
}: React.ComponentProps<"div">) {
  return (
    <div
      className={cn("flex items-center justify-end gap-1", className)}
      {...props}
    />
  )
}

function RowActionButton({
  action,
  label,
  tone = "default",
  className,
  ...props
}: Omit<React.ComponentProps<typeof Button>, "children"> & {
  action: RowActionKind
  label: string
  tone?: "default" | "destructive"
}) {
  const icon = ACTION_ICONS[action]

  return (
    <Button
      variant="ghost"
      size="icon-sm"
      className={cn(
        tone === "destructive"
          ? "text-destructive hover:text-destructive"
          : "text-muted-foreground hover:text-foreground",
        className
      )}
      aria-label={label}
      title={label}
      {...props}
    >
      <HugeiconsIcon icon={icon} size={16} />
    </Button>
  )
}

export { RowActions, RowActionButton }