fix: loading only outlet instead of whole page for child subroutes

src/components/layout/Layout.tsx

@@ -4,9 +4,10 @@ import { appRoutes } from '@/routes/config';
 import { Outlet, useLocation } from 'react-router-dom';
 import { Box, useMediaQuery, useTheme } from '@mui/material';
 import { Header } from './Header';
-import { useState } from 'react';
+import { Suspense, useState } from 'react';
 import { Toolbar } from './Toolbar';
 import { useAuth } from '@/hooks/useAuth';
+import { Loading } from '../routes/Loading';
 
 export const Layout = () => {
   const navItemConfigs = buildNavItems(appRoutes);
@@ -53,7 +54,9 @@ export const Layout = () => {
               overflowInline: 'auto',
             }}
           >
-            <Outlet />
+            <Suspense fallback={<Loading />}>
+              <Outlet />
+            </Suspense>
           </Box>
         </Box>