fb7ddde42e
Introduce new pages for profile settings, admin dashboard (users, contents, categories), and public user profiles. Enhance profile functionality with avatar uploads and bio updates. Include help and improved content trends/recent pages. Streamline content display using `HomeContent`.
86 lines
2.4 KiB
TypeScript
86 lines
2.4 KiB
TypeScript
"use client";
|
|
|
|
import { useEffect, useState } from "react";
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
|
|
import { adminService, type AdminStats } from "@/services/admin.service";
|
|
import { Users, FileText, LayoutGrid, AlertCircle } from "lucide-react";
|
|
import Link from "next/link";
|
|
import { Skeleton } from "@/components/ui/skeleton";
|
|
|
|
export default function AdminDashboardPage() {
|
|
const [stats, setStats] = useState<AdminStats | null>(null);
|
|
const [loading, setLoading] = useState(true);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
useEffect(() => {
|
|
adminService
|
|
.getStats()
|
|
.then(setStats)
|
|
.catch((err) => {
|
|
console.error(err);
|
|
setError("Impossible de charger les statistiques.");
|
|
})
|
|
.finally(() => setLoading(false));
|
|
}, []);
|
|
|
|
if (error) {
|
|
return (
|
|
<div className="flex h-[50vh] flex-col items-center justify-center gap-4 text-center">
|
|
<AlertCircle className="h-12 w-12 text-destructive" />
|
|
<p className="text-xl font-semibold">{error}</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
const statCards = [
|
|
{
|
|
title: "Utilisateurs",
|
|
value: stats?.users,
|
|
icon: Users,
|
|
href: "/admin/users",
|
|
color: "text-blue-500",
|
|
},
|
|
{
|
|
title: "Contenus",
|
|
value: stats?.contents,
|
|
icon: FileText,
|
|
href: "/admin/contents",
|
|
color: "text-green-500",
|
|
},
|
|
{
|
|
title: "Catégories",
|
|
value: stats?.categories,
|
|
icon: LayoutGrid,
|
|
href: "/admin/categories",
|
|
color: "text-purple-500",
|
|
},
|
|
];
|
|
|
|
return (
|
|
<div className="flex-1 space-y-8 p-4 pt-6 md:p-8">
|
|
<div className="flex items-center justify-between space-y-2">
|
|
<h2 className="text-3xl font-bold tracking-tight">Dashboard Admin</h2>
|
|
</div>
|
|
<div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
|
|
{statCards.map((card) => (
|
|
<Link key={card.title} href={card.href}>
|
|
<Card className="hover:bg-accent transition-colors cursor-pointer">
|
|
<CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
|
|
<CardTitle className="text-sm font-medium">{card.title}</CardTitle>
|
|
<card.icon className={`h-4 w-4 ${card.color}`} />
|
|
</CardHeader>
|
|
<CardContent>
|
|
{loading ? (
|
|
<Skeleton className="h-8 w-20" />
|
|
) : (
|
|
<div className="text-2xl font-bold">{card.value}</div>
|
|
)}
|
|
</CardContent>
|
|
</Card>
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|