"use client"

import { TableColumn } from "@/types/table"
import { format } from "date-fns"

export interface PaymentHistory {
  id: string
  paymentDate: string
  amount: string
  adjustedAgainst: string
  notes: string
  addedBy: string
  addedOn: string
}

export function getPaymentHistoryColumns(): TableColumn[] {
  return [
    {
      header: "Payment Date",
      accessor: (row: any) => (
        <span className="font-medium">
          {row.paymentDate
            ? format(new Date(row.paymentDate), "dd MMM yyyy")
            : "-"}
        </span>
      ),
    },
    {
      header: "Amount",
      accessor: (row: any) => (
        <span className="font-medium">{row.amount}</span>
      ),
      className: "text-right",
    },
    {
      header: "Adjusted Against",
      accessor: (row: any) => (
        <div className="max-w-md">
          {row.adjustedAgainst.includes('\n') ? (
            <div className="space-y-1">
              {row.adjustedAgainst.split('\n').map((line: string, idx: number) => (
                <div key={idx} className="text-sm">
                  {line}
                </div>
              ))}
            </div>
          ) : (
            <span>{row.adjustedAgainst}</span>
          )}
        </div>
      ),
    },
    {
      header: "Notes",
      accessor: (row: any) => (
        <span className="text-sm">{row.notes}</span>
      ),
    },
    {
      header: "Added By",
      accessor: (row: any) => (
        <div className="flex flex-col">
          <span className="font-medium">{row.addedBy}</span>
          <span className="text-xs text-muted-foreground">
            {format(new Date(row.addedOn), "dd MMM yyyy")}
          </span>
        </div>
      ),
    },
  ]
}