Просмотр исходного кода

✨feat: Redirect to console if logged in and accessing auth pages

This commit introduces a new component `AuthRedirect` which checks
if a user is already logged in.

If the user is logged in and attempts to access the /login or /register
pages, they will be redirected to the /console page. Otherwise, the
respective authentication form (Login or Register) will be rendered.

The `App.js` file has been updated to utilize this new `AuthRedirect`
component for the /login and /register routes.
Apple\Apple 7 месяцев назад
Родитель
Сommit
28d401ec01
3 измененных файлов с 22 добавлено и 3 удалено
  1. 7 2
      web/src/App.js
  2. 14 0
      web/src/components/AuthRedirect.js
  3. 1 1
      web/src/pages/Home/index.js

+ 7 - 2
web/src/App.js

@@ -27,6 +27,7 @@ import OAuth2Callback from './components/OAuth2Callback.js';
 import PersonalSetting from './components/PersonalSetting.js';
 import Setup from './pages/Setup/index.js';
 import SetupCheck from './components/SetupCheck';
+import AuthRedirect from './components/AuthRedirect';
 
 const Home = lazy(() => import('./pages/Home'));
 const Detail = lazy(() => import('./pages/Detail'));
@@ -138,7 +139,9 @@ function App() {
           path='/login'
           element={
             <Suspense fallback={<Loading></Loading>} key={location.pathname}>
-              <LoginForm />
+              <AuthRedirect>
+                <LoginForm />
+              </AuthRedirect>
             </Suspense>
           }
         />
@@ -146,7 +149,9 @@ function App() {
           path='/register'
           element={
             <Suspense fallback={<Loading></Loading>} key={location.pathname}>
-              <RegisterForm />
+              <AuthRedirect>
+                <RegisterForm />
+              </AuthRedirect>
             </Suspense>
           }
         />

+ 14 - 0
web/src/components/AuthRedirect.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { Navigate } from 'react-router-dom';
+
+const AuthRedirect = ({ children }) => {
+  const user = localStorage.getItem('user');
+
+  if (user) {
+    return <Navigate to="/console" replace />;
+  }
+
+  return children;
+};
+
+export default AuthRedirect; 

+ 1 - 1
web/src/pages/Home/index.js

@@ -94,7 +94,7 @@ const Home = () => {
 
                 {/* 操作按钮 */}
                 <div className="mt-6 md:mt-10 flex flex-wrap gap-4 justify-center md:justify-start">
-                  <Link to="/login">
+                  <Link to="/console">
                     <Button theme="solid" type="primary" size="large">
                       {t('开始使用')}
                     </Button>