63 lines
1.9 KiB
TypeScript
63 lines
1.9 KiB
TypeScript
import { Skeleton } from '@workspace/ui/components/skeleton';
|
|
import {
|
|
Table,
|
|
TableBody,
|
|
TableCell,
|
|
TableHead,
|
|
TableHeader,
|
|
TableRow,
|
|
} from '@workspace/ui/components/table';
|
|
|
|
export default function Loading() {
|
|
return (
|
|
<div className="container mx-auto py-10">
|
|
<div className="space-y-4">
|
|
{/* Header skeleton */}
|
|
<div className="flex items-center justify-between">
|
|
<h1 className="text-2xl font-semibold tracking-tight">Students</h1>
|
|
<Skeleton className="h-4 w-24" />
|
|
</div>
|
|
|
|
{/* Table skeleton */}
|
|
<div className="rounded-md border">
|
|
<Table>
|
|
<TableHeader>
|
|
<TableRow>
|
|
<TableHead>
|
|
<Skeleton className="h-4 w-8" />
|
|
</TableHead>
|
|
<TableHead>
|
|
<Skeleton className="h-4 w-20" />
|
|
</TableHead>
|
|
<TableHead>
|
|
<Skeleton className="h-4 w-20" />
|
|
</TableHead>
|
|
<TableHead>
|
|
<Skeleton className="h-4 w-32" />
|
|
</TableHead>
|
|
</TableRow>
|
|
</TableHeader>
|
|
<TableBody>
|
|
{Array.from({ length: 8 }).map((_, index) => (
|
|
<TableRow key={index}>
|
|
<TableCell>
|
|
<Skeleton className="h-4 w-8" />
|
|
</TableCell>
|
|
<TableCell>
|
|
<Skeleton className="h-4 w-24" />
|
|
</TableCell>
|
|
<TableCell>
|
|
<Skeleton className="h-4 w-24" />
|
|
</TableCell>
|
|
<TableCell>
|
|
<Skeleton className="h-4 w-40" />
|
|
</TableCell>
|
|
</TableRow>
|
|
))}
|
|
</TableBody>
|
|
</Table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
} |