Add system diagnostics health endpoint and UI

backend/app/controller/health_controller.py

@@ -16,6 +16,15 @@
 
 from fastapi import APIRouter
 from pydantic import BaseModel
+<<<<<<< HEAD
+<<<<<<< HEAD
+from utils import traceroot_wrapper as traceroot
+=======
+from sqlalchemy import text
+import logging
+>>>>>>> 22fd45e11845bd7da55863bcd59260d410e6af81
+=======
+>>>>>>> upstream/main
 
 logger = logging.getLogger("health_controller")
 
@@ -29,12 +38,31 @@ class HealthResponse(BaseModel):
 
 @router.get("/health", name="health check", response_model=HealthResponse)
 async def health_check():
+<<<<<<< HEAD
+    """
+    Health check endpoint for verifying backend readiness.
+    """
+
+    logger.debug("Health check requested")
+
+    response = HealthResponse(
+        status="ok",
+        service="eigent",
+    )
+
+=======
     """Health check endpoint for verifying backend
     is ready to accept requests."""
     logger.debug("Health check requested")
     response = HealthResponse(status="ok", service="eigent")
+>>>>>>> upstream/main
     logger.debug(
         "Health check completed",
         extra={"status": response.status, "service": response.service},
     )
+<<<<<<< HEAD
+
+    return response
+=======
     return response
+>>>>>>> upstream/main

src/pages/Diagnostics.tsx

@@ -0,0 +1,42 @@
+/*
+ * Copyright 2024 Eigent
+ *
+ * Licensed under the Apache License, Version 2.0
+ * http://www.apache.org/licenses/LICENSE-2.0
+ */
+
+import { useEffect, useState } from "react";
+import { fetchGet } from "@/api/http";
+
+type HealthResponse = {
+  status: string;
+  service: string;
+};
+
+export default function Diagnostics() {
+  const [data, setData] = useState<HealthResponse | null>(null);
+  const [error, setError] = useState("");
+
+  useEffect(() => {
+    fetchGet("/health")
+      .then(setData)
+      .catch((err) => setError(err.message));
+  }, []);
+
+  if (error) {
+    return <div>❌ {error}</div>;
+  }
+
+  if (!data) {
+    return <div>Loading system diagnostics...</div>;
+  }
+
+  return (
+    <div style={{ padding: "16px" }}>
+      <h2>System Diagnostics</h2>
+
+      <p>Backend: ✅ Running</p>
+      <p>Service: {data.service}</p>
+    </div>
+  );
+}

src/routers/index.tsx

@@ -17,6 +17,17 @@ import { useAuthStore } from '@/store/authStore';
 import { lazy, useEffect, useReducer } from 'react';
 import { Navigate, Outlet, Route, Routes } from 'react-router-dom';
 
+<<<<<<< HEAD
+import Layout from "@/components/Layout";
+
+// Lazy load page components
+const Login = lazy(() => import("@/pages/Login"));
+const Signup = lazy(() => import("@/pages/SignUp"));
+const Home = lazy(() => import("@/pages/Home"));
+const History = lazy(() => import("@/pages/History"));
+const Diagnostics = lazy(() => import("@/pages/Diagnostics"));
+const NotFound = lazy(() => import("@/pages/NotFound"));
+=======
 import Layout from '@/components/Layout';
 // Lazy load page components
 const Login = lazy(() => import('@/pages/Login'));
@@ -55,6 +66,7 @@ const authReducer = (state: AuthState, action: AuthAction): AuthState => {
       return state;
   }
 };
+>>>>>>> upstream/main
 
 // Route guard: Check if user is logged in
 const ProtectedRoute = () => {
@@ -64,6 +76,41 @@ const ProtectedRoute = () => {
     initialized: false,
   });
 
+<<<<<<< HEAD
+	const { token, localProxyValue, logout } = useAuthStore();
+
+	useEffect(() => {
+		// Check VITE_USE_LOCAL_PROXY value on app startup
+		if (token) {
+			const currentProxyValue = import.meta.env.VITE_USE_LOCAL_PROXY || null;
+			const storedProxyValue = localProxyValue;
+
+			// If stored value exists and differs from current, logout
+			if (storedProxyValue !== null && storedProxyValue !== currentProxyValue) {
+				console.warn("VITE_USE_LOCAL_PROXY value changed, logging out user");
+				logout();
+				setIsAuthenticated(false);
+				setLoading(false);
+				setInitialized(true);
+				return;
+			}
+		}
+
+		setIsAuthenticated(!!token);
+		setLoading(false);
+		setInitialized(true);
+	}, [token, localProxyValue, logout]);
+
+	if (loading || !initialized) {
+		return (
+			<div className="flex items-center justify-center h-screen">
+				<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-blue-600"></div>
+			</div>
+		);
+	}
+
+	return isAuthenticated ? <Outlet /> : <Navigate to="/login" replace />;
+=======
   const {
     token,
     localProxyValue,
@@ -130,10 +177,38 @@ const ProtectedRoute = () => {
     );
   }
   return state.isAuthenticated ? <Outlet /> : <Navigate to="/login" replace />;
+>>>>>>> upstream/main
 };
 
 // Main route configuration
 const AppRoutes = () => (
+<<<<<<< HEAD
+	<Routes>
+		{/* Public routes */}
+		<Route path="/login" element={<Login />} />
+		<Route path="/signup" element={<Signup />} />
+
+		{/* Protected routes */}
+		<Route element={<ProtectedRoute />}>
+			<Route element={<Layout />}>
+				<Route path="/" element={<Home />} />
+				<Route path="/history" element={<History />} />
+				<Route path="/diagnostics" element={<Diagnostics />} />
+				<Route
+					path="/setting"
+					element={<Navigate to="/history?tab=settings" replace />}
+				/>
+				<Route
+					path="/setting/*"
+					element={<Navigate to="/history?tab=settings" replace />}
+				/>
+			</Route>
+		</Route>
+
+		{/* Fallback */}
+		<Route path="*" element={<NotFound />} />
+	</Routes>
+=======
   <Routes>
     <Route path="/login" element={<Login />} />
     <Route path="/signup" element={<Signup />} />
@@ -153,6 +228,7 @@ const AppRoutes = () => (
     </Route>
     <Route path="*" element={<NotFound />} />
   </Routes>
+>>>>>>> upstream/main
 );
 
 export default AppRoutes;