import DeleteIcon from '@mui/icons-material/Delete';
import { IconButton } from "@mui/material";
import { GridColDef } from "@mui/x-data-grid";
import { Promocode } from "@root/model/promocodes";
import { useMemo } from "react";

export function usePromocodeGridColDef(deletePromocode: (id: string) => void) {
    return useMemo<GridColDef<Promocode, string | number, string>[]>(() => [
        {
            field: "id",
            headerName: "ID",
            width: 30,
            sortable: false,
            valueGetter: ({ row }) => row.id,
        },
        {
            field: "codeword",
            headerName: "Кодовое слово",
            width: 160,
            sortable: false,
            valueGetter: ({ row }) => row.codeword,
        },
        {
            field: "factor",
            headerName: "Коэф. скидки",
            width: 120,
            sortable: false,
            valueGetter: ({ row }) => row.bonus.discount.factor,
        },
        {
            field: "activationCount",
            headerName: "Кол-во активаций",
            width: 140,
            sortable: false,
            valueGetter: ({ row }) => row.activationCount,
        },
        {
            field: "dueTo",
            headerName: "Истекает",
            width: 160,
            sortable: false,
            valueGetter: ({ row }) => row.dueTo * 1000,
            valueFormatter: ({ value }) => new Date(value).toLocaleString(),
        },
        {
            field: "delete",
            headerName: "",
            width: 60,
            sortable: false,
            renderCell: (params) => {
                return (
                    <IconButton onClick={() => deletePromocode(params.row.id)}>
                        <DeleteIcon />
                    </IconButton>
                );
            },
        },
    ], [deletePromocode]);
}