g/ember-market-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update loading.tsx

Browse Source
This commit is contained in:
NotII
2025-06-30 13:52:58 +01:00
parent 236a676ac5
commit ad108298a6
1 changed files with 45 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
app/dashboard/analytics/loading.tsx
View File

@@ -1,59 +1,62 @@
import { Skeleton } from "@/components/ui/skeleton"; import { Skeleton } from "@/components/ui/skeleton";
import { Card, CardContent, CardHeader } from "@/components/ui/card"; import { Card, CardContent, CardHeader } from "@/components/ui/card";
import Layout from "@/components/layout/layout";
export default function AnalyticsLoading() { export default function AnalyticsLoading() {
return ( return (
<div className="space-y-6"> <Layout>
<div>
<Skeleton className="h-8 w-64 mb-2" />
<Skeleton className="h-4 w-96" />
</div>
{/* Metrics Cards */}
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
{[...Array(4)].map((_, i) => (
<Card key={i}>
<CardHeader className="pb-2">
<Skeleton className="h-4 w-24" />
</CardHeader>
<CardContent>
<Skeleton className="h-8 w-20 mb-2" />
<Skeleton className="h-3 w-32" />
</CardContent>
</Card>
))}
</div>
{/* Completion Rate Card */}
<Card>
<CardHeader>
<Skeleton className="h-6 w-48 mb-2" />
<Skeleton className="h-4 w-80" />
</CardHeader>
<CardContent>
<div className="flex items-center gap-4">
<Skeleton className="h-8 w-16" />
<div className="flex-1">
<Skeleton className="h-2 w-full" />
</div>
<Skeleton className="h-6 w-20" />
</div>
</CardContent>
</Card>
{/* Analytics Tabs */}
<div className="space-y-6"> <div className="space-y-6">
<Skeleton className="h-10 w-full" /> <div>
<Skeleton className="h-8 w-64 mb-2" />
<Skeleton className="h-4 w-96" />
</div>
{/* Metrics Cards */}
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
{[...Array(4)].map((_, i) => (
<Card key={i}>
<CardHeader className="pb-2">
<Skeleton className="h-4 w-24" />
</CardHeader>
<CardContent>
<Skeleton className="h-8 w-20 mb-2" />
<Skeleton className="h-3 w-32" />
</CardContent>
</Card>
))}
</div>
{/* Completion Rate Card */}
<Card> <Card>
<CardHeader> <CardHeader>
<Skeleton className="h-6 w-48 mb-2" /> <Skeleton className="h-6 w-48 mb-2" />
<Skeleton className="h-4 w-80" /> <Skeleton className="h-4 w-80" />
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<Skeleton className="h-64 w-full" /> <div className="flex items-center gap-4">
<Skeleton className="h-8 w-16" />
<div className="flex-1">
<Skeleton className="h-2 w-full" />
</div>
<Skeleton className="h-6 w-20" />
</div>
</CardContent> </CardContent>
</Card> </Card>
{/* Analytics Tabs */}
<div className="space-y-6">
<Skeleton className="h-10 w-full" />
<Card>
<CardHeader>
<Skeleton className="h-6 w-48 mb-2" />
<Skeleton className="h-4 w-80" />
</CardHeader>
<CardContent>
<Skeleton className="h-64 w-full" />
</CardContent>
</Card>
</div>
</div> </div>
</div> </Layout>
); );
} }