refactor: 각각의 컴포넌트를 Suspense로 묶도록 수정

boostcampwm-2024 · Dec 3, 2024 · 11f0254 · 11f0254
1 parent bba6c4a
commit 11f0254
Showing 1 changed file with 11 additions and 9 deletions.
diff --git a/packages/frontend/src/App.tsx b/packages/frontend/src/App.tsx
@@ -1,4 +1,4 @@
-import { Routes, Route, createBrowserRouter, RouterProvider } from 'react-router-dom';
+import { createBrowserRouter, RouterProvider } from 'react-router-dom';
 import { lazy, Suspense, useEffect } from 'react';
 import Layout from '@/components/layout/Layout';
 import LoadingSpinner from '@/components/common/LoadingSpinner';
@@ -18,23 +18,29 @@ const router = createBrowserRouter([
         index: true,
         element: (
           <PublicRoute>
-            <LandingPage />
+            <Suspense fallback={<LoadingSpinner />}>
+              <LandingPage />
+            </Suspense>
           </PublicRoute>
         ),
       },
       {
         path: 'lobby',
         element: (
           <PrivateRoute>
-            <LobbyPage />
+            <Suspense fallback={<LoadingSpinner />}>
+              <LobbyPage />
+            </Suspense>
           </PrivateRoute>
         ),
       },
       {
         path: 'game/:gsid',
         element: (
           <PrivateRoute>
-            <GamePage />
+            <Suspense fallback={<LoadingSpinner />}>
+              <GamePage />
+            </Suspense>
           </PrivateRoute>
         ),
       },
@@ -55,11 +61,7 @@ function App() {
     };
   }, []);
 
-  return (
-    <Suspense fallback={<LoadingSpinner />}>
-      <RouterProvider router={router} />
-    </Suspense>
-  );
+  return <RouterProvider router={router} />;
 }
 
 export default App;