school-dashboard-exercise/src/Pages/Unit/useTableColumns.tsx
2024-08-12 16:11:50 +03:00

99 lines
2.6 KiB
TypeScript

import { Space, TableColumnsType, Tooltip } from "antd";
import { Unit } from "../../types/Item";
import { FaPlus } from "react-icons/fa";
import useModalHandler from "../../utils/useModalHandler";
import { ModalEnum } from "../../enums/Model";
import { useObjectToEdit } from "../../zustand/ObjectToEditState";
import { RiDeleteBin6Fill } from "react-icons/ri";
import { MdOutlineEdit } from "react-icons/md";
import { useTranslation } from "react-i18next";
import { ABILITIES_ENUM } from "../../enums/abilities";
import { BsEyeFill } from "react-icons/bs";
import { useNavigate } from "react-router-dom";
import {
canAddUnit,
canDeleteUnit,
canEditUnit,
canShowUnit,
} from "../../utils/hasAbilityFn";
import ActionButtons from "../../Components/Table/ActionButtons";
export const useColumns = () => {
const { handel_open_model } = useModalHandler();
const { setObjectToEdit } = useObjectToEdit((state) => state);
const navigate = useNavigate();
const handelShow = (record: any) => {
navigate(`${ABILITIES_ENUM?.UNIT}/${record?.id}`);
};
const handelDelete = (data: any) => {
setObjectToEdit(data);
handel_open_model(ModalEnum?.UNIT_DELETE);
};
const handleEdit = (record: any) => {
setObjectToEdit(record);
handel_open_model(ModalEnum?.UNIT_EDIT);
};
const [t] = useTranslation();
const columns: TableColumnsType<Unit> = [
{
title: t("columns.id"),
dataIndex: "id",
key: "id",
align: "center",
render: (text, record) => record?.id,
},
{
title: `${t("columns.name")}`,
dataIndex: "name",
key: "name",
align: "center",
render: (text, record) => record?.name,
},
{
title: t("columns.lesson_count"),
dataIndex: "lesson_count",
key: "lesson_count",
align: "center",
render: (text, record) => record?.lessons_count,
},
{
title: canAddUnit ? (
<button
onClick={() => handel_open_model(ModalEnum?.UNIT_ADD)}
className="add_button"
>
{t("practical.add")} {t("models.unit")} <FaPlus />
</button>
) : (
""
),
key: "actions",
align: "end",
width: "25vw",
render: (_text, record, index) => {
return (
<ActionButtons
canDelete={canDeleteUnit}
canEdit={canEditUnit}
canShow={canShowUnit}
index={index}
onDelete={() => handelDelete(record)}
onEdit={() => handleEdit(record)}
onShow={() => handelShow(record)}
/>
);
},
},
];
return columns;
};