"use client";

import { TableIconButton } from "@/components/dashboard/home/table-icon-button";
import { Button } from "@/components/ui/button";
import { Link } from "@/i18n/routing";
import { cn } from "@/lib/utils";
import type { ReactNode } from "react";

export type RowIconAction = {
  label: string;
  icon: ReactNode;
  onClick?: () => void;
  href?: string;
  className?: string;
  hidden?: boolean;
};

interface RowActionsIconsProps {
  items: RowIconAction[];
  className?: string;
}

export function RowActionsIcons({ items, className }: RowActionsIconsProps) {
  const visible = items.filter((a) => !a.hidden);
  if (visible.length === 0) return null;

  return (
    <div className={cn("flex items-center justify-center gap-3", className)}>
      {visible.map((action, idx) => {
        if (action.href) {
          return (
            <Button
              key={idx}
              type="button"
              variant="outline"
              size="icon"
              aria-label={action.label}
              className={cn(
                "h-8 w-8 rounded-[10px] border-border text-muted-foreground",
                action.className
              )}
              asChild
            >
              <Link href={action.href}>
                <span className="sr-only">{action.label}</span>
                {action.icon}
              </Link>
            </Button>
          );
        }

        return (
          <TableIconButton
            key={idx}
            label={action.label}
            icon={action.icon}
            className={cn("h-8 w-8 rounded-[10px]", action.className)}
            onClick={action.onClick}
          />
        );
      })}
    </div>
  );
}