Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-23 20:33:16 -05:00
Code Issues Activity

refactor(console): promote error boundary to highest level

Browse source
This commit is contained in:
Charles Zhao 2022-05-05 13:24:01 +08:00
parent 39bf3ccd8a
commit 2ed7b39214
No known key found for this signature in database
GPG key ID: 4858774754C92DF2
2 changed files with 43 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

69
packages/console/src/App.tsx
View file

@ -8,6 +8,7 @@ import './scss/normalized.scss';
import * as styles from './App.module.scss'; import * as styles from './App.module.scss';
import AppContent from './components/AppContent'; import AppContent from './components/AppContent';
import { getPath, sections } from './components/AppContent/components/Sidebar'; import { getPath, sections } from './components/AppContent/components/Sidebar';
import ErrorBoundary from './components/ErrorBoundary';
import Toast from './components/Toast'; import Toast from './components/Toast';
import { themeStorageKey, logtoApiResource } from './consts'; import { themeStorageKey, logtoApiResource } from './consts';
import { RequestError } from './hooks/use-api'; import { RequestError } from './hooks/use-api';
@ -66,41 +67,43 @@ const Main = () => {
}, [location.pathname, navigate]); }, [location.pathname, navigate]);
return ( return (
<SWRConfig value={{ fetcher }}> <ErrorBoundary>
<Toast /> <SWRConfig value={{ fetcher }}>
<Routes> <Toast />
<Route path="callback" element={<Callback />} /> <Routes>
<Route element={<AppContent />}> <Route path="callback" element={<Callback />} />
<Route path="*" element={<NotFound />} /> <Route element={<AppContent />}>
<Route path="applications"> <Route path="*" element={<NotFound />} />
<Route index element={<Applications />} /> <Route path="applications">
<Route path=":id"> <Route index element={<Applications />} />
<Route index element={<Navigate to="settings" />} /> <Route path=":id">
<Route path="settings" element={<ApplicationDetails />} /> <Route index element={<Navigate to="settings" />} />
<Route path="advanced-settings" element={<ApplicationDetails />} /> <Route path="settings" element={<ApplicationDetails />} />
<Route path="advanced-settings" element={<ApplicationDetails />} />
</Route>
</Route> </Route>
<Route path="api-resources">
<Route index element={<ApiResources />} />
<Route path=":id" element={<ApiResourceDetails />} />
</Route>
<Route path="connectors">
<Route index element={<Connectors />} />
<Route path="social" element={<Connectors />} />
<Route path=":connectorId" element={<ConnectorDetails />} />
</Route>
<Route path="users">
<Route index element={<Users />} />
<Route path=":id" element={<UserDetails />} />
</Route>
<Route path="sign-in-experience">
<Route index element={<Navigate to="experience" />} />
<Route path=":tab" element={<SignInExperience />} />
</Route>
<Route path="settings" element={<Settings />} />
</Route> </Route>
<Route path="api-resources"> </Routes>
<Route index element={<ApiResources />} /> </SWRConfig>
<Route path=":id" element={<ApiResourceDetails />} /> </ErrorBoundary>
</Route>
<Route path="connectors">
<Route index element={<Connectors />} />
<Route path="social" element={<Connectors />} />
<Route path=":connectorId" element={<ConnectorDetails />} />
</Route>
<Route path="users">
<Route index element={<Users />} />
<Route path=":id" element={<UserDetails />} />
</Route>
<Route path="sign-in-experience">
<Route index element={<Navigate to="experience" />} />
<Route path=":tab" element={<SignInExperience />} />
</Route>
<Route path="settings" element={<Settings />} />
</Route>
</Routes>
</SWRConfig>
); );
}; };

17
packages/console/src/components/AppContent/index.tsx
View file

@ -2,7 +2,6 @@ import { useLogto } from '@logto/react';
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import { Outlet, useHref } from 'react-router-dom'; import { Outlet, useHref } from 'react-router-dom';
import ErrorBoundary from '../ErrorBoundary';
import LogtoLoading from '../LogtoLoading'; import LogtoLoading from '../LogtoLoading';
import Sidebar from './components/Sidebar'; import Sidebar from './components/Sidebar';
import Topbar from './components/Topbar'; import Topbar from './components/Topbar';
@ -23,17 +22,15 @@ const AppContent = () => {
} }
return ( return (
<ErrorBoundary> <div className={styles.app}>
<div className={styles.app}> <Topbar />
<Topbar /> <div className={styles.content}>
<div className={styles.content}> <Sidebar />
<Sidebar /> <div className={styles.main}>
<div className={styles.main}> <Outlet />
<Outlet />
</div>
</div> </div>
</div> </div>
</ErrorBoundary> </div>
); );
}; };