21ed83c56c
Closes the feedback loop on R:R scanner signals: - Nightly outcome_evaluator job replays unresolved setups against daily OHLCV bars: target_hit / stop_hit / ambiguous (same-bar, counted as loss) / expired after OUTCOME_EVALUATION_MAX_BARS (default 30) - Migration 004: evaluated_at + outcome_date on trade_setups - GET /trades/performance: hit rate, expectancy (avg R), total R with breakdowns by direction, recommended action, and confidence bucket - New Performance page (stat cards, breakdown tables, Evaluate Now, methodology disclosure) wired into sidebar and mobile nav - 17 new unit tests for evaluation logic and stats aggregation Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
90 lines
3.2 KiB
TypeScript
90 lines
3.2 KiB
TypeScript
import { useState } from 'react';
|
|
import { NavLink } from 'react-router-dom';
|
|
import { useAuthStore } from '../../stores/authStore';
|
|
|
|
const navItems = [
|
|
{ to: '/watchlist', label: 'Watchlist' },
|
|
{ to: '/scanner', label: 'Scanner' },
|
|
{ to: '/rankings', label: 'Rankings' },
|
|
{ to: '/performance', label: 'Performance' },
|
|
];
|
|
|
|
export default function MobileNav() {
|
|
const [open, setOpen] = useState(false);
|
|
const { role, username, logout } = useAuthStore();
|
|
|
|
return (
|
|
<div className="lg:hidden">
|
|
<div className="flex items-center justify-between px-4 py-3 glass rounded-none border-x-0 border-t-0">
|
|
<h1 className="text-lg font-semibold text-gradient">Signal Dashboard</h1>
|
|
<button
|
|
onClick={() => setOpen((v) => !v)}
|
|
className="p-2 text-gray-400 hover:text-gray-200 transition-colors duration-200"
|
|
aria-label="Toggle menu"
|
|
>
|
|
{open ? (
|
|
<svg className="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
|
|
</svg>
|
|
) : (
|
|
<svg className="w-6 h-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
|
|
</svg>
|
|
)}
|
|
</button>
|
|
</div>
|
|
|
|
<div
|
|
className={`overflow-hidden transition-all duration-300 ease-out glass rounded-none border-x-0 border-t-0 ${
|
|
open ? 'max-h-96 opacity-100' : 'max-h-0 opacity-0 border-b-0'
|
|
}`}
|
|
>
|
|
<nav className="px-3 py-2 space-y-1">
|
|
{navItems.map(({ to, label }) => (
|
|
<NavLink
|
|
key={to}
|
|
to={to}
|
|
onClick={() => setOpen(false)}
|
|
className={({ isActive }) =>
|
|
`block px-3 py-2.5 rounded-lg text-sm font-medium transition-all duration-200 ${
|
|
isActive
|
|
? 'bg-white/[0.08] text-white'
|
|
: 'text-gray-400 hover:bg-white/[0.04] hover:text-gray-200'
|
|
}`
|
|
}
|
|
>
|
|
{label}
|
|
</NavLink>
|
|
))}
|
|
{role === 'admin' && (
|
|
<NavLink
|
|
to="/admin"
|
|
onClick={() => setOpen(false)}
|
|
className={({ isActive }) =>
|
|
`block px-3 py-2.5 rounded-lg text-sm font-medium transition-all duration-200 ${
|
|
isActive
|
|
? 'bg-white/[0.08] text-white'
|
|
: 'text-gray-400 hover:bg-white/[0.04] hover:text-gray-200'
|
|
}`
|
|
}
|
|
>
|
|
Admin
|
|
</NavLink>
|
|
)}
|
|
</nav>
|
|
<div className="px-4 py-3 border-t border-white/[0.06]">
|
|
{username && (
|
|
<p className="text-xs text-gray-500 mb-2 truncate">{username}</p>
|
|
)}
|
|
<button
|
|
onClick={() => { logout(); setOpen(false); }}
|
|
className="w-full text-left px-3 py-2 text-sm text-gray-400 hover:text-gray-200 hover:bg-white/[0.04] rounded-lg transition-all duration-200"
|
|
>
|
|
Logout
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|