diff --git a/packages/next-common/components/errorBoundary.js b/packages/next-common/components/errorBoundary.js
index a1ea8abdf6..269cc26637 100644
--- a/packages/next-common/components/errorBoundary.js
+++ b/packages/next-common/components/errorBoundary.js
@@ -7,7 +7,8 @@ import {
 import PartialBoundaryLayout from "next-common/components/layout/partialBoundaryLayout";
 import ErrorLayout from "next-common/components/layout/errorLayout";
 import { reportClientError } from "next-common/services/reportClientError";
-import { CHAIN } from "next-common/utils/constants";
+import { CHAIN, IS_PRODUCTION } from "next-common/utils/constants";
+import Router from "next/router";
 
 class ErrorBoundary extends React.Component {
   constructor(props) {
@@ -19,18 +20,30 @@ class ErrorBoundary extends React.Component {
     return { hasError: true, error };
   }
 
+  componentDidMount() {
+    Router.events.on("routeChangeStart", this.resetErrorState);
+  }
+
+  componentWillUnmount() {
+    Router.events.off("routeChangeStart", this.resetErrorState);
+  }
+
   componentDidCatch(error, errorInfo) {
     const errorData = {
       chain: CHAIN,
       url: typeof window !== "undefined" ? window.location.href : "",
       address: this.props.user?.address,
+      code: "",
       error: error.message,
       source: "client",
       stack: error.stack,
       componentStack: errorInfo.componentStack,
+      userAgent: window?.navigator?.userAgent || "",
     };
 
-    reportClientError(errorData);
+    if (IS_PRODUCTION) {
+      reportClientError(errorData);
+    }
   }
 
   resetErrorState = () => {
@@ -70,4 +83,4 @@ class ErrorBoundary extends React.Component {
   }
 }
 
-export default React.memo(ErrorBoundary);
+export default ErrorBoundary;
diff --git a/packages/next-common/components/pages/appShell.js b/packages/next-common/components/pages/appShell.js
index 6963fa49f1..091b6f8bd7 100644
--- a/packages/next-common/components/pages/appShell.js
+++ b/packages/next-common/components/pages/appShell.js
@@ -6,6 +6,7 @@ import { store } from "next-common/store";
 import GlobalProvider from "next-common/context/global";
 import Head from "next/head";
 import SystemVersionUpgrade from "next-common/components/systemVersionUpgrade";
+import ErrorBoundary from "next-common/components/errorBoundary";
 import dynamic from "next/dynamic";
 
 NProgress.configure({
@@ -70,7 +71,9 @@ export function AppShell({ Component, pageProps }) {
           pathname={pathname}
         >
           <ClientOnlySystemUpgrade />
-          <Component {...otherProps} />
+          <ErrorBoundary user={user}>
+            <Component {...otherProps} />
+          </ErrorBoundary>
         </GlobalProvider>
       </Provider>
       {/* </PostHogProvider> */}