add useDocuments and load saved documents in DocumentsVault
This commit is contained in:
@@ -4,6 +4,8 @@ import { Shield, ShieldCheck, HelpCircle, Lock, Settings, LogOut } from 'lucide-
|
||||
import { cn } from '@/utils/utils';
|
||||
import { Card } from '@/components/ui/Card';
|
||||
import { NEUMORPHISM } from '@/styles/Neumorphism';
|
||||
import { useTheme } from '@/hooks/useTheme';
|
||||
import { ThemeToggle } from '@ui/ThemeToggle';
|
||||
|
||||
interface SidebarProps {
|
||||
onLogout: () => void;
|
||||
@@ -21,20 +23,21 @@ const NAVIGATION_ITEMS = [
|
||||
|
||||
|
||||
export const Sidebar: React.FC<SidebarProps> = ({ onLogout, className }) => {
|
||||
const { isDark, toggleTheme } = useTheme();
|
||||
return (
|
||||
<Card className={cn("w-60 flex flex-col p-6 shrink-0", className)}>
|
||||
{/* 1. EN-TÊTE / LOGO */}
|
||||
<div className="flex items-center gap-4 mb-10 px-2">
|
||||
{/* Petit badge logo avec effet creusé */}
|
||||
<div className={cn(
|
||||
"w-12 h-12 rounded-2xl flex items-center justify-center bg-[#e8e8e8] dark:bg-[#1e293b]",
|
||||
"w-12 h-12 rounded-2xl flex items-center justify-center bg-[#e8e8e8] dark:bg-[#1e293b] transition-all duration-300 ease-in-out",
|
||||
"shadow-[inset_4px_4px_8px_#c5c5c5,inset_-4px_-4px_8px_#ffffff] dark:shadow-[inset_4px_4px_8px_#121926,inset_-4px_-4px_8px_#2a3850]"
|
||||
)}>
|
||||
<Shield className="w-6 h-6 text-blue-600 dark:text-blue-500" />
|
||||
<Shield className="w-6 h-6 text-blue-600 dark:text-blue-500 transition-all duration-300 ease-in-out" />
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="text-2xl font-black tracking-widest text-slate-800 dark:text-white leading-none">AEGIS</h1>
|
||||
<span className="text-[10px] font-bold text-slate-400 uppercase tracking-widest">by GISE</span>
|
||||
<h1 className="text-2xl font-black tracking-widest text-slate-800 dark:text-white leading-none transition-all duration-300 ease-in-out">AEGIS</h1>
|
||||
<span className="text-[10px] font-bold text-slate-400 uppercase tracking-widest transition-all duration-300 ease-in-out">by GISE</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -52,7 +55,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ onLogout, className }) => {
|
||||
"w-full flex items-center gap-4 px-5 py-4 rounded-2xl transition-all duration-300 ease-in-out cursor-pointer",
|
||||
"bg-[#e8e8e8] dark:bg-[#1e293b]",
|
||||
isActive
|
||||
? cn(NEUMORPHISM.insetLight, NEUMORPHISM.insetDark, "!text-blue-600 dark:!text-blue-400 font-black")
|
||||
? cn(NEUMORPHISM.insetLight, NEUMORPHISM.insetDark, "text-blue-600! dark:text-blue-400! font-black")
|
||||
: cn(NEUMORPHISM.lightShadow, NEUMORPHISM.darkShadow, "text-slate-500 dark:text-slate-400 font-bold hover:text-slate-700 dark:hover:text-slate-200")
|
||||
)
|
||||
}
|
||||
@@ -74,6 +77,7 @@ export const Sidebar: React.FC<SidebarProps> = ({ onLogout, className }) => {
|
||||
})}
|
||||
</nav>
|
||||
|
||||
<ThemeToggle isDark={isDark} toggleTheme={toggleTheme} />
|
||||
{/* 3. ZONE DE DÉCONNEXION */}
|
||||
<div className="pt-6 mt-6 border-t border-white/40 dark:border-slate-800/50">
|
||||
<button
|
||||
|
||||
Reference in New Issue
Block a user