Revamp admin dashboard analytics and UI

Refactored the admin dashboard to use tabbed navigation for analytics and management. Enhanced AdminAnalytics with Recharts visualizations, added top vendors by revenue, and improved chart tooltips. Removed unused columns from vendor table. Updated layout and notification context to exclude admin pages from dashboard-specific UI and notifications. Minor debug logging added to SystemStatusCard.
This commit is contained in:
g
2025-11-28 19:08:40 +00:00
parent f212859bda
commit 4b0bd2cf8c
8 changed files with 337 additions and 219 deletions

View File

@@ -1,38 +1,47 @@
export const dynamic = "force-dynamic";
import React from "react";
import AdminAnalytics from "@/components/admin/AdminAnalytics";
import InviteVendorCard from "@/components/admin/InviteVendorCard";
import BanUserCard from "@/components/admin/BanUserCard";
import RecentOrdersCard from "@/components/admin/RecentOrdersCard";
import SystemStatusCard from "@/components/admin/SystemStatusCard";
import InvitationsListCard from "@/components/admin/InvitationsListCard";
import VendorsCard from "@/components/admin/VendorsCard";
import { Button } from "@/components/ui/button";
import Link from "next/link";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
export default function AdminPage() {
return (
<div className="space-y-6">
<div className="flex items-center justify-between">
<div>
<h1 className="text-2xl font-semibold tracking-tight">Admin</h1>
<p className="text-sm text-muted-foreground mt-1">Restricted area. Only admin1 can access.</p>
<h1 className="text-2xl font-semibold tracking-tight">Admin Dashboard</h1>
<p className="text-sm text-muted-foreground mt-1">Platform analytics and vendor management</p>
</div>
<Button asChild variant="outline" size="sm">
<Link href="/dashboard">Back to Dashboard</Link>
</Button>
</div>
<div className="grid gap-4 lg:gap-6 sm:grid-cols-2 lg:grid-cols-3 items-stretch">
<SystemStatusCard />
<VendorsCard />
<InviteVendorCard />
<BanUserCard />
<RecentOrdersCard />
<InvitationsListCard />
<Tabs defaultValue="analytics" className="space-y-6">
<TabsList>
<TabsTrigger value="analytics">Analytics</TabsTrigger>
<TabsTrigger value="management">Management</TabsTrigger>
</TabsList>
{/* Disabled/hidden cards as requested */}
</div>
<TabsContent value="analytics" className="space-y-6">
<AdminAnalytics />
</TabsContent>
<TabsContent value="management" className="space-y-6">
<div className="grid gap-4 lg:gap-6 sm:grid-cols-2 lg:grid-cols-3 items-stretch">
<VendorsCard />
<InviteVendorCard />
<BanUserCard />
<InvitationsListCard />
</div>
</TabsContent>
</Tabs>
</div>
);
}

View File

@@ -130,8 +130,6 @@ export default async function AdminVendorsPage() {
<TableHead>Store</TableHead>
<TableHead>Status</TableHead>
<TableHead>Join Date</TableHead>
<TableHead>Orders</TableHead>
<TableHead>Revenue</TableHead>
<TableHead className="text-right">Actions</TableHead>
</TableRow>
</TableHeader>
@@ -139,10 +137,7 @@ export default async function AdminVendorsPage() {
{vendors.map((vendor) => (
<TableRow key={vendor._id}>
<TableCell>
<div>
<div className="font-medium">{vendor.username}</div>
<div className="text-sm text-muted-foreground">{vendor.email || 'No email'}</div>
</div>
<div className="font-medium">{vendor.username}</div>
</TableCell>
<TableCell>{vendor.storeId || 'No store'}</TableCell>
<TableCell>
@@ -162,8 +157,6 @@ export default async function AdminVendorsPage() {
<TableCell>
{vendor.createdAt ? new Date(vendor.createdAt).toLocaleDateString() : 'N/A'}
</TableCell>
<TableCell>N/A</TableCell>
<TableCell>N/A</TableCell>
<TableCell className="text-right">
<div className="flex items-center justify-end space-x-2">
<Button variant="outline" size="sm">