"use client";

import { ColumnDef } from "@tanstack/react-table";
import Link from "next/link";

// This type is used to define the shape of our data.
// You can use a Zod schema here if you want.


export const columns: ColumnDef<OrdersType>[] = [

  {
    accessorKey: "orderId",
    header: "Order #ID",
    cell: ({ row }) => <p className="font-semibold">{row.id}</p>,
  },
  {
    accessorKey: "Navigation",
    header: "Navigation",
    cell: ({ row }) => {
      return (
        <Link
          href={`/admin/orders/${row.original.uuid}`}
          className="text-primary"
          aria-label={`Go to order details for order with UUID ${row.original.uuid}`}>View Order</Link>
      )
    }
  },
  {
    accessorKey: "order Date",
    header: "order Date",
    cell: ({ row }) => <p className="font-semibold">{new Date(row.original.order_date).toLocaleString("en-GB", {
        day: "2-digit",
        month: "2-digit",
        year: "numeric",
        hour: "numeric",
        minute: "2-digit",
        second: "2-digit",
        hour12: true,
      })}</p>,
  },
  {
    accessorKey: "ordered By",
    header: "Ordered By",
    cell: ({ row }) => <p>{row.original.shipment_details?.name}</p>
  },
  {
    accessorKey: "total Amount",
    header: "Total Amount",
    cell: ({ row }) => <p>{row.original.order_total_amount}  Tk</p>
  },
  {
    accessorKey: "Receiver Phone",
    header: "Receiver Phone",
    cell: ({ row }) => <p>{row.original.shipment_details?.phone}</p>
  },
  {
    accessorKey: "Order Status",
    header: "Order Status",
    cell: ({ row }) => (
      <p className="text-primary">
        {row.original.order_status}
      </p>
    ),
  },
];