path: root/lib/vendors/rfq-history-table/rfq-history-table-columns.tsx

"use client"

import * as React from "react"
import { type DataTableRowAction } from "@/types/table"
import { type ColumnDef } from "@tanstack/react-table"
import { Ellipsis, MoreHorizontal } from "lucide-react"
import { toast } from "sonner"

import { getErrorMessage } from "@/lib/handle-error"
import { formatDate } from "@/lib/utils"
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import { Checkbox } from "@/components/ui/checkbox"
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"
import { DataTableColumnHeader } from "@/components/data-table/data-table-column-header"

import { VendorItem,  vendors } from "@/db/schema/vendors"
import { modifyVendor } from "../service"
import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip"
import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
import { rfqHistoryColumnsConfig } from "@/config/rfqHistoryColumnsConfig"

export interface RfqHistoryRow {
  id: number;
  rfqCode: string | null;
  projectCode: string | null;
  projectName: string | null;
  description: string | null;
  dueDate: Date;
  status: "DRAFT" | "PUBLISHED" | "EVALUATION" | "AWARDED";
  vendorStatus: string;
  totalAmount: number | null;
  currency: string | null;
  leadTime: string | null;
  itemCount: number;
  tbeResult: string | null;
  cbeResult: string | null;
  createdAt: Date;
  items: {
    rfqId: number;
    id: number;
    itemCode: string;
    description: string | null;
    quantity: number | null;
    uom: string | null;
  }[];
}

interface GetColumnsProps {
  setRowAction: React.Dispatch<React.SetStateAction<DataTableRowAction<RfqHistoryRow> | null>>;
  onViewDetails: (rfqId: number) => void;
}

/**
 * tanstack table 컬럼 정의 (중첩 헤더 버전)
 */
export function getColumns({ setRowAction, onViewDetails }: GetColumnsProps): ColumnDef<RfqHistoryRow>[] {
  // ----------------------------------------------------------------
  // 1) select 컬럼 (체크박스)
  // ----------------------------------------------------------------
  const selectColumn: ColumnDef<RfqHistoryRow> = {
    id: "select",
    header: ({ table }) => (
      <Checkbox
        checked={
          table.getIsAllPageRowsSelected() ||
          (table.getIsSomePageRowsSelected() && "indeterminate")
        }
        onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
        aria-label="Select all"
        className="translate-y-0.5"
      />
    ),
    cell: ({ row }) => (
      <Checkbox
        checked={row.getIsSelected()}
        onCheckedChange={(value) => row.toggleSelected(!!value)}
        aria-label="Select row"
        className="translate-y-0.5"
      />
    ),
    size: 40,
    enableSorting: false,
    enableHiding: false,
  }

  // ----------------------------------------------------------------
  // 2) actions 컬럼 (Dropdown 메뉴)
  // ----------------------------------------------------------------
  const actionsColumn: ColumnDef<RfqHistoryRow> = {
    id: "actions",
    enableHiding: false,
    cell: function Cell({ row }) {
      return (
        <DropdownMenu>
          <DropdownMenuTrigger asChild>
            <Button
              aria-label="Open menu"
              variant="ghost"
              className="flex size-8 p-0 data-[state=open]:bg-muted"
            >
              <span className="text-lg">⋯</span>
            </Button>
          </DropdownMenuTrigger>
          <DropdownMenuContent align="end" className="w-40">
            <DropdownMenuItem
              onSelect={() => onViewDetails(row.original.id)}
            >
              견적상세
            </DropdownMenuItem>
          </DropdownMenuContent>
        </DropdownMenu>
      )
    },
    size: 40,
  }

  // ----------------------------------------------------------------
  // 3) 개별 컬럼들 (그룹 없음)
  // ----------------------------------------------------------------
  const basicColumns1: ColumnDef<RfqHistoryRow>[] = []
  const quotationGroupColumns: ColumnDef<RfqHistoryRow>[] = []
  const basicColumns2: ColumnDef<RfqHistoryRow>[] = []

  const sortableIds = new Set([
    "rfqType",
    "status",
    "rfqCode",
    "projectInfo",
    "packageInfo",
    "materialInfo",
    "currency",
    "totalAmount",
    "leadTime",
    "paymentTerms",
    "incoterms",
    "shippingLocation",
    "contractInfo",
    "rfqSendDate",
    "submittedAt",
    "picName",
  ])

  rfqHistoryColumnsConfig.forEach((cfg) => {
    const isSortable = sortableIds.has(cfg.id)
    const column: ColumnDef<RfqHistoryRow> = {
      accessorKey: cfg.id,
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title={cfg.label} />
      ),
      meta: {
        excelHeader: cfg.excelHeader,
        group: cfg.group,
        type: cfg.type,
      },
      size: cfg.size,
      enableSorting: isSortable,
    }

    if (cfg.id === "materialInfo") {
      column.cell = ({ row }) => {
        const materialInfo = row.original.materialInfo
        if (!materialInfo) return null
        return (
          <Tooltip>
            <TooltipTrigger asChild>
              <div className="break-words whitespace-normal line-clamp-2">
                {materialInfo}
              </div>
            </TooltipTrigger>
            <TooltipContent side="bottom" className="max-w-[400px] whitespace-pre-wrap break-words">
              {materialInfo}
            </TooltipContent>
          </Tooltip>
        )
      }
    }

    if (cfg.id === "status") {
      column.cell = ({ row }) => {
        const statusVal = row.original.status
        if (!statusVal) return null
        return (
          <div className="whitespace-nowrap">
            <span className="capitalize">{statusVal}</span>
          </div>
        )
      }
    }

    if (cfg.id === "totalAmount") {
      column.cell = ({ row }) => {
        const amount = row.original.totalAmount
        if (!amount) return null
        return (
          <div className="whitespace-nowrap">
            {amount.toLocaleString()}
          </div>
        )
      }
    }

    if (cfg.id === "rfqSendDate" || cfg.id === "submittedAt") {
      column.cell = ({ row }) => {
        const v = row.getValue(cfg.id) as Date | null
        if (!v) return <div className="whitespace-nowrap">-</div>
        return (
          <div className="whitespace-nowrap">{formatDate(v, "KR")}</div>
        )
      }
    }

    // 컬럼을 적절한 배열에 분류
    if (cfg.group === "견적정보") {
      quotationGroupColumns.push(column)
    } else if (["contractInfo", "rfqSendDate", "submittedAt", "picName"].includes(cfg.id)) {
      basicColumns2.push(column)
    } else {
      basicColumns1.push(column)
    }

    return column
  })

  // ----------------------------------------------------------------
  // 4) 최종 컬럼 배열 (bid-history-table-columns.tsx 방식)
  // ----------------------------------------------------------------
  const createGroupColumn = (groupName: string, columns: ColumnDef<RfqHistoryRow>[]): ColumnDef<RfqHistoryRow> => {
    return {
      id: `group-${groupName.replace(/\s+/g, '-')}`,
      header: groupName,
      columns: columns,
      meta: {
        isGroupColumn: true,
        groupBorders: true,
      } as any
    }
  }

  return [
    selectColumn,
    ...basicColumns1,
    ...(quotationGroupColumns.length > 0 ? [createGroupColumn("견적정보", quotationGroupColumns)] : []),
    ...basicColumns2,
    actionsColumn,
  ]
}