import { useMemo } from "react";
import { MRT_ColumnDef } from "mantine-react-table";
import { ActionIcon, Image, Radio } from "@mantine/core";
import { CardSummary } from "../../../../../../../client";
import { usePrefillCardContext } from "../../../../../contexts/PrefillCardContext.tsx";

const useCardsTableColumns = () => {
    return useMemo<MRT_ColumnDef<CardSummary>[]>(
        () => [
            {
                accessorKey: "select",
                header: "",
                size: 5,
                enableSorting: false,
                Cell: ({ row }) => {
                    const { selectPrefillCard, selectedPrefillCard } = usePrefillCardContext();
                    const checked = row.original.id === selectedPrefillCard?.id;
                    return (
                        <Radio
                            checked={checked}
                            onChange={() => {
                                selectPrefillCard(row.original.id);
                            }}
                        />
                    );
                },
            },
            {
                accessorKey: "id",
                header: "ID",
                size: 20,
            },
            {
                accessorKey: "clientName",
                header: "Клиент",
                size: 60,
                enableSorting: false,
            },
            {
                accessorKey: "name",
                header: "Название",
                enableSorting: false,
                size: 60,
            },
            {
                header: "Дата создания",
                accessorKey: "createdAt",
                size: 10,
                Cell: ({ row }) =>
                    new Date(row.original.createdAt).toLocaleString("ru-RU").substring(0, 17),
                enableSorting: true,
                sortingFn: (rowA, rowB) =>
                    new Date(rowB.original.createdAt).getTime() -
                    new Date(rowA.original.createdAt).getTime(),
            },
            {
                header: "МП",
                size: 5,
                Cell: ({ row }) => (
                    <ActionIcon variant={"transparent"}>
                        <Image
                            src={row.original.baseMarketplace?.iconUrl || ""}
                        />
                    </ActionIcon>
                ),
            },
        ],
        [],
    );
};

export default useCardsTableColumns;
