From f0fa8d315de6aa70fb3e9a8401f0488038f847c3 Mon Sep 17 00:00:00 2001
From: Sjoerd <svink@graphpolaris.com>
Date: Mon, 30 Sep 2024 09:31:06 +0000
Subject: [PATCH] chore: extra error boundaries around components
---
apps/web/src/app/App.tsx | 48 ++++++++++++++++++++++++++++++----------
1 file changed, 36 insertions(+), 12 deletions(-)
diff --git a/apps/web/src/app/App.tsx b/apps/web/src/app/App.tsx
index d5b835c67..8384d11a8 100644
--- a/apps/web/src/app/App.tsx
+++ b/apps/web/src/app/App.tsx
@@ -7,7 +7,7 @@ import {
useQuerybuilderSettings,
useSessionCache,
} from '@graphpolaris/shared/lib/data-access';
-import { setCurrentTheme } from '@graphpolaris/shared/lib/data-access/store/configSlice';
+import { addError, setCurrentTheme } from '@graphpolaris/shared/lib/data-access/store/configSlice';
import { resetGraphQueryResults, queryingBackend } from '@graphpolaris/shared/lib/data-access/store/graphQueryResultSlice';
import { Query2BackendQuery, QueryMultiGraph } from '@graphpolaris/shared/lib/querybuilder';
import { Navbar } from '../components/navbar/navbar';
@@ -24,6 +24,7 @@ import { InspectorPanel } from '@graphpolaris/shared/lib/inspector';
import { SearchBar } from '@graphpolaris/shared/lib/sidebar/search/SearchBar';
import { Schema } from '@graphpolaris/shared/lib/schema/panel';
import { InsightDialog } from '@graphpolaris/shared/lib/insight-sharing';
+import { ErrorBoundary } from '@graphpolaris/shared/lib/components/errorBoundary';
export type App = {
load?: string;
@@ -93,21 +94,44 @@ export function App(props: App) {
<Resizable divisorSize={3} horizontal={true} defaultProportion={0.33}>
{tab !== undefined ? (
<div className="flex flex-col w-full h-full">
- {tab === 'Search' && <SearchBar onRemove={() => setTab(undefined)} />}
- {tab === 'Schema' && <Schema auth={authCheck} onRemove={() => setTab(undefined)} />}
+ {tab === 'Search' && (
+ <ErrorBoundary
+ fallback={<div>Something went wrong</div>}
+ onError={() => dispatch(addError('Something went wrong while trying to load the search bar'))}
+ >
+ <SearchBar onRemove={() => setTab(undefined)} />
+ </ErrorBoundary>
+ )}
+ {tab === 'Schema' && (
+ <ErrorBoundary
+ fallback={<div>Something went wrong</div>}
+ onError={() => dispatch(addError('Something went wrong while trying to load the schema panel'))}
+ >
+ <Schema auth={authCheck} onRemove={() => setTab(undefined)} />
+ </ErrorBoundary>
+ )}
</div>
) : null}
<Resizable divisorSize={3} horizontal={false}>
- <VisualizationPanel
- fullSize={() => {
- // setVisFullSize(!visFullSize);
- // tab === undefined && setTab('Schema');
- // tab !== undefined && setTab(undefined);
- }}
- />
-
- <QueryBuilder onRunQuery={runQuery} />
+ <ErrorBoundary
+ fallback={<div>Something went wrong</div>}
+ onError={() => dispatch(addError('Something went wrong while trying to load the visualization panel'))}
+ >
+ <VisualizationPanel
+ fullSize={() => {
+ // setVisFullSize(!visFullSize);
+ // tab === undefined && setTab('Schema');
+ // tab !== undefined && setTab(undefined);
+ }}
+ />
+ </ErrorBoundary>
+ <ErrorBoundary
+ fallback={<div>Something went wrong</div>}
+ onError={() => dispatch(addError('Something went wrong while trying to load the query builder'))}
+ >
+ <QueryBuilder onRunQuery={runQuery} />
+ </ErrorBoundary>
</Resizable>
</Resizable>
<InspectorPanel />
--
GitLab