"use client"

import * as React from "react"
import { type ColumnDef } from "@tanstack/react-table"
import { type DataTableRowAction } from "@/types/table"

import { formatDate } from "@/lib/utils"
import { Checkbox } from "@/components/ui/checkbox"
import { Button } from "@/components/ui/button"
import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"

// Material 타입 정의 (서비스에서 반환되는 타입과 일치)
type Material = {
  id: number;
  MATKL: string | null;    // 자재그룹
  MATNR: string | null;    // 자재코드
  ZZNAME: string | null;   // 자재명
  ZZPJT: string | null;    // 프로젝트
  createdAt: Date;
  updatedAt: Date;
}

interface GetColumnsProps {
  setRowAction: React.Dispatch<React.SetStateAction<DataTableRowAction<Material> | null>>
}

/**
 * Material 테이블 컬럼 정의
 */
export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<Material>[] {
  
  // ----------------------------------------------------------------
  // 1) select 컬럼 (체크박스)
  // ----------------------------------------------------------------
  const selectColumn: ColumnDef<Material> = {
    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) 데이터 컬럼들
  // ----------------------------------------------------------------
  const dataColumns: ColumnDef<Material>[] = [
    {
      accessorKey: "MATKL",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="자재그룹" />
      ),
      cell: ({ row }) => {
        const value = row.getValue("MATKL") as string | null
        return (
          <div className="font-medium">
            {value || "-"}
          </div>
        )
      },
      enableSorting: true,
      enableHiding: false,
    },
    {
      accessorKey: "MATNR",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="자재코드" />
      ),
      cell: ({ row }) => {
        const value = row.getValue("MATNR") as string | null
        return (
          <div className="font-medium">
            {value || "-"}
          </div>
        )
      },
      enableSorting: true,
      enableHiding: false,
    },
    {
      accessorKey: "ZZNAME",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="자재명" />
      ),
      cell: ({ row }) => {
        const value = row.getValue("ZZNAME") as string | null
        return (
          <div className="max-w-[200px] truncate">
            {value || "-"}
          </div>
        )
      },
      enableSorting: true,
    },
    {
      accessorKey: "ZZPJT",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="프로젝트" />
      ),
      cell: ({ row }) => {
        const value = row.getValue("ZZPJT") as string | null
        return (
          <div className="max-w-[150px] truncate">
            {value || "-"}
          </div>
        )
      },
      enableSorting: true,
    },
    {
      accessorKey: "createdAt",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="생성일시" />
      ),
      cell: ({ row }) => {
        const value = row.getValue("createdAt") as Date
        return (
          <div className="text-sm text-muted-foreground">
            {formatDate(value, "KR")}
          </div>
        )
      },
      enableSorting: true,
    },
    {
      accessorKey: "updatedAt",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="수정일시" />
      ),
      cell: ({ row }) => {
        const value = row.getValue("updatedAt") as Date
        return (
          <div className="text-sm text-muted-foreground">
            {formatDate(value, "KR")}
          </div>
        )
      },
      enableSorting: true,
    },
  ]

  // ----------------------------------------------------------------
  // 3) actions 컬럼 (상세보기)
  // ----------------------------------------------------------------
  const actionsColumn: ColumnDef<Material> = {
    id: "actions",
    enableHiding: false,
    cell: function Cell({ row }) {
      return (
          <Button onClick={() => setRowAction({ row, type: "view" })}>
            상세
          </Button>
      )
    },
    size: 40,
  }

  // ----------------------------------------------------------------
  // 4) 최종 컬럼 배열
  // ----------------------------------------------------------------
  return [
    selectColumn,
    ...dataColumns,
    actionsColumn,
  ]
}