81 lines
2.5 KiB
TypeScript
81 lines
2.5 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useCallback } from "react";
|
|
import { usePathname } from "next/navigation";
|
|
import { useQueryClient, useQuery } from "@tanstack/react-query";
|
|
|
|
import type { MenuItem } from "@/entities/menu";
|
|
import { useMenuStore, useAlertStore } from "@/shared/lib";
|
|
import { useTabStore, getTabStoreState } from "@/store/tab-store";
|
|
import { getConfig } from "@common/config";
|
|
import { getCookie } from "@/shared/lib";
|
|
import { getMenuList } from "../../../../packages/common/components/src/api";
|
|
import { ENDPOINT } from "@/shared/config";
|
|
|
|
import { BaseLayout } from "@common/components";
|
|
import { StatisticsPageLayout } from "@/shared/ui/statistics-page-layout";
|
|
|
|
const appConfig = getConfig();
|
|
const userId = getCookie(appConfig.AUTH_USER_ID ?? "");
|
|
const appSiteId = getCookie("site-id-key") ?? "";
|
|
const isLoggedIn = !!userId;
|
|
|
|
export default function WithBaseLayout({
|
|
children,
|
|
}: {
|
|
children: React.ReactNode;
|
|
}) {
|
|
const pathname = usePathname();
|
|
const queryClient = useQueryClient();
|
|
|
|
const setCurrentMenuInfo = useMenuStore((state) => state.setCurrentMenuInfo);
|
|
|
|
const addTab = useTabStore((state) => state.addTab);
|
|
const setActiveTab = useTabStore((state) => state.setActiveTab);
|
|
const setMenuList = useTabStore((state) => state.setMenuList);
|
|
const alert = useAlertStore((state) => state.setMessage);
|
|
|
|
const { data: menuListData } = useQuery({
|
|
queryKey: [ENDPOINT.CMS_SERVICE.MENU_ROLES],
|
|
queryFn: () => getMenuList(appSiteId),
|
|
enabled: isLoggedIn,
|
|
});
|
|
|
|
useEffect(() => {
|
|
if (menuListData) {
|
|
setMenuList(menuListData);
|
|
}
|
|
}, [menuListData, setMenuList]);
|
|
|
|
useEffect(() => {
|
|
if (!pathname) return;
|
|
|
|
// pathname이 변경될 때만 실행되도록 tabs를 직접 가져옴
|
|
const currentTabs = getTabStoreState().tabs;
|
|
const tab = currentTabs.find((t) => t.path === pathname);
|
|
if (tab) {
|
|
setActiveTab(tab.id);
|
|
}
|
|
}, [pathname, setActiveTab]);
|
|
|
|
const handleMenuClick = useCallback((item: MenuItem) => {
|
|
setCurrentMenuInfo(item);
|
|
const addTabResult: boolean = addTab(item);
|
|
|
|
if (!addTabResult) {
|
|
alert(`최대 추가 할 수 있는 화면 수를 초과 하였습니다.
|
|
기존 화면을 닫은 후 이용해주세요.`);
|
|
}
|
|
}, [setCurrentMenuInfo, addTab]);
|
|
|
|
return (
|
|
<BaseLayout
|
|
queryClient={queryClient}
|
|
currentPath={pathname ?? ""}
|
|
handleMenuClick={handleMenuClick}
|
|
>
|
|
<StatisticsPageLayout>{children}</StatisticsPageLayout>
|
|
</BaseLayout>
|
|
);
|
|
}
|