Files
Spanglish/frontend/src/app/(public)/events/[id]/loading.tsx
T
MichilisandCursor 75e317d73e Replace spinners with skeleton loading states for faster perceived UX.
Add reusable Skeleton components and route-level loading files across public pages and admin lists so layouts stay stable while data loads.

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-07-12 23:14:11 +00:00

29 lines
1.0 KiB
TypeScript

import { Skeleton, ArticleSkeleton } from '@/components/ui/Skeleton';
// Route-level skeleton for the event detail page: back link, banner, article
// body on the left and the booking card in the sidebar.
export default function EventDetailLoading() {
return (
<div className="section-padding">
<div className="container-page">
<Skeleton className="h-5 w-36" />
<div className="mt-6 grid grid-cols-1 lg:grid-cols-3 gap-8">
<div className="lg:col-span-2">
<ArticleSkeleton withBanner />
</div>
<div>
<div className="bg-white rounded-card shadow-card p-6" aria-hidden="true">
<div className="text-center">
<Skeleton className="h-4 w-16 mx-auto" />
<Skeleton className="mt-3 h-10 w-32 mx-auto" />
</div>
<Skeleton className="mt-6 h-12 w-full rounded-btn" />
<Skeleton className="mt-3 h-4 w-3/4 mx-auto" />
</div>
</div>
</div>
</div>
</div>
);
}