Blittech/badoHair_fe
4
0
Fork 0
mirror of http://88.130.71.182:3000/BlitTech/badoHair_fe.git synced 2026-06-13 11:03:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update May 21 by Elvis

Browse Source
This commit is contained in:
belviskhoremk
2026-05-21 22:24:22 +00:00
parent 57f3311278
commit 342ba2c867
12 changed files with 71 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
app/admin/page.tsx
View File

@@ -1,6 +1,6 @@
"use client";
import React, { useEffect, useState } from "react";
import React, { useEffect, useState, startTransition } from "react";
import { Package, CalendarCheck, Clock, TrendingUp, ShoppingBag, Users, AlertTriangle, Euro } from "lucide-react";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
@@ -8,6 +8,41 @@ import { useAdmin } from "@/contexts/AdminContext";
import { useLanguage } from "@/contexts/LanguageContext";
import { getDashboardStats, DashboardStats } from "@/lib/api/admin";
function Skeleton() {
return (
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
{Array.from({ length: 4 }).map((_, i) => (
<Card key={i}>
<CardContent className="p-5">
<div className="h-4 bg-muted animate-pulse rounded w-2/3 mb-3" />
<div className="h-7 bg-muted animate-pulse rounded w-1/3" />
</CardContent>
</Card>
))}
</div>
);
}
function StatGrid({ cards }: { cards: { label: string; value: string | number; icon: React.ElementType; color: string; bg: string }[] }) {
return (
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
{cards.map((s) => (
<Card key={s.label}>
<CardContent className="p-5 flex items-center justify-between">
<div>
<p className="text-sm text-muted-foreground">{s.label}</p>
<p className="text-2xl font-semibold mt-1">{s.value}</p>
</div>
<div className={`h-10 w-10 rounded-full ${s.bg} flex items-center justify-center`}>
<s.icon className={`h-5 w-5 ${s.color}`} />
</div>
</CardContent>
</Card>
))}
</div>
);
}
export default function AdminOverview() {
const { reservations } = useAdmin();
const { t, locale } = useLanguage();
@@ -40,37 +75,6 @@ export default function AdminOverview() {
]
: [];
const Skeleton = () => (
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
{Array.from({ length: 4 }).map((_, i) => (
<Card key={i}>
<CardContent className="p-5">
<div className="h-4 bg-muted animate-pulse rounded w-2/3 mb-3" />
<div className="h-7 bg-muted animate-pulse rounded w-1/3" />
</CardContent>
</Card>
))}
</div>
);
const StatGrid = ({ cards }: { cards: { label: string; value: string | number; icon: React.ElementType; color: string; bg: string }[] }) => (
<div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
{cards.map((s) => (
<Card key={s.label}>
<CardContent className="p-5 flex items-center justify-between">
<div>
<p className="text-sm text-muted-foreground">{s.label}</p>
<p className="text-2xl font-semibold mt-1">{s.value}</p>
</div>
<div className={`h-10 w-10 rounded-full ${s.bg} flex items-center justify-center`}>
<s.icon className={`h-5 w-5 ${s.color}`} />
</div>
</CardContent>
</Card>
))}
</div>
);
return (
<div className="space-y-8">
<div>