Spaces:

smolagents
/

ml-agent

Running

App Files Files Community

akseljoonas HF Staff commited on Jan 15

Commit

32f62c3

1 Parent(s): 0e6ce7b

functioning frontend and docker

Browse files

Files changed (10) hide show

.gitignore +53 -9
backend/routes/agent.py +2 -0
backend/session_manager.py +2 -2
backend/websocket.py +2 -1
eval/.amp_batch_solve.py.swp +0 -0
frontend/index.html +1 -1
frontend/src/components/Layout/AppLayout.tsx +0 -5
frontend/src/hooks/useAgentWebSocket.ts +50 -30
frontend/tsconfig.tsbuildinfo +1 -0
frontend/vite.config.ts +2 -2

.gitignore CHANGED Viewed

@@ -5,22 +5,66 @@ build/
 dist/
 wheels/
 *.egg-info
 # Virtual environments
-.venv
 .env
 .DS_Store
-.claude/
-*.jsonl
-*.csv
-/logs
-hf-agent-leaderboard/
 .cursor/
-session_logs/
-skills/
-# Frontend
 frontend/node_modules/
 frontend/dist/
 frontend/.cache/
 frontend/*.local

 dist/
 wheels/
 *.egg-info
+.pytest_cache/
+.mypy_cache/
+.tox/
+.coverage
+htmlcov/
+.ipynb_checkpoints/
 # Virtual environments
+.venv/
+venv/
+ENV/
+env/
+# Environment and Secrets
 .env
+.env.local
+.env.*
+!.env.example
+*.local
+credentials*.json
+# OS-specific
 .DS_Store
+Thumbs.db
+*.swp
+# IDE-specific
+.vscode/
+.idea/
 .cursor/
+.history/
+*.sublime-project
+*.sublime-workspace
+# Frontend (Node.js)
 frontend/node_modules/
 frontend/dist/
 frontend/.cache/
 frontend/*.local
+frontend/.eslintcache
+frontend/npm-debug.log*
+frontend/yarn-debug.log*
+frontend/yarn-error.log*
+# Docker
+.docker/
+# Project-specific
+session_logs/
+/logs
+hf-agent-leaderboard/
+skills/
+.claude/
+*.jsonl
+*.csv
+# ML / Data
+data/
+datasets/
+models/
+checkpoint-*/
+runs/
+wandb/

backend/routes/agent.py CHANGED Viewed

@@ -124,9 +124,11 @@ async def shutdown_session(session_id: str) -> dict:
 @router.websocket("/ws/{session_id}")
 async def websocket_endpoint(websocket: WebSocket, session_id: str) -> None:
     """WebSocket endpoint for real-time events."""
     # Verify session exists
     info = session_manager.get_session_info(session_id)
     if not info:
         await websocket.close(code=4004, reason="Session not found")
         return

 @router.websocket("/ws/{session_id}")
 async def websocket_endpoint(websocket: WebSocket, session_id: str) -> None:
     """WebSocket endpoint for real-time events."""
+    logger.info(f"WebSocket connection request for session {session_id}")
     # Verify session exists
     info = session_manager.get_session_info(session_id)
     if not info:
+        logger.warning(f"WebSocket connection rejected: Session {session_id} not found")
         await websocket.close(code=4004, reason="Session not found")
         return

backend/session_manager.py CHANGED Viewed

@@ -68,7 +68,7 @@ class SessionManager:
         event_queue: asyncio.Queue = asyncio.Queue()
         # Create tool router
-        tool_router = ToolRouter(config=self.config)
         # Create the agent session
         session = Session(event_queue, config=self.config, tool_router=tool_router)
@@ -253,7 +253,7 @@ class SessionManager:
             "session_id": session_id,
             "created_at": agent_session.created_at.isoformat(),
             "is_active": agent_session.is_active,
-            "message_count": len(agent_session.session.context_manager.messages),
         }
     def list_sessions(self) -> list[dict[str, Any]]:

         event_queue: asyncio.Queue = asyncio.Queue()
         # Create tool router
+        tool_router = ToolRouter(self.config.mcpServers)
         # Create the agent session
         session = Session(event_queue, config=self.config, tool_router=tool_router)
             "session_id": session_id,
             "created_at": agent_session.created_at.isoformat(),
             "is_active": agent_session.is_active,
+            "message_count": len(agent_session.session.context_manager.items),
         }
     def list_sessions(self) -> list[dict[str, Any]]:

backend/websocket.py CHANGED Viewed

@@ -20,10 +20,11 @@ class ConnectionManager:
     async def connect(self, websocket: WebSocket, session_id: str) -> None:
         """Accept a WebSocket connection and register it."""
         await websocket.accept()
         self.active_connections[session_id] = websocket
         self.message_queues[session_id] = asyncio.Queue()
-        logger.info(f"WebSocket connected for session {session_id}")
     def disconnect(self, session_id: str) -> None:
         """Remove a WebSocket connection."""

     async def connect(self, websocket: WebSocket, session_id: str) -> None:
         """Accept a WebSocket connection and register it."""
+        logger.info(f"Attempting to accept WebSocket for session {session_id}")
         await websocket.accept()
         self.active_connections[session_id] = websocket
         self.message_queues[session_id] = asyncio.Queue()
+        logger.info(f"WebSocket connected and registered for session {session_id}")
     def disconnect(self, session_id: str) -> None:
         """Remove a WebSocket connection."""

eval/.amp_batch_solve.py.swp DELETED Viewed

Binary file (12.3 kB)

frontend/index.html CHANGED Viewed

@@ -9,7 +9,7 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
   </head>
-  <body>
     <div id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
   </body>

     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
   </head>
+  <body style="margin: 0; padding: 0; background-color: #0D1117; color: #E6EDF3;">
     <div id="root"></div>
     <script type="module" src="/src/main.tsx"></script>
   </body>

frontend/src/components/Layout/AppLayout.tsx CHANGED Viewed

@@ -6,9 +6,6 @@ import {
   Typography,
   IconButton,
   Drawer,
-  useMediaQuery,
-  useTheme,
-  Button,
   Chip,
 } from '@mui/material';
 import MenuIcon from '@mui/icons-material/Menu';
@@ -27,8 +24,6 @@ import ApprovalModal from '@/components/ApprovalModal/ApprovalModal';
 const DRAWER_WIDTH = 280;
 export default function AppLayout() {
-  const theme = useTheme();
-  const isMobile = useMediaQuery(theme.breakpoints.down('md'));
   const [mobileOpen, setMobileOpen] = useState(false);
   const { activeSessionId } = useSessionStore();

   Typography,
   IconButton,
   Drawer,
   Chip,
 } from '@mui/material';
 import MenuIcon from '@mui/icons-material/Menu';
 const DRAWER_WIDTH = 280;
 export default function AppLayout() {
   const [mobileOpen, setMobileOpen] = useState(false);
   const { activeSessionId } = useSessionStore();

frontend/src/hooks/useAgentWebSocket.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 import { useCallback, useEffect, useRef } from 'react';
 import { useAgentStore } from '@/store/agentStore';
 import type { AgentEvent } from '@/types/events';
 import type { Message } from '@/types/agent';
@@ -29,6 +30,8 @@ export function useAgentWebSocket({
     setError,
   } = useAgentStore();
   const handleEvent = useCallback(
     (event: AgentEvent) => {
       if (!sessionId) return;
@@ -37,6 +40,7 @@ export function useAgentWebSocket({
         case 'ready':
           setConnected(true);
           setProcessing(false);
           onReady?.();
           break;
@@ -136,25 +140,29 @@ export function useAgentWebSocket({
           console.log('Unknown event:', event);
       }
     },
-    [
-      sessionId,
-      addMessage,
-      setProcessing,
-      setConnected,
-      setPendingApprovals,
-      setError,
-      onReady,
-      onError,
-    ]
   );
   const connect = useCallback(() => {
-    if (!sessionId || wsRef.current?.readyState === WebSocket.OPEN) return;
     const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
-    const host = window.location.host;
     const wsUrl = `${protocol}//${host}/api/ws/${sessionId}`;
     const ws = new WebSocket(wsUrl);
     ws.onopen = () => {
@@ -176,25 +184,28 @@ export function useAgentWebSocket({
       console.error('WebSocket error:', error);
     };
-    ws.onclose = () => {
-      console.log('WebSocket closed');
       setConnected(false);
-      // Attempt to reconnect with exponential backoff
-      if (reconnectTimeoutRef.current) {
-        clearTimeout(reconnectTimeoutRef.current);
       }
-      reconnectTimeoutRef.current = window.setTimeout(() => {
-        reconnectDelayRef.current = Math.min(
-          reconnectDelayRef.current * 2,
-          WS_MAX_RECONNECT_DELAY
-        );
-        connect();
-      }, reconnectDelayRef.current);
     };
     wsRef.current = ws;
-  }, [sessionId, handleEvent, setConnected]);
   const disconnect = useCallback(() => {
     if (reconnectTimeoutRef.current) {
@@ -206,7 +217,7 @@ export function useAgentWebSocket({
       wsRef.current = null;
     }
     setConnected(false);
-  }, [setConnected]);
   const sendPing = useCallback(() => {
     if (wsRef.current?.readyState === WebSocket.OPEN) {
@@ -214,15 +225,24 @@ export function useAgentWebSocket({
     }
   }, []);
-  // Connect when sessionId changes
   useEffect(() => {
-    if (sessionId) {
-      connect();
     }
     return () => {
       disconnect();
     };
-  }, [sessionId, connect, disconnect]);
   // Heartbeat
   useEffect(() => {

 import { useCallback, useEffect, useRef } from 'react';
 import { useAgentStore } from '@/store/agentStore';
+import { useSessionStore } from '@/store/sessionStore';
 import type { AgentEvent } from '@/types/events';
 import type { Message } from '@/types/agent';
     setError,
   } = useAgentStore();
+  const { setSessionActive } = useSessionStore();
   const handleEvent = useCallback(
     (event: AgentEvent) => {
       if (!sessionId) return;
         case 'ready':
           setConnected(true);
           setProcessing(false);
+          setSessionActive(sessionId, true);
           onReady?.();
           break;
           console.log('Unknown event:', event);
       }
     },
+    // Zustand setters are stable, so we don't need them in deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [sessionId, onReady, onError]
   );
   const connect = useCallback(() => {
+    if (!sessionId) return;
+    // Don't connect if already connected or connecting
+    if (wsRef.current?.readyState === WebSocket.OPEN ||
+        wsRef.current?.readyState === WebSocket.CONNECTING) {
+      return;
+    }
+    // Connect directly to backend (Vite doesn't proxy WebSockets)
     const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+    // In development, connect directly to backend port 7860
+    // In production, use the same host
+    const isDev = import.meta.env.DEV;
+    const host = isDev ? '127.0.0.1:7860' : window.location.host;
     const wsUrl = `${protocol}//${host}/api/ws/${sessionId}`;
+    console.log('Connecting to WebSocket:', wsUrl);
     const ws = new WebSocket(wsUrl);
     ws.onopen = () => {
       console.error('WebSocket error:', error);
     };
+    ws.onclose = (event) => {
+      console.log('WebSocket closed', event.code, event.reason);
       setConnected(false);
+      // Only reconnect if it wasn't a normal closure and session still exists
+      if (event.code !== 1000 && sessionId) {
+        // Attempt to reconnect with exponential backoff
+        if (reconnectTimeoutRef.current) {
+          clearTimeout(reconnectTimeoutRef.current);
+        }
+        reconnectTimeoutRef.current = window.setTimeout(() => {
+          reconnectDelayRef.current = Math.min(
+            reconnectDelayRef.current * 2,
+            WS_MAX_RECONNECT_DELAY
+          );
+          connect();
+        }, reconnectDelayRef.current);
       }
     };
     wsRef.current = ws;
+  }, [sessionId, handleEvent]);
   const disconnect = useCallback(() => {
     if (reconnectTimeoutRef.current) {
       wsRef.current = null;
     }
     setConnected(false);
+  }, []);
   const sendPing = useCallback(() => {
     if (wsRef.current?.readyState === WebSocket.OPEN) {
     }
   }, []);
+  // Connect when sessionId changes (with a small delay to ensure session is ready)
   useEffect(() => {
+    if (!sessionId) {
+      disconnect();
+      return;
     }
+    // Small delay to ensure session is fully created on backend
+    const timeoutId = setTimeout(() => {
+      connect();
+    }, 100);
     return () => {
+      clearTimeout(timeoutId);
       disconnect();
     };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [sessionId]);
   // Heartbeat
   useEffect(() => {

frontend/tsconfig.tsbuildinfo ADDED Viewed

	@@ -0,0 +1 @@

+ {"root":["./src/app.tsx","./src/main.tsx","./src/theme.ts","./src/vite-env.d.ts","./src/components/approvalmodal/approvalmodal.tsx","./src/components/chat/chatinput.tsx","./src/components/chat/messagebubble.tsx","./src/components/chat/messagelist.tsx","./src/components/layout/applayout.tsx","./src/components/sessionsidebar/sessionsidebar.tsx","./src/hooks/useagentwebsocket.ts","./src/store/agentstore.ts","./src/store/sessionstore.ts","./src/types/agent.ts","./src/types/events.ts"],"errors":true,"version":"5.6.3"}

frontend/vite.config.ts CHANGED Viewed

@@ -13,11 +13,11 @@ export default defineConfig({
     port: 5173,
     proxy: {
       '/api': {
-        target: 'http://localhost:8000',
         changeOrigin: true,
       },
       '/auth': {
-        target: 'http://localhost:8000',
         changeOrigin: true,
       },
     },

     port: 5173,
     proxy: {
       '/api': {
+        target: 'http://localhost:7860',
         changeOrigin: true,
       },
       '/auth': {
+        target: 'http://localhost:7860',
         changeOrigin: true,
       },
     },