pacnpal/thrilltrack-explorer
1
0
Fork 0
mirror of https://github.com/pacnpal/thrilltrack-explorer.git synced 2025-12-23 08:11:13 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat: Implement skeleton loading

Browse Source
This commit is contained in:
gpt-engineer-app[bot]
2025-10-10 15:18:02 +00:00
parent c4b3886ffc
commit a16154c3de
8 changed files with 171 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
src/pages/AdminDashboard.tsx
View File

@@ -14,6 +14,8 @@ import { useModerationStats } from '@/hooks/useModerationStats';
import { useAdminSettings } from '@/hooks/useAdminSettings';
import { supabase } from '@/integrations/supabase/client';
import { Alert, AlertDescription } from '@/components/ui/alert';
import { Skeleton } from '@/components/ui/skeleton';
import { QueueSkeleton } from '@/components/moderation/QueueSkeleton';
export default function AdminDashboard() {
const { user, loading: authLoading } = useAuth();
@@ -110,14 +112,37 @@ export default function AdminDashboard() {
if (authLoading || roleLoading) {
return (
<div className="container mx-auto px-4 py-8">
<div className="flex items-center justify-center min-h-[400px]">
<div className="text-center">
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-primary mx-auto mb-4"></div>
<p className="text-muted-foreground">Loading admin panel...</p>
<AdminLayout>
<div className="space-y-6">
<div>
<h1 className="text-2xl font-bold tracking-tight">Admin Dashboard</h1>
<p className="text-muted-foreground mt-1">Central hub for all moderation activity</p>
</div>
{/* Skeleton for stat cards */}
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
{[1, 2, 3].map((i) => (
<Card key={i}>
<CardContent className="p-6">
<div className="flex items-center justify-between">
<div className="flex items-center gap-4">
<Skeleton className="h-11 w-11 rounded-lg" />
<Skeleton className="h-4 w-32" />
</div>
<Skeleton className="h-10 w-16" />
</div>
</CardContent>
</Card>
))}
</div>
{/* Skeleton for tabs */}
<div className="space-y-4">
<Skeleton className="h-12 w-full" />
<QueueSkeleton count={3} />
</div>
</div>
</div>
</AdminLayout>
);
}