Initial commit — GeoOptions Intelligence Cockpit v2.0

Stack: FastAPI + React/TypeScript + SQLite + GPT-4o
Features: Radar géopolitique, Marchés, Régime Macro, Journal de Bord MTM,
Rapport IA, Super Contexte (base de raisonnement évolutive), Boucle feedback IA.
Deploy: Docker + docker-compose + nginx pour openfin.open-squared.tech

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

frontend/src/components/layout/Sidebar.tsx

@@ -0,0 +1,105 @@
+import { NavLink } from 'react-router-dom'
+import {
+  LayoutDashboard, Globe, BarChart2, FlaskConical,
+  History, Calendar, TrendingUp, Zap, DollarSign, Settings, BrainCircuit, Activity, BookOpen, FileBarChart, Brain
+} from 'lucide-react'
+import { useGeoRiskScore, useAiStatus, usePortfolioSummary } from '../../hooks/useApi'
+import clsx from 'clsx'
+
+const nav = [
+  { to: '/', icon: LayoutDashboard, label: 'Cockpit' },
+  { to: '/geo', icon: Globe, label: 'Radar Géopolitique' },
+  { to: '/markets', icon: BarChart2, label: 'Marchés & Prix' },
+  { to: '/macro', icon: Activity, label: 'Régime Macro' },
+  { to: '/options', icon: TrendingUp, label: 'Options Lab' },
+  { to: '/patterns', icon: Zap, label: 'Patterns' },
+  { to: '/portfolio', icon: DollarSign, label: 'Portefeuille' },
+  { to: '/journal', icon: BookOpen, label: 'Journal de Bord' },
+  { to: '/rapport', icon: FileBarChart, label: 'Rapport IA' },
+  { to: '/super-contexte', icon: Brain, label: 'Super Contexte' },
+  { to: '/backtest', icon: History, label: 'Backtest' },
+  { to: '/calendar', icon: Calendar, label: 'Calendrier' },
+  { to: '/config', icon: Settings, label: 'Configuration' },
+]
+
+const riskColors: Record<string, string> = {
+  low: 'text-emerald-400 bg-emerald-900/30 border-emerald-700/40',
+  medium: 'text-yellow-400 bg-yellow-900/30 border-yellow-700/40',
+  high: 'text-orange-400 bg-orange-900/30 border-orange-700/40',
+  extreme: 'text-red-400 bg-red-900/30 border-red-700/40 animate-pulse',
+}
+
+export default function Sidebar() {
+  const { data: riskScore } = useGeoRiskScore()
+  const { data: aiStatus } = useAiStatus()
+  const { data: summary } = usePortfolioSummary()
+
+  return (
+    <aside className="w-56 bg-dark-800 border-r border-slate-700/40 flex flex-col h-screen sticky top-0">
+      {/* Logo */}
+      <div className="p-4 border-b border-slate-700/40">
+        <div className="flex items-center gap-2">
+          <Zap className="w-5 h-5 text-blue-400" />
+          <div>
+            <div className="text-sm font-bold text-white tracking-wide">GeoOptions</div>
+            <div className="text-xs text-slate-500">Intelligence v2.0</div>
+          </div>
+        </div>
+      </div>
+
+      {/* Geo risk indicator */}
+      {riskScore && (
+        <div className={clsx('mx-3 mt-3 px-3 py-2 rounded border text-xs', riskColors[riskScore.level])}>
+          <div className="font-semibold uppercase tracking-wider">Risque Géo</div>
+          <div className="text-lg font-bold">{riskScore.score}/100</div>
+          <div className="capitalize">{riskScore.level}</div>
+        </div>
+      )}
+
+      {/* Portfolio mini summary */}
+      {summary && (summary.open_positions > 0 || summary.unrealized_pnl !== 0) && (
+        <div className="mx-3 mt-2 px-3 py-2 rounded border border-slate-700/30 bg-dark-700/50 text-xs">
+          <div className="text-slate-500 uppercase tracking-wider text-xs mb-1">Portefeuille</div>
+          <div className="flex justify-between">
+            <span className="text-slate-400">{summary.open_positions} positions</span>
+            <span className={clsx('font-bold', summary.unrealized_pnl >= 0 ? 'text-emerald-400' : 'text-red-400')}>
+              {summary.unrealized_pnl >= 0 ? '+' : ''}{summary.unrealized_pnl?.toFixed(0)}€
+            </span>
+          </div>
+        </div>
+      )}
+
+      {/* Navigation */}
+      <nav className="flex-1 p-2 mt-2 space-y-0.5 overflow-y-auto">
+        {nav.map(({ to, icon: Icon, label }) => (
+          <NavLink
+            key={to}
+            to={to}
+            end={to === '/'}
+            className={({ isActive }) => clsx('nav-link', isActive && 'active')}
+          >
+            <Icon className="w-4 h-4 shrink-0" />
+            <span>{label}</span>
+          </NavLink>
+        ))}
+      </nav>
+
+      {/* AI status badge */}
+      <div className="px-3 py-2 border-t border-slate-700/40">
+        <div className={clsx('flex items-center gap-2 text-xs px-2 py-1.5 rounded', {
+          'bg-blue-900/30 text-blue-400': aiStatus?.enabled,
+          'bg-dark-700 text-slate-600': !aiStatus?.enabled,
+        })}>
+          <BrainCircuit className="w-3.5 h-3.5" />
+          <span>{aiStatus?.enabled ? 'IA GPT-4o active' : 'IA non configurée'}</span>
+        </div>
+      </div>
+
+      {/* Footer */}
+      <div className="p-3 border-t border-slate-700/40 text-xs text-slate-600">
+        <div>© 2026 GeoOptions</div>
+        <div className="text-slate-700 mt-0.5">Local · IBKR ready</div>
+      </div>
+    </aside>
+  )
+}