add automatic redirect from setup to login after completion

- Add SetupCompletionChecker component that monitors health status
- Automatically redirect to /login when server becomes healthy after setup
- Improves user experience by eliminating manual navigation step
This commit is contained in:
Fimeg
2025-10-31 08:39:16 -04:00
parent fd4974de21
commit e64131079e
2 changed files with 57 additions and 1 deletions

View File

@@ -16,6 +16,7 @@ import AgentManagement from '@/pages/settings/AgentManagement';
import Login from '@/pages/Login';
import Setup from '@/pages/Setup';
import { WelcomeChecker } from '@/components/WelcomeChecker';
import { SetupCompletionChecker } from '@/components/SetupCompletionChecker';
// Protected route component
const ProtectedRoute: React.FC<{ children: React.ReactNode }> = ({ children }) => {
@@ -81,7 +82,14 @@ const App: React.FC = () => {
{/* App routes */}
<Routes>
{/* Setup route - shown when server needs configuration */}
<Route path="/setup" element={<Setup />} />
<Route
path="/setup"
element={
<SetupCompletionChecker>
<Setup />
</SetupCompletionChecker>
}
/>
{/* Login route */}
<Route

View File

@@ -0,0 +1,48 @@
import React, { useEffect, useState } from 'react';
import { useNavigate, useLocation } from 'react-router-dom';
import { setupApi } from '@/lib/api';
interface SetupCompletionCheckerProps {
children: React.ReactNode;
}
export const SetupCompletionChecker: React.FC<SetupCompletionCheckerProps> = ({ children }) => {
const [isSetupMode, setIsSetupMode] = useState<boolean | null>(null);
const navigate = useNavigate();
const location = useLocation();
useEffect(() => {
const checkSetupStatus = async () => {
try {
const data = await setupApi.checkHealth();
if (data.status === 'waiting for configuration') {
setIsSetupMode(true);
} else {
setIsSetupMode(false);
}
} catch (error) {
// If we can't reach the health endpoint, assume normal mode
setIsSetupMode(false);
}
};
checkSetupStatus();
// Check periodically for configuration changes
const interval = setInterval(checkSetupStatus, 3000);
return () => clearInterval(interval);
}, []);
// If we're on the setup page and server is now healthy, redirect to login
useEffect(() => {
if (isSetupMode === false && location.pathname === '/setup') {
console.log('Setup completed - redirecting to login');
navigate('/login', { replace: true });
}
}, [isSetupMode, location.pathname, navigate]);
// Always render children - this component only handles redirects
return <>{children}</>;
};