feat: tab bar

frontend/src/App.tsx

@@ -1,4 +1,4 @@
-import { BrowserRouter, Routes, Route, useLocation } from 'react-router-dom'
+import { BrowserRouter, Routes, Route, useLocation, Navigate } from 'react-router-dom'
 import { useEffect, ComponentType } from 'react'
 import Sidebar from './components/layout/Sidebar'
 import TabBar from './components/layout/TabBar'
@@ -35,21 +35,48 @@ import AIDesks from './pages/AIDesks'
 import MacroSeriesPage from './pages/MacroSeriesPage'
 import EuroSimulator from './pages/EuroSimulator'
 import CausalLab from './pages/CausalLab'
-import { Navigate } from 'react-router-dom'
 import { useCycleWatcher } from './hooks/useApi'
 
-// ── Keep-alive component definitions ─────────────────────────────────────────
-// KEEP_ALIVE_META provides metadata (path/label/icon); components added here.
-// Routes listed here are REMOVED from <Routes> below to avoid double-render.
+// ── Keep-alive pages ──────────────────────────────────────────────────────────
+// All pages except InstrumentDashboard (uses URL :id param — would break when hidden).
+// Order must match KEEP_ALIVE_META in keepAliveMeta.ts.
 
 const KEEP_ALIVE_DEFS: { path: string; component: ComponentType }[] = [
-  { path: '/market-events', component: MarketEvents },
-  { path: '/causal-lab',    component: CausalLab    },
+  { path: '/',                   component: Dashboard          },
+  { path: '/geo',                component: GeoRadar           },
+  { path: '/markets',            component: Markets            },
+  { path: '/macro',              component: MacroRegime        },
+  { path: '/options',            component: OptionsLab         },
+  { path: '/patterns',           component: PatternExplorer    },
+  { path: '/pattern-lab',        component: PatternLab         },
+  { path: '/portfolio',          component: Portfolio          },
+  { path: '/journal',            component: JournalDeBord      },
+  { path: '/rapport',            component: RapportIA          },
+  { path: '/super-contexte',     component: SuperContexte      },
+  { path: '/analytics',          component: Analytics          },
+  { path: '/analytics-advanced', component: AnalyticsAdvanced  },
+  { path: '/risk',               component: RiskDashboard      },
+  { path: '/var',                component: VaRAnalysis        },
+  { path: '/position-history',   component: PositionHistory    },
+  { path: '/backtest',           component: Backtest           },
+  { path: '/calendar',           component: CalendarPage       },
+  { path: '/simulator',          component: EuroSimulator      },
+  { path: '/causal-lab',         component: CausalLab          },
+  { path: '/macro-series',       component: MacroSeriesPage    },
+  { path: '/institutional',      component: InstitutionalReports },
+  { path: '/specialist-desks',   component: SpecialistDesks    },
+  { path: '/market-events',      component: MarketEvents       },
+  { path: '/ai-desks',           component: AIDesks            },
+  { path: '/cycle-actions',      component: CycleActions       },
+  { path: '/snapshot',           component: ExternalSnapshot   },
+  { path: '/logs',               component: SystemLogs         },
+  { path: '/config',             component: Config             },
+  { path: '/patterns/edit',      component: PatternEditor      },
 ]
 
 const KEEP_ALIVE_PATHS = new Set(KEEP_ALIVE_DEFS.map(d => d.path))
 
-// ── KeepAlivePage — mounts once, hides/shows on route change ─────────────────
+// ── KeepAlivePage ─────────────────────────────────────────────────────────────
 
 function KeepAlivePage({ path, component: Component }: { path: string; component: ComponentType }) {
   const { kept, keepRoute } = useTabs()
@@ -60,7 +87,6 @@ function KeepAlivePage({ path, component: Component }: { path: string; component
     if (isActive) keepRoute(path)
   }, [isActive, path, keepRoute])
 
-  // Don't mount until the user visits for the first time
   if (!kept.has(path) && !isActive) return null
 
   return (
@@ -70,48 +96,21 @@ function KeepAlivePage({ path, component: Component }: { path: string; component
   )
 }
 
-// ── NormalRoutes — handles all non-keep-alive routes ─────────────────────────
+// ── NormalRoutes — only InstrumentDashboard (uses :id param) + redirects ─────
 
 function NormalRoutes() {
   const location = useLocation()
-  // Yield to KeepAlive when on a keep-alive route
   if (KEEP_ALIVE_PATHS.has(location.pathname)) return null
 
   return (
     <div className="flex-1 overflow-auto">
       <Routes>
-        <Route path="/" element={<Dashboard />} />
-        <Route path="/geo" element={<GeoRadar />} />
-        <Route path="/markets" element={<Markets />} />
-        <Route path="/macro" element={<MacroRegime />} />
-        <Route path="/options" element={<OptionsLab />} />
-        <Route path="/patterns" element={<PatternExplorer />} />
-        <Route path="/patterns/edit" element={<PatternEditor />} />
-        <Route path="/pattern-lab" element={<PatternLab />} />
-        <Route path="/portfolio" element={<Portfolio />} />
-        <Route path="/backtest" element={<Backtest />} />
-        <Route path="/calendar" element={<CalendarPage />} />
-        <Route path="/macro-series" element={<MacroSeriesPage />} />
-        <Route path="/journal" element={<JournalDeBord />} />
-        <Route path="/rapport" element={<RapportIA />} />
-        <Route path="/super-contexte" element={<SuperContexte />} />
-        <Route path="/config" element={<Config />} />
-        <Route path="/analytics" element={<Analytics />} />
-        <Route path="/analytics-advanced" element={<AnalyticsAdvanced />} />
-        <Route path="/risk" element={<RiskDashboard />} />
-        <Route path="/var" element={<VaRAnalysis />} />
-        <Route path="/position-history" element={<PositionHistory />} />
-        <Route path="/logs" element={<SystemLogs />} />
-        <Route path="/institutional" element={<InstitutionalReports />} />
-        <Route path="/specialist-desks" element={<SpecialistDesks />} />
-        <Route path="/snapshot" element={<ExternalSnapshot />} />
+        {/* InstrumentDashboard kept here: useParams() reads :id from URL */}
         <Route path="/instruments" element={<Navigate to="/instruments/SPY" replace />} />
         <Route path="/instruments/:id" element={<InstrumentDashboard />} />
-        <Route path="/impact" element={<Navigate to="/market-events" replace />} />
-        <Route path="/timeline" element={<Navigate to="/market-events" replace />} />
-        <Route path="/cycle-actions" element={<CycleActions />} />
-        <Route path="/ai-desks" element={<AIDesks />} />
-        <Route path="/simulator" element={<EuroSimulator />} />
+        {/* Legacy redirects */}
+        <Route path="/impact"    element={<Navigate to="/market-events" replace />} />
+        <Route path="/timeline"  element={<Navigate to="/market-events" replace />} />
       </Routes>
     </div>
   )