k.petit/chlova
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui): icônes Lucide + état/badge review partagés (v0.30.0)

Browse Source 
Icônes SVG Lucide (chat, voix, review, nav). Contexte appdata : phase+outils
dans le header, badge d'assets en attente dans la nav, refresh après
décision ; Review consomme appdata. Build OK, 0 vuln.

Palier de risque : reversible (front).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Kantin-Petit
2026-06-23 07:29:46 +02:00
parent 476c89ce3d
commit aa108e847b
7 changed files with 167 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/App.tsx
+25 -6
View File
@@ -1,24 +1,37 @@
import { BrowserRouter, Routes, Route, NavLink, Navigate } from "react-router-dom";
import { MessageSquare, ShieldCheck, LogOut, Cpu } from "lucide-react";
import { useAuth } from "./auth";
import { AppDataProvider, useAppData } from "./appdata";
import { Login } from "./pages/Login";
import { Chat } from "./pages/Chat";
import { Review } from "./pages/Review";
function Shell() {
const { logout } = useAuth();
const { phase, tools, assets } = useAppData();
const link = ({ isActive }: { isActive: boolean }): string =>
`px-3 py-2 rounded-md text-sm ${isActive ? "bg-surface-2 text-accent" : "text-muted hover:text-fg"}`;
`flex items-center gap-1.5 px-3 py-2 rounded-md text-sm ${isActive ? "bg-surface-2 text-accent" : "text-muted hover:text-fg"}`;
return (
<div className="min-h-dvh flex flex-col">
<header className="flex items-center gap-2 border-b border-border bg-surface px-4 py-2">
<span className="font-bold tracking-wide text-accent glow mr-2">CHLOVA</span>
<nav className="flex gap-1">
<NavLink to="/chat" className={link}>Chat</NavLink>
<NavLink to="/review" className={link}>Review</NavLink>
<NavLink to="/chat" className={link}>
<MessageSquare size={16} /> Chat
</NavLink>
<NavLink to="/review" className={link}>
<ShieldCheck size={16} /> Review
{assets.length > 0 && (
<span className="ml-1 rounded-full bg-accent px-1.5 text-xs text-bg">{assets.length}</span>
)}
</NavLink>
</nav>
<button onClick={logout} className="ml-auto text-sm text-muted hover:text-fg cursor-pointer">
Déconnexion
<span className="ml-auto flex items-center gap-1.5 text-xs text-muted" title="Phase · outils">
<Cpu size={14} /> {phase || "…"} · {tools} outils
</span>
<button onClick={logout} className="ml-3 text-muted hover:text-fg cursor-pointer" aria-label="Déconnexion" title="Déconnexion">
<LogOut size={18} />
</button>
</header>
<main className="flex-1 min-h-0">
@@ -36,7 +49,13 @@ export function App() {
const { token } = useAuth();
return (
<BrowserRouter>
{token ? <Shell /> : <Login />}
{token ? (
<AppDataProvider>
<Shell />
</AppDataProvider>
) : (
<Login />
)}
</BrowserRouter>
);
}