GISE/aegis
2
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects 3 Releases Wiki Activity

refact & cleanup : Sidebar, Button, card, EmptyState, Loader, ServiceObject, StatusBadge, UptameObject, BackupWidget, SecurityWidget, ServicesWidget, SupportCtaWidget, UptimeWidget, DashboardLayout

Browse Source
This commit is contained in:
LathanDevers
2026-07-29 22:50:04 +02:00
parent 438d739b1a
commit ec900efe3a
42 changed files with 3357 additions and 3966 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/layouts/DashboardLayout.tsx
+9 -79
View File
@@ -1,93 +1,23 @@
import React from 'react';
import Sidebar from '@/components/layout/Sidebar';
// Définition stricte des propriétés attendues par le Layout
interface DashboardLayoutProps {
children: React.ReactNode;
activeView: 'dashboard' | 'support' | 'vault' | 'account';
onNavigate: (view: 'dashboard' | 'support' | 'vault' | 'account') => void;
onLogout: () => void;
}
export default function DashboardLayout({ children, activeView, onNavigate, onLogout }: DashboardLayoutProps) {
const navItems = [
{ id: 'dashboard', label: 'Tableau de bord', icon: (
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2V6zM14 6a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2V6zM4 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2H6a2 2 0 01-2-2v-2zM14 16a2 2 0 012-2h2a2 2 0 012 2v2a2 2 0 01-2 2h-2a2 2 0 01-2-2v-2z" /></svg>
)},
{ id: 'support', label: 'Centre de Support', icon: (
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M18.364 5.636l-3.536 3.536m0 5.656l3.536 3.536M9.172 9.172L5.636 5.636m3.536 9.192l-3.536 3.536M21 12a9 9 0 11-18 0 9 9 0 0118 0zm-5 0a4 4 0 11-8 0 4 4 0 018 0z" /></svg>
)},
{ id: 'vault', label: 'Coffre-Fort', icon: (
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" /></svg>
)}
];
export default function DashboardLayout({ children, onLogout }: DashboardLayoutProps) {
return (
<div className="flex h-screen bg-slate-50 overflow-hidden font-sans selection:bg-blue-900 selection:text-white">
{/* Sidebar Latérale (Institutionnelle) */}
<aside className="w-64 bg-white border-r border-slate-200 flex flex-col justify-between shadow-sm z-10">
{/* En-tête Sidebar */}
<div>
<div className="h-20 flex items-center px-8 border-b border-slate-100">
<h2 className="text-2xl font-bold tracking-tight text-slate-900">
AEGIS <span className="text-xs font-semibold text-blue-900 ml-1 bg-blue-50 px-2 py-1 rounded">VIP</span>
</h2>
</div>
<div className="flex h-screen bg-slate-50 overflow-hidden">
{/* Intégration de la navbar extraite */}
<Sidebar onLogout={onLogout} />
{/* Navigation */}
<nav className="p-4 space-y-1">
{navItems.map((item) => (
<button
key={item.id}
onClick={() => onNavigate(item.id as any)}
className={`w-full flex items-center px-4 py-3 text-sm font-medium rounded-lg transition-colors duration-200 ${
activeView === item.id
? 'bg-blue-50 text-blue-900'
: 'text-slate-600 hover:bg-slate-50 hover:text-slate-900'
}`}
>
<span className={`mr-3 ${activeView === item.id ? 'text-blue-900' : 'text-slate-400'}`}>
{item.icon}
</span>
{item.label}
</button>
))}
</nav>
</div>
{/* Pied de la Sidebar (Profil & Déconnexion) */}
<div className="p-4 border-t border-slate-100">
<button
onClick={() => onNavigate('account')}
className={`w-full flex items-center px-4 py-3 rounded-lg transition-colors duration-200 text-left ${
activeView === 'account' ? 'bg-slate-100 ring-1 ring-slate-200' : 'hover:bg-slate-50'
}`}
>
<div className="w-8 h-8 rounded-full bg-slate-200 flex items-center justify-center text-slate-600 font-bold text-sm shrink-0">
DC
</div>
<div className="ml-3 overflow-hidden">
<p className="text-sm font-medium text-slate-900 truncate">Direction Client</p>
<p className="text-xs text-slate-500 truncate">Paramètres du compte</p>
</div>
</button>
<button
onClick={onLogout}
className="w-full flex items-center px-4 py-2 text-sm font-medium text-red-600 rounded-lg hover:bg-red-50 transition-colors duration-200"
>
<svg className="w-4 h-4 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1" /></svg>
Verrouiller la session
</button>
</div>
</aside>
{/* Zone de contenu principal */}
{/* CONTENU PRINCIPAL */}
<main className="flex-1 overflow-y-auto">
{children}
<div className="p-8">
{children}
</div>
</main>
</div>
);
}