Modèle de Données : Ajout de la table AnalyticsEvent dans prisma/schema.prisma pour suivre les vues de pages, les clics et le temps de rétention (DWELL_TIME). API Backend : Création de la route app/api/analytics/route.ts pour enregistrer les événements en base de données. Tracking Client : Création du composant AnalyticsTracker.tsx (intégré dans le layout principal) qui capture automatiquement : Le changement de page (Page Views). Les clics sur les boutons et liens importants. Le temps passé sur chaque page. 2. Intégration Base de Données (PostgreSQL/Prisma) Fiches Entreprises : Mise à jour de app/directory/[id]/page.tsx pour récupérer les données réelles depuis PostgreSQL via Prisma au lieu d'utiliser les données de test (mockData). Navigation Dashboard : Correction du bouton "Voir ma fiche" dans le tableau de bord pour qu'il redirige correctement vers le profil public de l'entrepreneur. 3. Administration & Metrics Nouvelle Application Admin : Initialisation d'un dossier admin/ (application Next.js séparée) destinée à la gestion de la plateforme et à la visualisation des statistiques (Metrics & Analytics). 4. Authentification & Inscription Nouvelle Page : Création de app/register/page.tsx pour permettre l'inscription des nouveaux utilisateurs. Gestion de Session : Amélioration de UserProvider.tsx pour une meilleure gestion de l'état utilisateur à travers l'application. 5. Maintenance & Types Mise à jour des types globaux dans types.ts et rafraîchissement du package-lock.json suite à l'ajout de dépendances.
60 lines
1.7 KiB
TypeScript
60 lines
1.7 KiB
TypeScript
"use client";
|
|
|
|
import Link from 'next/link';
|
|
import { usePathname } from 'next/navigation';
|
|
import {
|
|
LayoutDashboard,
|
|
Users,
|
|
MessageSquare,
|
|
BookOpen,
|
|
LogOut,
|
|
ShieldCheck,
|
|
BarChart3
|
|
} from 'lucide-react';
|
|
|
|
const menuItems = [
|
|
{ name: 'Dashboard', icon: LayoutDashboard, href: '/dashboard' },
|
|
{ name: 'Entrepreneurs', icon: ShieldCheck, href: '/entrepreneurs' },
|
|
{ name: 'Metrics & Analytics', icon: BarChart3, href: '/metrics' },
|
|
{ name: 'Commentaires', icon: MessageSquare, href: '/comments' },
|
|
{ name: 'Blog & Interviews', icon: BookOpen, href: '/blog' },
|
|
];
|
|
|
|
export default function Sidebar() {
|
|
const pathname = usePathname();
|
|
|
|
return (
|
|
<div className="admin-sidebar p-6 flex flex-col">
|
|
<div className="flex items-center gap-3 mb-10 px-2">
|
|
<div className="w-10 h-10 bg-indigo-600 rounded-xl flex items-center justify-center">
|
|
<ShieldCheck className="text-white" />
|
|
</div>
|
|
<h1 className="text-xl font-bold tracking-tight text-white">AfroAdmin</h1>
|
|
</div>
|
|
|
|
<nav className="flex-1 space-y-1">
|
|
{menuItems.map((item) => {
|
|
const isActive = pathname === item.href;
|
|
return (
|
|
<Link
|
|
key={item.name}
|
|
href={item.href}
|
|
className={`nav-link ${isActive ? 'active' : ''}`}
|
|
>
|
|
<item.icon className="w-5 h-5 mr-3" />
|
|
<span>{item.name}</span>
|
|
</Link>
|
|
);
|
|
})}
|
|
</nav>
|
|
|
|
<div className="mt-auto pt-6 border-t border-slate-700">
|
|
<button className="nav-link w-full text-left text-red-400 hover:bg-red-950/30">
|
|
<LogOut className="w-5 h-5 mr-3" />
|
|
<span>Déconnexion</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|