Moheeb Zara
c87cb35d87
Per-route loading.tsx for dashboard/members/payments (content-shaped Skeletons instead of the single global full-page spinner) so heavy server pages paint structure immediately. Add/Edit member + Log cash modals now disable Cancel while the submit is in flight (was clickable mid-insert).
30 lines
1.1 KiB
TypeScript
30 lines
1.1 KiB
TypeScript
import { Skeleton } from '@/components/ui/skeleton'
|
|
|
|
export default function MembersLoading() {
|
|
return (
|
|
<>
|
|
<div className="bg-sidebar px-4 md:px-6 py-3 flex items-center justify-between">
|
|
<Skeleton className="h-6 w-28" />
|
|
<Skeleton className="h-8 w-24" />
|
|
</div>
|
|
<div className="p-4 md:p-6 space-y-4">
|
|
<div className="flex gap-2">
|
|
{Array.from({ length: 4 }).map((_, i) => <Skeleton key={i} className="h-8 w-24" />)}
|
|
</div>
|
|
<Skeleton className="h-9 w-full max-w-md" />
|
|
<div className="rounded-lg border border-border divide-y divide-border">
|
|
{Array.from({ length: 8 }).map((_, i) => (
|
|
<div key={i} className="px-4 py-3 flex items-center gap-4">
|
|
<Skeleton className="h-8 w-8 rounded-full" />
|
|
<Skeleton className="h-4 flex-1 max-w-[40%]" />
|
|
<Skeleton className="h-4 w-16" />
|
|
<Skeleton className="h-4 w-20" />
|
|
<Skeleton className="h-7 w-16" />
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|