"use client"

import type { LucideIcon } from "lucide-react"
import Link from "next/link"

import { Button } from "@/components/ui/button"
import {
  Tooltip,
  TooltipContent,
  TooltipTrigger,
} from "@/components/ui/tooltip"
import {
  TABLE_ROW_ACTIONS_WRAP,
  TABLE_ROW_ICON,
  TABLE_ROW_ICON_BTN,
  TABLE_TOOLBAR_BTN,
} from "@/components/shared/table-ui"

export type TableRowIconAction = {
  label: string
  icon: LucideIcon
  variant?: "default" | "secondary" | "destructive" | "outline"
  onClick: () => void
}

export type TableRowLinkAction = {
  label: string
  icon: LucideIcon
  variant?: "default" | "secondary" | "destructive" | "outline"
  href: string
}

type TableRowActionsProps = {
  iconActions?: TableRowIconAction[]
  linkActions?: TableRowLinkAction[]
  textAction?: {
    label: string
    onClick: () => void
  }
}

export function TableRowActions({
  iconActions = [],
  linkActions = [],
  textAction,
}: TableRowActionsProps) {
  return (
    <div className={TABLE_ROW_ACTIONS_WRAP}>
      {textAction ? (
        <Button
          type="button"
          {...TABLE_TOOLBAR_BTN}
          onClick={textAction.onClick}
        >
          {textAction.label}
        </Button>
      ) : null}
      {linkActions.map((action) => {
        const Icon = action.icon
        return (
          <Tooltip key={action.label}>
            <TooltipTrigger asChild>
              <Button
                variant={action.variant ?? "secondary"}
                {...TABLE_ROW_ICON_BTN}
                asChild
              >
                <Link href={action.href} aria-label={action.label}>
                  <Icon className={TABLE_ROW_ICON} />
                </Link>
              </Button>
            </TooltipTrigger>
            <TooltipContent>{action.label}</TooltipContent>
          </Tooltip>
        )
      })}
      {iconActions.map((action) => {
        const Icon = action.icon
        return (
          <Tooltip key={action.label}>
            <TooltipTrigger asChild>
              <Button
                type="button"
                variant={action.variant ?? "secondary"}
                {...TABLE_ROW_ICON_BTN}
                onClick={action.onClick}
              >
                <Icon className={TABLE_ROW_ICON} />
                <span className="sr-only">{action.label}</span>
              </Button>
            </TooltipTrigger>
            <TooltipContent>{action.label}</TooltipContent>
          </Tooltip>
        )
      })}
    </div>
  )
}