import { BaseTable } from "../../../../../../components/BaseTable/BaseTable.tsx";
import { useWorkShiftsPlanningContext } from "../../contexts/WorkShiftsPlanningContext.tsx";
import useWorkShiftsPlanningColumns from "../../hooks/useWorkShiftsPlanningColumns.tsx";
import { MRT_TableOptions } from "mantine-react-table";
import { WorkShiftPlanningRow } from "../../types/WorkShiftPlanningRow.tsx";
import { ActionIcon, Flex, Tooltip } from "@mantine/core";
import { IconEyeOff } from "@tabler/icons-react";

const WorkShiftsPlanningTable = () => {
    const {
        tableRows,
        shownUsers,
        setShownUsers,
    } = useWorkShiftsPlanningContext();

    const columns = useWorkShiftsPlanningColumns();

    return (
        <BaseTable
            data={tableRows}
            columns={columns}
            restProps={
                {
                    enableColumnActions: false,
                    enableSorting: false,
                    enableRowActions: true,
                    renderRowActions: ({ row }) => (
                        <Flex gap="md">
                            <Tooltip label="Скрыть">
                                <ActionIcon
                                    onClick={() => {
                                        setShownUsers(
                                            shownUsers.filter(
                                                user => user.id !== row.original.user.id,
                                            ),
                                        );
                                    }}
                                    variant={"default"}>
                                    <IconEyeOff />
                                </ActionIcon>
                            </Tooltip>
                        </Flex>
                    ),
                } as MRT_TableOptions<WorkShiftPlanningRow>
            }
        />
    );
};

export default WorkShiftsPlanningTable;
