App router migration error boundary component (#1121)

* Add basic Root Layout * Add metadata * Add reference included by next * Add comment to explain the default meta tags * Add public testing page to check the migration * Remove non required file * Make error boundary client component * Add ErrorBoundary component to root layout * Create app router error route test page --------- Co-authored-by: eleanorreem <[email protected]>
chaynHQ · Oct 8, 2024 · 9c6bb43 · 9c6bb43
1 parent 604f4e8
commit 9c6bb43
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 1 deletion.
diff --git a/app/error-route-test/page.tsx b/app/error-route-test/page.tsx
@@ -0,0 +1,8 @@
+'use client';
+
+export default function Page() {
+  setTimeout(() => {
+    throw new Error('An Error');
+  }, 1000);
+  return <div>ERROR TESTING PAGE</div>;
+}
diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,4 +1,5 @@
 import GoogleTagManagerScript from '../components/head/GoogleTagManagerScript';
+import ErrorBoundary from '../components/layout/ErrorBoundary';
 import rootMetadata from './rootMetadata';
 import RollbarScript from '../components/head/RollbarScript';
 
@@ -20,7 +21,7 @@ export default function RootLayout({
         */}
         <GoogleTagManagerScript />
         <RollbarScript />
-        {children}
+        <ErrorBoundary>{children}</ErrorBoundary>
       </body>
     </html>
   );

diff --git a/components/layout/ErrorBoundary.tsx b/components/layout/ErrorBoundary.tsx
@@ -1,3 +1,5 @@
+'use client';
+
 import { Alert, Snackbar } from '@mui/material';
 import { Component, ErrorInfo, ReactNode } from 'react';