custom error boundary

frontend/src/router.tsx

@@ -8,6 +8,8 @@ const Login = lazy(() => import('./views/Login'))
 const Archive = lazy(() => import('./views/Archive'))
 const Settings = lazy(() => import('./views/Settings'))
 
+const ErrorBoundary = lazy(() => import('./components/ErrorBoundary'))
+
 export const router = createBrowserRouter([
   {
     path: '/',
@@ -19,6 +21,11 @@ export const router = createBrowserRouter([
           <Suspense fallback={<CircularProgress />}>
             <Home />
           </Suspense >
+        ),
+        errorElement: (
+          <Suspense fallback={<CircularProgress />}>
+            <ErrorBoundary />
+          </Suspense >
         )
       },
       {
@@ -35,6 +42,11 @@ export const router = createBrowserRouter([
           <Suspense fallback={<CircularProgress />}>
             <Archive />
           </Suspense >
+        ),
+        errorElement: (
+          <Suspense fallback={<CircularProgress />}>
+            <ErrorBoundary />
+          </Suspense >
         )
       },
       {