fe01f31538
Some checks failed
Build Frontend / build (push) Failing after 7s
Replaces imports from 'components/ui' with 'components/common' across the app and dashboard pages, and updates model and API imports to use new paths under 'lib'. Removes redundant authentication checks from several dashboard pages. Adds new dashboard components and utility files, and reorganizes hooks and services into the 'lib' directory for improved structure.
90 lines
3.4 KiB
TypeScript
90 lines
3.4 KiB
TypeScript
"use client"
|
|
|
|
import { Card, CardContent, CardHeader, CardTitle } from "@/components/common/card";
|
|
import { Skeleton } from "@/components/common/skeleton";
|
|
import Layout from "@/components/layout/layout";
|
|
import { Loader2 } from "lucide-react";
|
|
import { SnowLoader } from "@/components/snow-loader";
|
|
|
|
export default function OrderDetailsLoading() {
|
|
return (
|
|
<Layout>
|
|
<div className="space-y-6 animate-in fade-in duration-500">
|
|
{/* Header skeleton */}
|
|
<div className="flex justify-between items-center">
|
|
<div>
|
|
<Skeleton className="h-8 w-48 mb-2" />
|
|
<Skeleton className="h-4 w-72" />
|
|
</div>
|
|
<Skeleton className="h-10 w-32" />
|
|
</div>
|
|
|
|
{/* Order details skeleton */}
|
|
<Card className="border-border/40 shadow-sm">
|
|
<CardHeader>
|
|
<div className="flex justify-between items-center">
|
|
<CardTitle>
|
|
<Skeleton className="h-6 w-32" />
|
|
</CardTitle>
|
|
<Skeleton className="h-6 w-24" />
|
|
</div>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<div className="space-y-6">
|
|
{/* Order status and tracking */}
|
|
<div className="flex items-center gap-4">
|
|
<Skeleton className="h-8 w-8 rounded-full" />
|
|
<div className="space-y-2">
|
|
<Skeleton className="h-4 w-24" />
|
|
<Skeleton className="h-4 w-48" />
|
|
</div>
|
|
</div>
|
|
|
|
{/* Order items */}
|
|
<div className="space-y-4">
|
|
{[...Array(3)].map((_, i) => (
|
|
<div key={i} className="flex items-center gap-4">
|
|
<Skeleton className="h-16 w-16 rounded-md" />
|
|
<div className="space-y-2 flex-1">
|
|
<Skeleton className="h-4 w-48" />
|
|
<Skeleton className="h-4 w-32" />
|
|
</div>
|
|
<div className="text-right">
|
|
<Skeleton className="h-4 w-16" />
|
|
<Skeleton className="h-4 w-20" />
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
|
|
{/* Order summary */}
|
|
<div className="space-y-2">
|
|
<div className="flex justify-between">
|
|
<Skeleton className="h-4 w-24" />
|
|
<Skeleton className="h-4 w-16" />
|
|
</div>
|
|
<div className="flex justify-between">
|
|
<Skeleton className="h-4 w-32" />
|
|
<Skeleton className="h-4 w-20" />
|
|
</div>
|
|
<div className="flex justify-between font-bold">
|
|
<Skeleton className="h-4 w-24" />
|
|
<Skeleton className="h-4 w-24" />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Loading overlay */}
|
|
<div className="fixed inset-0 flex items-center justify-center bg-background/80 backdrop-blur-[2px] pointer-events-none">
|
|
<SnowLoader className="z-0" count={30} />
|
|
<div className="flex flex-col items-center justify-center p-6 rounded-lg z-10 relative">
|
|
<Loader2 className="h-12 w-12 animate-spin text-primary mb-4" />
|
|
<p className="text-lg font-medium">Loading order details...</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Layout>
|
|
);
|
|
}
|