import { ColumnDef } from "@tanstack/react-table";
import { CreditHistoryRecord } from "../../../../hooks/features/dashboard/useCreditHistoryFetch";
import { convertDateStringToDate } from "../../../../utils/helper";
import Image from "next/image";

export const creditsHistoryColumns: ColumnDef<CreditHistoryRecord>[] = [
  {
    accessorKey: "createdAt",
    header: "Date",
    enableSorting: true,
    cell: ({ row }) => (
      <span className="">
        {convertDateStringToDate(row.original.createdAt)}
      </span>
    ),
  },

  {
    accessorKey: "referenceType",
    header: "Preview",
    cell: ({ row }) => <span className="">{row.original.referenceType}</span>,
  },

  {
    accessorKey: "credits",
    header: "Spent",
    cell: ({ row }) => (
      <div className="flex items-center gap-2">
        <Image
          src="/images/credits-icon.svg"
          alt="Credits"
          width={20}
          height={20}
        />

        <span>{row.original.credits}</span>
      </div>
    ),
  },
];