Skip to content

Replace DashboardLoading's full-page Spinner with per-section skeletons matching MetricsBar/PoolsPanel #165

Description

@Jagadeeshftw

📌 Description

src/app/dashboard/loading.tsx (the App Router loading boundary for /dashboard) renders a single generic Spinner, but the actual DashboardPage (src/app/dashboard/page.tsx) it stands in for is composed of MetricsBar, PoolsPanel, and QuoteForm — each of which already has its own richer loading treatment (TableSkeleton, a Card-wrapped Spinner) once mounted. The route-level loading boundary's plain spinner is a visual downgrade compared to what appears a moment later.

🧩 Requirements and context

  • Update src/app/dashboard/loading.tsx to render a skeleton approximating the dashboard's actual layout (a stat-row skeleton plus table/form-shaped placeholders), reusing TableSkeleton/Card rather than a single centered Spinner.
  • Keep the SiteHeader wrapper and overall page shell consistent with DashboardPage.

🛠️ Suggested execution

  • Update src/app/dashboard/loading.tsx to compose Card/TableSkeleton (and similar) into a layout resembling DashboardPage's structure.
  • Add or extend a test file for the loading boundary if the project's conventions call for one (check for a pattern in src/app/not-found.test.tsx).

✅ Acceptance criteria

  • The dashboard route's loading boundary visually approximates the real dashboard layout instead of a single centered spinner.
  • The page shell (header) remains consistent with the loaded page.

🔒 Security notes

No new attack surface; a loading-state UI polish task.

📋 Guidelines

  • Minimum 95% test coverage
  • Clear documentation
  • Timeframe: 96 hours

Metadata

Metadata

Assignees

Labels

GrantFox OSSIssue tracked in GrantFox OSSMaybe RewardedIssue may be eligible for a GrantFox rewardOfficial Campaign | FWC26Campaign: Official Campaign | FWC26ui

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions