From daf8b3a674d55ce4addefb7954264b1e3234f34e Mon Sep 17 00:00:00 2001
From: Nate Kelley <nate@buster.so>
Date: Mon, 22 Sep 2025 19:40:10 -0600
Subject: [PATCH] wrap core component in error boundary

---
 .../ui/charts/BusterChartDynamic.tsx          | 13 ++++---
 .../ui/inputs/AppCodeEditor/AppCodeEditor.tsx | 37 ++++++++++---------
 .../AppCodeEditor/AppCodeEditorDynamic.tsx    | 13 ++++---
 .../ui/report/DynamicReportEditor.tsx         |  9 +++--
 .../src/context/AppVersion/useAppVersion.tsx  |  2 +-
 5 files changed, 43 insertions(+), 31 deletions(-)

diff --git a/apps/web/src/components/ui/charts/BusterChartDynamic.tsx b/apps/web/src/components/ui/charts/BusterChartDynamic.tsx
index b6c0c92a5..11e023351 100644
--- a/apps/web/src/components/ui/charts/BusterChartDynamic.tsx
+++ b/apps/web/src/components/ui/charts/BusterChartDynamic.tsx
@@ -1,5 +1,6 @@
 import { ClientOnly } from '@tanstack/react-router';
 import { lazy, Suspense } from 'react';
+import { LazyErrorBoundary } from '@/components/features/global/LazyErrorBoundary';
 import { PreparingYourRequestLoader } from './LoadingComponents/ChartLoadingComponents';
 
 const BusterChartLazy = lazy(() =>
@@ -7,9 +8,11 @@ const BusterChartLazy = lazy(() =>
 );
 
 export const BusterChartDynamic = (props: Parameters<typeof BusterChartLazy>[0]) => (
-  <Suspense fallback={<PreparingYourRequestLoader text="Loading chart..." />}>
-    <ClientOnly>
-      <BusterChartLazy {...props} />
-    </ClientOnly>
-  </Suspense>
+  <LazyErrorBoundary>
+    <Suspense fallback={<PreparingYourRequestLoader text="Loading chart..." />}>
+      <ClientOnly>
+        <BusterChartLazy {...props} />
+      </ClientOnly>
+    </Suspense>
+  </LazyErrorBoundary>
 );
diff --git a/apps/web/src/components/ui/inputs/AppCodeEditor/AppCodeEditor.tsx b/apps/web/src/components/ui/inputs/AppCodeEditor/AppCodeEditor.tsx
index 890ca3879..1c8cb8d72 100644
--- a/apps/web/src/components/ui/inputs/AppCodeEditor/AppCodeEditor.tsx
+++ b/apps/web/src/components/ui/inputs/AppCodeEditor/AppCodeEditor.tsx
@@ -5,6 +5,7 @@ import type { EditorProps, OnMount } from '@monaco-editor/react';
 import { ClientOnly } from '@tanstack/react-router';
 import type React from 'react';
 import { forwardRef, lazy, Suspense, useCallback, useMemo } from 'react';
+import { LazyErrorBoundary } from '@/components/features/global/LazyErrorBoundary';
 import { useMount } from '@/hooks/useMount';
 import { cn } from '@/lib/utils';
 import { isServer } from '@/lib/window';
@@ -178,23 +179,25 @@ export const AppCodeEditor = forwardRef<AppCodeEditorHandle, AppCodeEditorProps>
         )}
         style={style}
       >
-        <ClientOnly fallback={<LoadingCodeEditor />}>
-          <Suspense fallback={<LoadingCodeEditor />}>
-            <Editor
-              key={useDarkMode ? 'dark' : 'light'}
-              height={height}
-              language={language}
-              className={className}
-              defaultValue={defaultValue}
-              value={value}
-              theme={useDarkMode ? 'night-owl' : 'github-light'}
-              onMount={onMountCodeEditor}
-              onChange={onChangeCodeEditor}
-              options={memoizedMonacoEditorOptions}
-              loading={null}
-            />
-          </Suspense>
-        </ClientOnly>
+        <LazyErrorBoundary>
+          <ClientOnly fallback={<LoadingCodeEditor />}>
+            <Suspense fallback={<LoadingCodeEditor />}>
+              <Editor
+                key={useDarkMode ? 'dark' : 'light'}
+                height={height}
+                language={language}
+                className={className}
+                defaultValue={defaultValue}
+                value={value}
+                theme={useDarkMode ? 'night-owl' : 'github-light'}
+                onMount={onMountCodeEditor}
+                onChange={onChangeCodeEditor}
+                options={memoizedMonacoEditorOptions}
+                loading={null}
+              />
+            </Suspense>
+          </ClientOnly>
+        </LazyErrorBoundary>
       </div>
     );
   }
diff --git a/apps/web/src/components/ui/inputs/AppCodeEditor/AppCodeEditorDynamic.tsx b/apps/web/src/components/ui/inputs/AppCodeEditor/AppCodeEditorDynamic.tsx
index 4b4c7e3a8..1b0c05658 100644
--- a/apps/web/src/components/ui/inputs/AppCodeEditor/AppCodeEditorDynamic.tsx
+++ b/apps/web/src/components/ui/inputs/AppCodeEditor/AppCodeEditorDynamic.tsx
@@ -1,5 +1,6 @@
 import { ClientOnly } from '@tanstack/react-router';
 import { lazy, Suspense } from 'react';
+import { LazyErrorBoundary } from '@/components/features/global/LazyErrorBoundary';
 import type { AppCodeEditorProps } from './AppCodeEditor';
 import { LoadingCodeEditor } from './LoadingCodeEditor';
 
@@ -13,10 +14,12 @@ const AppCodeEditor = lazy(() =>
 
 export const AppCodeEditorDynamic = (props: AppCodeEditorProps) => {
   return (
-    <ClientOnly fallback={<LoadingCodeEditor />}>
-      <Suspense fallback={<LoadingCodeEditor />}>
-        <AppCodeEditor {...props} />
-      </Suspense>
-    </ClientOnly>
+    <LazyErrorBoundary>
+      <ClientOnly fallback={<LoadingCodeEditor />}>
+        <Suspense fallback={<LoadingCodeEditor />}>
+          <AppCodeEditor {...props} />
+        </Suspense>
+      </ClientOnly>
+    </LazyErrorBoundary>
   );
 };
diff --git a/apps/web/src/components/ui/report/DynamicReportEditor.tsx b/apps/web/src/components/ui/report/DynamicReportEditor.tsx
index db7e5da9c..c0668aef7 100644
--- a/apps/web/src/components/ui/report/DynamicReportEditor.tsx
+++ b/apps/web/src/components/ui/report/DynamicReportEditor.tsx
@@ -1,4 +1,5 @@
 import { lazy, Suspense } from 'react';
+import { LazyErrorBoundary } from '@/components/features/global/LazyErrorBoundary';
 import { type UsePageReadyOptions, usePageReady } from '@/hooks/usePageReady';
 import type { ReportEditorProps } from './ReportEditor';
 import { ReportEditorSkeleton } from './ReportEditorSkeleton';
@@ -31,9 +32,11 @@ export const DynamicReportEditor = ({ loadingOptions, ...props }: DynamicReportE
   }
 
   return (
-    <Suspense fallback={<ReportEditorSkeleton />}>
-      <DynamicReportEditorBase {...props} />
-    </Suspense>
+    <LazyErrorBoundary>
+      <Suspense fallback={<ReportEditorSkeleton />}>
+        <DynamicReportEditorBase {...props} />
+      </Suspense>
+    </LazyErrorBoundary>
   );
 };
 
diff --git a/apps/web/src/context/AppVersion/useAppVersion.tsx b/apps/web/src/context/AppVersion/useAppVersion.tsx
index 01d78a4bd..ee1388788 100644
--- a/apps/web/src/context/AppVersion/useAppVersion.tsx
+++ b/apps/web/src/context/AppVersion/useAppVersion.tsx
@@ -24,7 +24,7 @@ export const useAppVersion = () => {
   useWindowFocus(() => {
     refetch().then(() => {
       if (isChanged) {
-        //  reloadWindow();
+        reloadWindow();
       }
     });
   });