Skip to content

feat: implement responsive sidebar navigation#258

Open
DevSolex wants to merge 1 commit into
MettaChain:mainfrom
DevSolex:feat/responsive-sidebar-navigation
Open

feat: implement responsive sidebar navigation#258
DevSolex wants to merge 1 commit into
MettaChain:mainfrom
DevSolex:feat/responsive-sidebar-navigation

Conversation

@DevSolex
Copy link
Copy Markdown

Summary

Implements the responsive sidebar navigation component for dashboard pages as described in #248.

Changes

  • src/components/dashboard/Sidebar.tsx — Replaced commented-out stub with a fully working sidebar:
    • Desktop: sticky <aside> that collapses to w-14 (icon-only) or expands to w-64
    • Mobile: fixed slide-in drawer with backdrop overlay, closes on nav or overlay click
    • Active route highlighted via usePathname() with aria-current="page"
  • src/app/dashboard/page.tsx — Wired <Sidebar> into the dashboard layout with a mobile hamburger menu button (lg:hidden)
  • src/components/dashboard/__tests__/Sidebar.test.tsx — Unit tests covering render, collapse toggle, mobile open/close, and active link highlighting

Acceptance Criteria

  • Sidebar works on all screen sizes (mobile drawer + desktop sticky)
  • Navigation links function correctly
  • Active route is highlighted

Closes #248

- Add mobile drawer with overlay and desktop sticky sidebar
- Support expand/collapse toggle (w-14 collapsed, w-64 expanded)
- Highlight active route using usePathname()
- Wire Sidebar into dashboard page with mobile menu button

Closes MettaChain#248
@drips-wave
Copy link
Copy Markdown

drips-wave Bot commented May 30, 2026

@DevSolex Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Frontend Issue: Implement Responsive Sidebar Navigation

1 participant