From c6107ba995f952f6e00eb6481117d06b8a3aa44e Mon Sep 17 00:00:00 2001
From: chaojun <chaojun@opensquare.network>
Date: Mon, 22 Jun 2026 15:16:05 +0800
Subject: [PATCH 1/2] feat: integrate ErrorBoundary component into AppShell for
 improved error handling

---
 packages/next-common/components/errorBoundary.js  | 10 +++++++---
 packages/next-common/components/pages/appShell.js |  5 ++++-
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/packages/next-common/components/errorBoundary.js b/packages/next-common/components/errorBoundary.js
index a1ea8abdf6..62ed7a817a 100644
--- a/packages/next-common/components/errorBoundary.js
+++ b/packages/next-common/components/errorBoundary.js
@@ -7,7 +7,7 @@ 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";
 
 class ErrorBoundary extends React.Component {
   constructor(props) {
@@ -24,13 +24,17 @@ class ErrorBoundary extends React.Component {
       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 +74,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> */}

From a741647b8464db8f842e9efa266fd688b0d9b3bc Mon Sep 17 00:00:00 2001
From: chaojun <chaojun@opensquare.network>
Date: Mon, 22 Jun 2026 15:54:58 +0800
Subject: [PATCH 2/2] fix

---
 packages/next-common/components/errorBoundary.js | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/packages/next-common/components/errorBoundary.js b/packages/next-common/components/errorBoundary.js
index 62ed7a817a..269cc26637 100644
--- a/packages/next-common/components/errorBoundary.js
+++ b/packages/next-common/components/errorBoundary.js
@@ -8,6 +8,7 @@ import PartialBoundaryLayout from "next-common/components/layout/partialBoundary
 import ErrorLayout from "next-common/components/layout/errorLayout";
 import { reportClientError } from "next-common/services/reportClientError";
 import { CHAIN, IS_PRODUCTION } from "next-common/utils/constants";
+import Router from "next/router";
 
 class ErrorBoundary extends React.Component {
   constructor(props) {
@@ -19,6 +20,14 @@ 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,