"use client"
// Because columns rely on React state/hooks for row actions

import * as React from "react"
import { ColumnDef, Row } from "@tanstack/react-table"
import { ClientDataTableColumnHeaderSimple } from "@/components/client-data-table/data-table-column-simple-header"
import { formatDate } from "@/lib/utils"
import { Checkbox } from "@/components/ui/checkbox"
import { VendorData } from "./vendor-contact-table"


/** getColumns: return array of ColumnDef for 'vendors' data */
export function getColumns(): ColumnDef<VendorData>[] {
  return [
    
    // Vendor Name
    {
      accessorKey: "contactName",
      header: ({ column }) => (
        <ClientDataTableColumnHeaderSimple column={column} title="Contact Name" />
      ),
      cell: ({ row }) => row.getValue("contactName"),
    },
    
    // Vendor Code
    {
      accessorKey: "contactPosition",
      header: ({ column }) => (
        <ClientDataTableColumnHeaderSimple column={column} title="Position" />
      ),
      cell: ({ row }) => row.getValue("contactPosition"),
    },
    
    // Status
    {
      accessorKey: "contactEmail",
      header: ({ column }) => (
        <ClientDataTableColumnHeaderSimple column={column} title="Email" />
      ),
      cell: ({ row }) => row.getValue("contactEmail"),
    },
    
    // Country
    {
      accessorKey: "contactPhone",
      header: ({ column }) => (
        <ClientDataTableColumnHeaderSimple column={column} title="Phone" />
      ),
      cell: ({ row }) => row.getValue("contactPhone"),
    },
    
    // Created At
    {
      accessorKey: "createdAt",
      header: ({ column }) => (
        <ClientDataTableColumnHeaderSimple column={column} title="Created At" />
      ),
      cell: ({ cell }) => formatDate(cell.getValue() as Date),
    },
    
    // Updated At
    {
      accessorKey: "updatedAt",
      header: ({ column }) => (
        <ClientDataTableColumnHeaderSimple column={column} title="Updated At" />
      ),
      cell: ({ cell }) => formatDate(cell.getValue() as Date),
    },
  ]
}