fix: resolve build issues and finalize fixes

Complete Toaster and Skeleton components, add loading.tsx
Update development docs for changes and progress.

Co-authored-by: null <4804959+fnvtk@users.noreply.github.com>
This commit is contained in:
v0
2025-08-08 11:34:42 +00:00
parent 3443a1e50a
commit bdf456523b
5 changed files with 48 additions and 75 deletions

View File

@@ -1,37 +1,24 @@
import { Skeleton } from "@/components/ui/skeleton"
export default function Loading() {
return (
<main className="p-4 md:p-6" aria-busy="true" aria-live="polite">
<div className="space-y-6">
{/* Header skeleton */}
<div className="flex items-center justify-between">
<div className="space-y-2">
<div className="h-6 w-40 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
<div className="h-4 w-64 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
</div>
<div className="h-9 w-28 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
<div className="p-6 space-y-6" aria-busy="true" aria-live="polite">
<div className="space-y-2">
<Skeleton className="h-8 w-40" />
<Skeleton className="h-4 w-64" />
</div>
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
<div className="lg:col-span-2 space-y-4">
<Skeleton className="h-10 w-full" />
<Skeleton className="h-[240px] w-full" />
<Skeleton className="h-[160px] w-full" />
</div>
{/* Step indicator skeleton */}
<div className="flex items-center gap-3">
<div className="h-8 w-24 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
<div className="h-8 w-24 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
<div className="h-8 w-24 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
</div>
{/* Editor/Forms skeleton */}
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6">
<section className="lg:col-span-2 space-y-4">
<div className="h-10 w-1/2 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
<div className="h-40 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
<div className="h-10 w-32 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
</section>
<aside className="space-y-4">
<div className="h-6 w-24 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
<div className="h-28 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
<div className="h-28 rounded bg-gray-200 dark:bg-gray-800 animate-pulse" />
</aside>
<div className="space-y-4">
<Skeleton className="h-10 w-full" />
<Skeleton className="h-[200px] w-full" />
<Skeleton className="h-[120px] w-full" />
</div>
</div>
</main>
</div>
)
}