import { Button } from "@/components/ui/button";
import { ColumnDef } from "@tanstack/react-table";
import { format } from "date-fns-tz";
import { Trash } from "lucide-react";

// This type is used to define the shape of our data.
// You can use a Zod schema here if you want.
export type Adjustmnets = {
    siloAdjust_id: string;
    currentStockLevel: string;
    newLevel: number;
    dateAdjusted: string;
    lastDateAdjusted: string;
    comment: string;
    commentAddedBy: string;
    commentDate: string;
    add_user: string;
};

export const ocpColumns = (
    clearLog: (label: any) => void
): ColumnDef<any>[] => [
    {
        accessorKey: "message",
        header: () => <div className="text-left">Error Message</div>,
        cell: ({ row }) => {
            if (row.getValue("message")) {
                return (
                    <div className="text-left font-medium text-pretty max-w-48">
                        {row.getValue("message")}
                    </div>
                );
            }
        },
    },
    {
        accessorKey: "created_at",
        header: "Error Date",
        cell: ({ row }) => {
            if (row.getValue("created_at")) {
                const correctDate: any = row.getValue("created_at");
                const strippedDate = correctDate.replace("Z", ""); // Remove Z
                const formattedDate = format(strippedDate, "MM/dd/yyyy HH:mm");
                return (
                    <div className="text-left font-medium">{formattedDate}</div>
                );
            }
        },
    },
    {
        accessorKey: "clear",
        header: "Clear",
        cell: ({ row }) => {
            const label = row.original;
            return (
                <Button size="icon" onClick={() => clearLog(label)}>
                    <Trash />
                </Button>
            );
        },
    },
];