diff --git a/apps/st/src/components/Dashboard.tsx b/apps/st/src/components/statistics/Dashboard.tsx similarity index 100% rename from apps/st/src/components/Dashboard.tsx rename to apps/st/src/components/statistics/Dashboard.tsx diff --git a/apps/st/src/pages/statistics/ui/statistics-page.tsx b/apps/st/src/pages/statistics/ui/statistics-page.tsx index a228a4d46..e50f90a0d 100644 --- a/apps/st/src/pages/statistics/ui/statistics-page.tsx +++ b/apps/st/src/pages/statistics/ui/statistics-page.tsx @@ -1,26 +1,28 @@ "use client"; -import { Suspense, useRef, useEffect } from "react"; +import { Suspense, useEffect, useRef } from "react"; import dynamic from "next/dynamic"; -import { useTabStore } from "@/store/tab-store"; -import { useAdminStore } from "@/store/admin-store"; -import Dashboard from "@/components/Dashboard"; + import { SkeletonPage } from "@/shared/ui/skeleton-page"; import "@rsone/components/index.css"; +import Dashboard from "@/components/statistics/Dashboard"; +import { useAdminStore } from "@/store/admin-store"; +import { useTabStore } from "@/store/tab-store"; + const StatisticsPage = () => { const { tabs, activeTabId } = useTabStore(); const fetchAdminInfo = useAdminStore((state) => state.fetchAdminInfo); - + // 컴포넌트 캐시를 useRef로 유지 (재렌더링 시에도 유지됨) const componentCache = useRef(new Map()); // 닫힌 탭의 컴포넌트는 캐시에서 제거 (메모리 정리) useEffect(() => { - const currentTabIds = new Set(tabs.map(tab => tab.id)); + const currentTabIds = new Set(tabs.map((tab) => tab.id)); const cachedTabIds = Array.from(componentCache.current.keys()); - + cachedTabIds.forEach((cachedId) => { if (!currentTabIds.has(cachedId)) { componentCache.current.delete(cachedId); @@ -48,15 +50,15 @@ const StatisticsPage = () => { if (!componentCache.current.has(tab.id)) { const componentName = tab.urlPath; const parentComponentName = tab.parentEngNm; - + const DynamicComponent = dynamic( - () => import(`@/components/statistics/${parentComponentName}/${componentName}`), - { - ssr: false, - loading: () => - } + () => + import( + `@/components/statistics${parentComponentName ? `/${parentComponentName}` : ""}/${componentName}` + ), + { ssr: false, loading: () => }, ); - + componentCache.current.set(tab.id, DynamicComponent); } @@ -68,7 +70,7 @@ const StatisticsPage = () => { return (
}> @@ -80,4 +82,4 @@ const StatisticsPage = () => { ); }; -export default StatisticsPage; \ No newline at end of file +export default StatisticsPage;