"use client";
import { ColumnDef } from "@tanstack/react-table";
import Delete from "@/components/admin/custom ui/Delete";
import Link from "next/link";
import Image from "next/image";

// VARIANT COLUMNS -- FIX IT
export const columns: ColumnDef<ProductVariant>[] = [
  {
    accessorKey: "serial",
    header: "#",
    cell: ({ row }) => <p>{row.index + 1}</p>,
  },
  {
    accessorKey: "name",
    header: "Variant Name",
    cell: ({ row }) => (
      <Link
        href={`/admin/variants/${row.original.id}`}
        className="text-primary"
      >
        <p>{row.original.name}</p>
      </Link>
    ),
  },
  {
    accessorKey: "images",
    header: "Images",
    cell: ({ row }) =>
      row.original.variant_images ? (
        <div>
          <Image
            src={row.original.variant_images[0].file_url}
            alt={`error`}
            width={80}
            height={80}
          />
        </div>
      ) : (
        <p>No Images</p>
      ),
  },
  {
    accessorKey: "regular_price",
    header: "Regular Price",
    cell: ({ row }) => <p>{row.original.regular_price}</p>,
  },
  {
    accessorKey: "quantity",
    header: "Quantity",
    cell: ({ row }) => <p>{row.original.quantity}</p>,
  },
  {
    accessorKey: "purchase_cost",
    header: "Purchase Cost",
    cell: ({ row }) => <p>{row.original.purchase_cost}</p>,
  },
  {
    id: "actions",
    cell: ({ row }) => <Delete id={row.original.id} item="variants" />,
  },
];