All checks were successful
Deploy to Production / Build and Deploy (push) Successful in 2m58s
Zone de dépôt : le contour s'allume en doré et la carte s'agrandit quand on la survole avec un fichier (l'information existait, elle n'était jamais affichée). Or lisible : nouveau jeton « or encre » (#8B6F47) pour les textes, l'or clair reste aux traits, fonds et au mode sombre ; 52 textes dorés convertis, pastille comprises ; plus aucun texte sous 10 px (8,5 px → 11 px dans le sélecteur de moteurs). Tarifs : le choix redevient binaire — les trois abonnements payants en grandes cartes, le gratuit en ligne discrète au-dessus, le sur mesure en ligne dorée dessous. Le tableau comparatif complet reste dessous. Accueil : le mur de six cartes génériques est remplacé par un vrai avant/après — une page « Cahier des charges — Traitement d'air » à côté de sa traduction anglaise, structure identique au mot près (terme technique en gras des deux côtés), sceau « Même mise en page, mot pour mot » entre les deux, et trois preuves précises (SmartArt reconstruits, séries de graphiques traduites, tables des matières régénérées) à la place des promesses vagues.
88 lines
3.4 KiB
TypeScript
88 lines
3.4 KiB
TypeScript
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import { LogOut } from 'lucide-react';
|
|
import { useUser } from './useUser';
|
|
import { useLogout } from './useLogout';
|
|
import { DashboardNavLinks } from './DashboardNavLinks';
|
|
import { getInitials, translateTier } from './utils';
|
|
import { ThemeToggle } from '@/components/ui/theme-toggle';
|
|
import { useI18n } from '@/lib/i18n';
|
|
|
|
export function DashboardSidebar() {
|
|
const { data: user, isLoading } = useUser();
|
|
const { logout } = useLogout();
|
|
const { t } = useI18n();
|
|
|
|
|
|
return (
|
|
<aside className="hidden w-72 shrink-0 border-r border-black/5 dark:border-white/5 bg-white dark:bg-[#141414] lg:flex lg:flex-col">
|
|
{/* Brand */}
|
|
<div className="flex items-center gap-3 px-6 py-6">
|
|
<div className="flex size-9 items-center justify-center rounded-xl bg-brand-dark text-white font-bold text-sm">
|
|
W
|
|
</div>
|
|
<span className="text-sm font-bold tracking-tight text-brand-dark dark:text-white">
|
|
{t('auth.brandName')}
|
|
</span>
|
|
</div>
|
|
|
|
{/* Navigation */}
|
|
<nav className="flex-1 overflow-y-auto px-3 py-2">
|
|
<div className="flex flex-col gap-1">
|
|
<DashboardNavLinks />
|
|
</div>
|
|
</nav>
|
|
|
|
{/* Upgrade link for free users */}
|
|
{(!user?.tier || user.tier === 'free') && (
|
|
<div className="px-6 py-2">
|
|
<Link
|
|
href="/pricing"
|
|
className="text-[10px] font-black uppercase tracking-widest text-brand-goldink dark:text-brand-accent hover:text-brand-dark dark:hover:text-white transition-colors"
|
|
>
|
|
{t('dashboard.sidebar.upgradeToPro', { defaultValue: 'Passer Pro →' })}
|
|
</Link>
|
|
</div>
|
|
)}
|
|
|
|
{/* User section */}
|
|
<div className="border-t border-black/5 dark:border-white/5">
|
|
{!isLoading && user && (
|
|
<div className="px-6 py-4">
|
|
<div className="flex items-center gap-3 mb-3">
|
|
<div className="flex size-10 shrink-0 items-center justify-center rounded-xl bg-brand-dark dark:bg-brand-accent text-white dark:text-brand-dark font-bold text-[11px]">
|
|
{getInitials(user.name)}
|
|
</div>
|
|
<div className="flex min-w-0 flex-1 flex-col gap-0.5">
|
|
<span className="truncate text-[11px] font-black uppercase tracking-tight text-brand-dark dark:text-white">
|
|
{user.name}
|
|
</span>
|
|
<span className="truncate text-[10px] text-brand-dark/60 dark:text-white/60">
|
|
{user.email}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div className="flex items-center gap-2 mb-3">
|
|
<span className="px-2.5 py-0.5 rounded-full border border-brand-accent/30 text-brand-goldink dark:text-brand-accent text-[10px] font-black uppercase">
|
|
{translateTier(t, user.tier)}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
)}
|
|
|
|
<div className="flex items-center gap-2 px-6 py-3">
|
|
<ThemeToggle />
|
|
<button
|
|
className="flex items-center gap-2 text-[10px] font-black uppercase tracking-widest text-brand-dark/40 dark:text-white/40 hover:text-red-500 transition-colors"
|
|
onClick={logout}
|
|
>
|
|
<LogOut size={14} />
|
|
{t('dashboard.sidebar.signOut')}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</aside>
|
|
);
|
|
}
|