"use client";

import Link from "next/link";
import { Icons } from "@/components/icons";
import { Button } from "@/components/ui/button";
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuLabel,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";

type PendingReviewActionMenuProps = {
  trainingRecordId: number;
};

export function PendingReviewActionMenu({
  trainingRecordId,
}: PendingReviewActionMenuProps) {
  return (
    <DropdownMenu modal={false}>
      <DropdownMenuTrigger asChild>
        <Button
          type="button"
          variant="ghost"
          size="icon"
          className="h-8 w-8 shrink-0"
          aria-label="เมนูการดำเนินการ"
        >
          <Icons.ellipsis className="h-4 w-4" />
        </Button>
      </DropdownMenuTrigger>
      <DropdownMenuContent
        align="end"
        sideOffset={8}
        className="w-44 max-w-[calc(100vw-1rem)]"
      >
        <DropdownMenuLabel>จัดการ</DropdownMenuLabel>
        <DropdownMenuItem asChild>
          <Link href={`/dashboard/training-records/${trainingRecordId}/review`}>
            <Icons.check className="mr-2 h-4 w-4" />
            ตรวจสอบ
          </Link>
        </DropdownMenuItem>
        <DropdownMenuItem asChild>
          <Link href={`/dashboard/training-records/${trainingRecordId}`}>
            <Icons.info className="mr-2 h-4 w-4" />
            ดูรายละเอียด
          </Link>
        </DropdownMenuItem>
      </DropdownMenuContent>
    </DropdownMenu>
  );
}
