Implement Nested Route Structure for Dashboard Module

[Olowodarey]

The dashboard module currently renders all content within a single flat page.tsx at /dashboard. While a layout.tsx exists with a Sidebar and TopNav, the sidebar navigation links (/dashboard/savings-pools, /dashboard/staking, /dashboard/analytics, /dashboard/governance, /dashboard/settings) point to routes that do not have corresponding page files, resulting in 404s when navigated to.

The dashboard needs to be restructured to follow the Next.js App Router nested layout & routing pattern, where each sidebar link maps to its own route segment rendered dynamically within the shared dashboard layout.

Current State

app/dashboard/
├── dashboard.css
├── layout.tsx       ← exists, renders Sidebar + TopNav + {children}
└── page.tsx         ← single monolithic page, all dashboard content lives here

• The Sidebar component defines navigation links to 5 sub-routes, but none of these routes exist as folders/pages.
• Navigating to any sub-route (e.g., /dashboard/savings-pools) results in a 404.
• All dashboard widgets (NetWorthCard, QuickActionsGrid, ActivePoolList) are hardcoded inside the single page.tsx.

Expected State

app/dashboard/
├── layout.tsx              ← shared layout (Sidebar + TopNav) — already exists
├── page.tsx                ← overview/home content for /dashboard
├── savings-pools/
│   └── page.tsx            ← content for /dashboard/savings-pools
├── staking/
│   └── page.tsx            ← content for /dashboard/staking
├── analytics/
│   └── page.tsx            ← content for /dashboard/analytics
├── governance/
│   └── page.tsx            ← content for /dashboard/governance
└── settings/
    └── page.tsx            ← content for /dashboard/settings

Implementation Steps

1. Create route folders for each sidebar link under app/dashboard/:

   • savings-pools/page.tsx
   • staking/page.tsx
   • analytics/page.tsx
   • governance/page.tsx
   • settings/page.tsx

2. Add a placeholder page component in each new route file. Each should export a default React component with a descriptive heading (e.g., "Savings Pools") so the route is navigable and renders within the existing dashboard layout.

3. Keep app/dashboard/page.tsx as the overview/home view (/dashboard). No changes needed here — it already renders the main dashboard widgets.

4. Verify the existing layout.tsx correctly wraps all child routes. The current implementation already renders {children}, so it should work out of the box.

5. Test navigation: Clicking each sidebar link should render the corresponding sub-page inside the dashboard layout (Sidebar + TopNav persist, content area updates).

Acceptance Criteria

• All 5 sidebar routes resolve to their own pages instead of returning 404.
• Each sub-route renders within the shared dashboard layout (Sidebar and TopNav remain visible).
• The /dashboard route still renders the current overview widgets.
• Active sidebar link highlighting works correctly on each sub-route.
• No broken imports or console errors.

[drips-wave]

This issue has been added to the Stellar Wave Program and is worth 200 Points.

🧑‍💻 Interested in contributing? Apply to work on this issue on Drips Wave, earn points, and receive rewards.

Warning

Only applications submitted via the apply link above will be considered. Please do not apply by commenting on the issue or opening a PR directly.

🤠 Repo maintainers: You can manage this issue's Points and Complexity on your Maintainer Dashboard here. Please keep an eye on applications and respond quickly 💙

ℹ️ Learn more about Drips Wave

[Jeyvers]

@Jeyvers has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

Hi, I'd like to work on this and will do it properly

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Jeyvers to this issue.

[daveades]

@daveades has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

Good Day,

I’ve reviewed Issue #177 – Implement Nested Route Structure for the Dashboard Module in the Nestera repository.

The problem is clearly architectural: sidebar links point to route segments that do not exist, resulting in 404s. The solution is to restructure the dashboard using the Next.js App Router nested routing pattern while preserving the existing shared layout.

I can implement this cleanly by:

• Creating route folders under app/dashboard/ for:

  • savings-pools
  • staking
  • analytics
  • governance
  • settings

• Adding placeholder page.tsx components for each route with descriptive headings

• Keeping the current app/dashboard/page.tsx intact as the overview route

• Ensuring the existing layout.tsx continues to wrap all child routes correctly

• Verifying active sidebar highlighting works properly across nested routes

• Testing navigation to confirm Sidebar and TopNav persist while content updates dynamically

The implementation will strictly follow the App Router pattern without refactoring unrelated dashboard logic.

I’d appreciate being assigned this issue and can complete it promptly.

Thank you for your consideration.

ℹ️ Repo Maintainers: To accept this application, review their application or assign @daveades to this issue.

[abbakargarba]

@abbakargarba has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

Dear Maintainer,

I'll restructure /dashboard following Next.js App Router patterns: create route folders for savings-pools, staking, analytics, governance, settings with placeholder pages, keep existing page.tsx as overview, and verify layout wraps all children with working sidebar navigation. No more 404s.

Abbakargarba - Babax

ℹ️ Repo Maintainers: To accept this application, review their application or assign @abbakargarba to this issue.

[Bhenzdizma]

@Bhenzdizma has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

Hello i am a frontend dev an i will love to implement the dashboard layout now

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Bhenzdizma to this issue.

[drips-wave]

Congratulations, @Bhenzdizma! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on February 26, 2026.

🧑‍💻 @Bhenzdizma: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are issued when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊