import { FC } from "react";
import { IconBlocks, IconEdit, IconTags } from "@tabler/icons-react";
import { Tabs } from "@mantine/core";
import {
    GeneralTab,
    ModulesTab,
} from "@/drawers/common/ProjectEditorDrawer/tabs";
import TagsTab from "@/drawers/common/ProjectEditorDrawer/tabs/TagsTab/TagsTab";
import { ProjectSchema } from "@/lib/client";
import styles from "../ProjectEditorDrawer.module.css";

type Props = {
    value: ProjectSchema;
    onChange: (value: ProjectSchema) => void;
    onDelete: (value: ProjectSchema) => void;
};

const ProjectEditorBody: FC<Props> = props => {
    return (
        <Tabs
            defaultValue="general"
            classNames={{ tab: styles.tab }}>
            <Tabs.List>
                <Tabs.Tab
                    value="general"
                    leftSection={<IconEdit />}>
                    Общая информация
                </Tabs.Tab>
                <Tabs.Tab
                    value="modules"
                    leftSection={<IconBlocks />}>
                    Модули
                </Tabs.Tab>
                <Tabs.Tab
                    value={"tags"}
                    leftSection={<IconTags />}>
                    Теги
                </Tabs.Tab>
            </Tabs.List>
            <Tabs.Panel value={"general"}>
                <GeneralTab {...props} />
            </Tabs.Panel>
            <Tabs.Panel value={"modules"}>
                <ModulesTab {...props} />
            </Tabs.Panel>
            <Tabs.Panel value={"tags"}>
                <TagsTab {...props} />
            </Tabs.Panel>
        </Tabs>
    );
};

export default ProjectEditorBody;