feat: Integrate SetupCheck component for improved setup validation in routing

web/src/App.js

@@ -26,6 +26,7 @@ import Playground from './pages/Playground/Playground.js';
 import OAuth2Callback from "./components/OAuth2Callback.js";
 import PersonalSetting from './components/PersonalSetting.js';
 import Setup from './pages/Setup/index.js';
+import SetupCheck from './components/SetupCheck';
 
 const Home = lazy(() => import('./pages/Home'));
 const Detail = lazy(() => import('./pages/Detail'));
@@ -35,7 +36,7 @@ function App() {
   const location = useLocation();
   
   return (
-    <>
+    <SetupCheck>
       <Routes>
         <Route
           path='/'
@@ -286,7 +287,7 @@ function App() {
           />
           <Route path='*' element={<NotFound />} />
         </Routes>
-      </>
+      </SetupCheck>
   );
 }
 

web/src/components/SetupCheck.js

@@ -0,0 +1,18 @@
+import React, { useContext, useEffect } from 'react';
+import { Navigate, useLocation } from 'react-router-dom';
+import { StatusContext } from '../context/Status';
+
+const SetupCheck = ({ children }) => {
+  const [statusState] = useContext(StatusContext);
+  const location = useLocation();
+
+  useEffect(() => {
+    if (statusState?.status?.setup === false && location.pathname !== '/setup') {
+      window.location.href = '/setup';
+    }
+  }, [statusState?.status?.setup, location.pathname]);
+
+  return children;
+};
+
+export default SetupCheck; 

web/src/pages/Home/index.js

@@ -66,13 +66,9 @@ const Home = () => {
   };
 
   useEffect(() => {
-    if (statusState.status?.setup === false) {
-      window.location.href = '/setup';
-      return;
-    }
     displayNotice().then();
     displayHomePageContent().then();
-  });
+  }, []);
 
   return (
     <>
@@ -116,6 +112,7 @@ const Home = () => {
                       https://github.com/Calcium-Ion/new-api
                     </a>
                   </p>
+                  
                   <p>
                     {t('协议')}：
                     <a