Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-01-06 20:40:08 -05:00
Code Issues Activity

style(ui): hide back CTA for root error pages (#3407)

Browse source
This commit is contained in:
simeng-li 2023-03-14 22:20:05 +08:00 committed by GitHub
parent 2bd5f36fc3
commit cc7f3fcdab
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 16 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
packages/ui/src/App.tsx
View file

@ -80,7 +80,7 @@ const App = () => {
<Route element={<AppLayout />}> <Route element={<AppLayout />}>
<Route <Route
path="unknown-session" path="unknown-session"
element={<ErrorPage message="error.invalid_session" />} element={<ErrorPage isRootPath message="error.invalid_session" />}
/> />
<Route path="springboard" element={<Springboard />} /> <Route path="springboard" element={<Springboard />} />
@ -128,7 +128,7 @@ const App = () => {
<Route path="callback/:connectorId" element={<Callback />} /> <Route path="callback/:connectorId" element={<Callback />} />
</Route> </Route>
<Route path="*" element={<ErrorPage />} /> <Route path="*" element={<ErrorPage isRootPath />} />
</Route> </Route>
</Routes> </Routes>
</AppBoundary> </AppBoundary>

21
packages/ui/src/pages/ErrorPage/index.tsx
View file

@ -16,9 +16,10 @@ type Props = {
title?: TFuncKey; title?: TFuncKey;
message?: TFuncKey; message?: TFuncKey;
rawMessage?: string; rawMessage?: string;
isRootPath?: boolean;
}; };
const ErrorPage = ({ title = 'description.not_found', message, rawMessage }: Props) => { const ErrorPage = ({ title = 'description.not_found', message, rawMessage, isRootPath }: Props) => {
const { t } = useTranslation(); const { t } = useTranslation();
const navigate = useNavigate(); const navigate = useNavigate();
const { theme } = useContext(PageContext); const { theme } = useContext(PageContext);
@ -27,19 +28,21 @@ const ErrorPage = ({ title = 'description.not_found', message, rawMessage }: Pro
return ( return (
<StaticPageLayout> <StaticPageLayout>
<NavBar /> {!isRootPath && <NavBar />}
<div className={styles.container}> <div className={styles.container}>
{theme === 'light' ? <EmptyState /> : <EmptyStateDark />} {theme === 'light' ? <EmptyState /> : <EmptyStateDark />}
<div className={styles.title}>{t(title)}</div> <div className={styles.title}>{t(title)}</div>
{errorMessage && <div className={styles.message}>{String(errorMessage)}</div>} {errorMessage && <div className={styles.message}>{String(errorMessage)}</div>}
</div> </div>
<Button {!isRootPath && (
className={styles.backButton} <Button
title="action.back" className={styles.backButton}
onClick={() => { title="action.back"
navigate(-1); onClick={() => {
}} navigate(-1);
/> }}
/>
)}
</StaticPageLayout> </StaticPageLayout>
); );
}; };

2
packages/ui/src/pages/Register/index.tsx
View file

@ -17,7 +17,7 @@ const Register = () => {
const { t } = useTranslation(); const { t } = useTranslation();
if (!signInMode || signInMode === SignInMode.SignIn) { if (!signInMode || signInMode === SignInMode.SignIn) {
return <ErrorPage />; return <ErrorPage isRootPath />;
} }
return ( return (

2
packages/ui/src/pages/SignIn/index.tsx
View file

@ -17,7 +17,7 @@ const SignIn = () => {
const { t } = useTranslation(); const { t } = useTranslation();
if (!signInMode || signInMode === SignInMode.Register) { if (!signInMode || signInMode === SignInMode.Register) {
return <ErrorPage />; return <ErrorPage isRootPath />;
} }
return ( return (