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

const useCardsTableColumns = () => {
    return useMemo<MRT_ColumnDef<CardSummary>[]>(
        () => [
            {
                accessorKey: "id",
                header: "Номер",
                size: 20,
            },
            {
                header: "Маркетплейс",
                size: 10,
                Cell: ({ row }) => (
                    <ActionIcon variant={"transparent"}>
                        <Image
                            src={row.original.baseMarketplace?.iconUrl || ""}
                        />
                    </ActionIcon>
                ),
            },
            {
                header: "Дата создания",
                accessorKey: "createdAt",
                Cell: ({ row }) =>
                    new Date(row.original.createdAt).toLocaleString("ru-RU"),
                enableSorting: true,
                sortingFn: (rowA, rowB) =>
                    new Date(rowB.original.createdAt).getTime() -
                    new Date(rowA.original.createdAt).getTime(),
            },
            {
                accessorKey: "name",
                header: "Название",
                enableSorting: false,
            },
            {
                accessorKey: "clientName",
                header: "Клиент",
                enableSorting: false,
            },
            {
                header: "Общая стоимость",
                Cell: ({ row }) =>
                    row.original.totalPrice.toLocaleString("ru-RU") + "₽",
                accessorKey: "totalPrice",
            },
        ],
        [],
    );
};

export default useCardsTableColumns;
