"use client";
import * as React from "react";
import { useDataTable } from "@/hooks/use-data-table";
import { DataTable } from "@/components/data-table/data-table";
import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar";
import type { DataTableFilterField, DataTableAdvancedFilterField } from "@/types/table";
import { getGeneralEvaluationColumns } from "./general-check-table-columns";
import { CreateEvaluationDialog } from "./add-check-list-dialog";
import { DeleteEvaluationsDialog } from "./delete-check-lists-dialog";
import { getGeneralEvaluations } from "@/lib/general-check-list/service";


interface EsgEvaluationsTableProps {
    promises: Promise<
      [
        Awaited<ReturnType<typeof getGeneralEvaluations>>,
      ] 
    >
  }

export function GeneralEvaluationsTable({ promises }: EsgEvaluationsTableProps) {

  const [{ data, pageCount }]= React.use(promises);
  const columns = React.useMemo(() => getGeneralEvaluationColumns(), []);

  // Filters (간단 예시)
  const filterFields: DataTableFilterField<any>[] = [
    { id: "serialNumber", label: "시리얼", placeholder: "시리얼 검색" },
    { id: "category", label: "카테고리", placeholder: "카테고리" },
  ];
  const advFilterFields: DataTableAdvancedFilterField<any>[] = [
    { id: "inspectionItem", label: "점검 항목", type: "text" },
    { id: "remarks", label: "비고", type: "text" },
  ];

  const { table } = useDataTable({
    data,
    columns,
    pageCount,
    filterFields,
    enableAdvancedFilter: true,
    initialState: { sorting: [{ id: "createdAt", desc: true }], columnPinning: { right: ["actions"] } },
    getRowId: (row) => row.id.toString(),
    clearOnDefault: true,
    shallow: false,
  });

  // Delete selected
  const selectedRows = table.getFilteredSelectedRowModel().rows.map((r) => r.original);

  return (
    <div className="space-y-6">
      <DataTable table={table} className="h-full">
        <DataTableAdvancedToolbar table={table} filterFields={advFilterFields} shallow={false}>
          <CreateEvaluationDialog />
          {selectedRows.length > 0 && (
            <DeleteEvaluationsDialog evaluations={selectedRows} />
          )}
        </DataTableAdvancedToolbar>
      </DataTable>
    </div>
  );
}