diff --git a/frontend/src/api/sessions.ts b/frontend/src/api/sessions.ts index 1895d562..18c08910 100644 --- a/frontend/src/api/sessions.ts +++ b/frontend/src/api/sessions.ts @@ -31,6 +31,7 @@ export const sessionsApi = { async create(data: SessionCreate): Promise { const response = await apiClient.post('/sessions', data) + window.dispatchEvent(new Event('session-changed')) return response.data }, @@ -41,6 +42,7 @@ export const sessionsApi = { async complete(id: string, data: SessionComplete): Promise { const response = await apiClient.post(`/sessions/${id}/complete`, data) + window.dispatchEvent(new Event('session-changed')) return response.data }, diff --git a/frontend/src/components/layout/Sidebar.tsx b/frontend/src/components/layout/Sidebar.tsx index 1bda0fb1..2baaf3d0 100644 --- a/frontend/src/components/layout/Sidebar.tsx +++ b/frontend/src/components/layout/Sidebar.tsx @@ -1,4 +1,4 @@ -import { useEffect, useState } from 'react' +import { useCallback, useEffect, useState } from 'react' import { useLocation } from 'react-router-dom' import { LayoutGrid, Network, Wrench, Clock, FileOutput, BarChart3, @@ -37,10 +37,20 @@ export function Sidebar() { const [stats, setStats] = useState(null) + const refreshStats = useCallback(() => { + sidebarApi.getStats().then(setStats).catch(() => {}) + }, []) + // Fetch sidebar stats — refreshes on navigation useEffect(() => { - sidebarApi.getStats().then(setStats).catch(() => {}) - }, [location.pathname]) + refreshStats() + }, [location.pathname, refreshStats]) + + // Refresh when sessions are created or completed + useEffect(() => { + window.addEventListener('session-changed', refreshStats) + return () => window.removeEventListener('session-changed', refreshStats) + }, [refreshStats]) const handleSidebarWheel = (e: React.WheelEvent) => { const sidebar = e.currentTarget