fix: An error in the client causes a white screen crash.

Signed-off-by: The1111mp <[email protected]>

src/renderer/components/ErrorBoundary/index.tsx

@@ -0,0 +1,15 @@
+import { Result } from 'antd';
+import { useRouteError } from 'react-router-dom';
+
+export function ErrorBoundary() {
+ let error = useRouteError();
+
+ return (
+ <Result
+ status="error"
+ title="Sorry, something went wrong."
+ subTitle={(error as any).message}
+ style={{marginTop: 100}}
+ />
+ );
+}

src/renderer/pages/versions/index.tsx

@@ -39,13 +39,19 @@ dayjs.extend(localizedFormat);
 const { Title } = Typography;
 
 export async function loader() {
- const versions = Promise.all([
- window.Context.getAllNodeVersions(),
- window.Context.getInstalledNodeVersions(),
- window.Context.getCurrentVersion(),
- ]);
+ try {
+ const versions = Promise.all([
+ window.Context.getAllNodeVersions(),
+ window.Context.getInstalledNodeVersions(),
+ window.Context.getCurrentVersion(),
+ ]).catch((_err) => {
+ return [[], [], ''];
+ });
 
- return defer({ versions: versions });
+ return defer({ versions: versions });
+ } catch (err) {
+ return defer({ versions: [[], [], ''] });
+ }
 }
 
 export function VersionsRoute() {

src/renderer/routes.tsx

@@ -1,6 +1,7 @@
 import { createMemoryRouter } from 'react-router-dom';
 
 import Home from './pages/home';
+import { ErrorBoundary } from './components/ErrorBoundary';
 import { VersionsRoute, loader as VersionsLoader } from './pages/versions';
 
 import type { RouteObject } from 'react-router-dom';
@@ -14,14 +15,17 @@ const routes: RouteObject[] = [
  path: 'all',
  loader: VersionsLoader,
  element: <VersionsRoute />,
+ errorElement: <ErrorBoundary />,
  },
  {
  path: 'installed',
  lazy: () => import('./pages/installed'),
+ errorElement: <ErrorBoundary />,
  },
  {
  path: 'projects',
  lazy: () => import('./pages/projects'),
+ errorElement: <ErrorBoundary />,
  },
  ],
  },