import styles from "./AdminPage.module.css";
import { Tabs } from "@mantine/core";
import PageBlock from "../../components/PageBlock/PageBlock.tsx";
import {
    IconCalendarEvent,
    IconCalendarUser,
    IconCoins,
    IconCurrencyDollar,
    IconQrcode, IconSubtask,
    IconTopologyStar3,
    IconUser,
} from "@tabler/icons-react";
import UsersTab from "./tabs/Users/UsersTab.tsx";
import { motion } from "framer-motion";
import FinancesTab from "./tabs/Finances/FinancesTab.tsx";
import WorkTimeTable from "./tabs/WorkTimeTable/ui/WorkTimeTable.tsx";
import { WorkShiftsTab } from "./tabs/WorkShifts/WorkShiftsTab.tsx";
import { TransactionsTab } from "./tabs/Transactions/TransactionsTab.tsx";
import { useSelector } from "react-redux";
import { RootState } from "../../redux/store.ts";
import OrganizationalStructureTab from "./tabs/OrganizationalStructureTab/OrganizationalStructureTab.tsx";
import { ReactNode } from "react";
import WorkShiftsPlanning from "./tabs/WorkShiftsPlanning/WorkShiftsPlanning.tsx";
import Attributes from "./tabs/Attributes/Attributes.tsx";

const AdminPage = () => {
    const userRole = useSelector((state: RootState) => state.auth.role);
    const isAdmin = userRole === "admin";

    const getTabPanel = (label: string, content: ReactNode) => {
        return (
            <Tabs.Panel value={label}>
                <motion.div
                    initial={{ opacity: 0 }}
                    animate={{ opacity: 1 }}
                    transition={{ duration: 0.2 }}>
                    {content}
                </motion.div>
            </Tabs.Panel>
        );
    };

    return (
        <div className={styles["container"]}>
            <PageBlock fullHeight>
                <Tabs
                    variant={"outline"}
                    keepMounted={false}
                    defaultValue={"users"}>
                    <Tabs.List>
                        <Tabs.Tab
                            value={"users"}
                            leftSection={<IconUser />}>
                            Пользователи
                        </Tabs.Tab>
                        {isAdmin && (
                            <Tabs.Tab
                                value={"finances"}
                                leftSection={<IconCurrencyDollar />}>
                                Финансы
                            </Tabs.Tab>
                        )}
                        <Tabs.Tab
                            value={"rolesAndPositions"}
                            leftSection={<IconTopologyStar3 />}>
                            Организационная структура
                        </Tabs.Tab>
                        {isAdmin && (
                            <Tabs.Tab
                                value={"workTimeTable"}
                                leftSection={<IconCalendarUser />}>
                                Рабочее время
                            </Tabs.Tab>
                        )}
                        <Tabs.Tab
                            value={"workShiftsPlanning"}
                            leftSection={<IconCalendarEvent />}>
                            Планирование смен
                        </Tabs.Tab>
                        <Tabs.Tab
                            value={"workShifts"}
                            leftSection={<IconQrcode />}>
                            Смены
                        </Tabs.Tab>
                        {isAdmin && (
                            <Tabs.Tab
                                value={"transactions"}
                                leftSection={<IconCoins />}>
                                Доходы и расходы
                            </Tabs.Tab>
                        )}
                        {isAdmin && (
                            <Tabs.Tab
                                value={"attributes"}
                                leftSection={<IconSubtask />}>
                                Атрибуты карточек
                            </Tabs.Tab>
                        )}
                    </Tabs.List>
                    {getTabPanel("users", <UsersTab />)}
                    {getTabPanel("rolesAndPositions", <OrganizationalStructureTab />)}
                    {getTabPanel("finances", <FinancesTab />)}
                    {getTabPanel("workTimeTable", <WorkTimeTable />)}
                    {getTabPanel("workShiftsPlanning", <WorkShiftsPlanning />)}
                    {getTabPanel("workShifts", <WorkShiftsTab />)}
                    {getTabPanel("transactions", <TransactionsTab />)}
                    {getTabPanel("attributes", <Attributes />)}
                </Tabs>
            </PageBlock>
        </div>
    );
};

export default AdminPage;
