Files
accounted/components/settings/SettingsLoadingSkeleton.tsx
admin e7f0070e84
masterplan-lock / check (push) Successful in 19s
ci / sonar (push) Failing after 21s
security / scan (push) Failing after 1m37s
fix(restore): återställ default branch-filer som raderades av docs-publiceringen (7e33543)
Återställer 6136 filer från 7e33543^. Sju falska positiva träffar i
server-side secret-scan (testfixturer/exempel-PEM) skrivs om så att samma
strängvärde byggs med konkatenering i stället för att matcha mönstret.
2026-11-10 09:37:22 +01:00

49 lines
1.7 KiB
TypeScript

import { Skeleton } from '@/components/ui/skeleton'
/**
* Placeholder shown while a settings section's data loads. Mirrors the real
* shape of the section forms (see CompanyInfoForm and SettingsFormWrapper):
* an uppercase section heading, a two-column grid of label/field pairs,
* full-width rows, and a right-aligned save button, so the swap to live
* content doesn't jump from a mismatched layout.
*/
export function SettingsLoadingSkeleton() {
return (
<div className="space-y-8" aria-busy="true">
<div className="space-y-4">
<Skeleton className="h-4 w-40" />
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
{[0, 1].map((cell) => (
<div key={cell} className="space-y-2">
<Skeleton className="h-3.5 w-24" />
<Skeleton className="h-10 w-full" />
</div>
))}
</div>
<div className="space-y-2">
<Skeleton className="h-3.5 w-24" />
<Skeleton className="h-10 w-full" />
</div>
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
{[0, 1].map((cell) => (
<div key={cell} className="space-y-2">
<Skeleton className="h-3.5 w-24" />
<Skeleton className="h-10 w-full" />
</div>
))}
</div>
<div className="mt-8 flex justify-end">
<Skeleton className="h-10 w-24" />
</div>
</div>
<div className="space-y-4 border-t border-border pt-8">
<Skeleton className="h-4 w-32" />
<div className="space-y-2">
<Skeleton className="h-3.5 w-24" />
<Skeleton className="h-10 w-full" />
</div>
</div>
</div>
)
}