import { PageTitle } from "@common/components";

import { TabBar } from "./tab-bar";

import { useTabStore } from "@/store/tab-store";

function StatisticsPageLayout({ children }: { children: React.ReactNode }) {
    const { activeTabId, tabs } = useTabStore();

    const pageTitle = tabs.find((t) => t.id === activeTabId);

    const menuPaths = pageTitle?.path?.split(">").map((path) => path.trim());

    return (
        <div className="h-auto min-h-full bg-container pb-2 flex-1">
            <TabBar />
            <PageTitle
                title={pageTitle?.label ?? ""}
                menuPaths={menuPaths ?? []}
            />
            {children}
        </div>
    );
}

export { StatisticsPageLayout };