import { IconButton } from "@mui/material";
import { GridColDef } from "@mui/x-data-grid";
import { Promocode } from "@root/model/promocodes";
import { useMemo, useState } from "react";

import { BarChart, Delete, Edit } from "@mui/icons-material";
import { promocodeApi } from "@root/api/promocode/requests";

export function usePromocodeGridColDef(
  setEdit: (id: string) => void,
  setStatistics: (id: string) => void,
  deletePromocode: (id: string) => void
) {
  const validity = (value: string | number) => {
    if (value === 0) {
      return "неоганичен";
    } else {
      return new Date(value).toLocaleString();
    }
  };
  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 }) =>
          Math.round(row.bonus.discount.factor * 1000) / 1000,
      },
      {
        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 }) => `${validity(value)}`,
      },
      {
        field: "description",
        headerName: "Описание",
        minWidth: 200,
        flex: 1,
        sortable: false,
        valueGetter: ({ row }) => row.description,
      },
      {
        field: "edit",
        headerName: "",
        width: 60,
        sortable: false,
        renderCell: (params) => {
            return (
                <IconButton
                    onClick={() => {
                        setEdit(params.row.id);
                    }}
                >
                    <Edit />
                </IconButton>
            );
        },
      },
      {
        field: "settings",
        headerName: "",
        width: 60,
        sortable: false,
        renderCell: (params) => {
          return (
            <IconButton
              onClick={() => {
                setStatistics(params.row.id);
                promocodeApi.getPromocodeStatistics(params.row.id, 0, 0);
              }}
            >
              <BarChart />
            </IconButton>
          );
        },
      },
      {
        field: "delete",
        headerName: "",
        width: 60,
        sortable: false,
        renderCell: (params) => {
          return (
            <IconButton onClick={() => deletePromocode(params.row.id)}>
              <Delete />
            </IconButton>
          );
        },
      },
    ],
    [deletePromocode, setStatistics, setEdit]
  );
}