feat: implement dashboard sorting, view preferences, and persistence

[ajetunmobiabdulsamad]

Overview

This PR implements comprehensive sorting and view preference controls for the Dashboard, allowing users to order snippets by time or alphabetically and toggle between grid and list layouts. Preferences are persisted in local storage to ensure a consistent experience across sessions, with full responsive design and accessibility support.

Related Issue

Closes #ajetunmobiabdulsamad

Changes

📊 Dashboard Sorting & View Preferences

• [ADD] app/globals.css

  • Added utility classes and transitions for grid/list view switching and active state indicators.

• [MODIFY] app/dashboard/page.tsx

  • Integrated sorting logic (Newest, Oldest, Recently Updated, Alphabetical).
  • Implemented grid/list view toggle with smooth transitions.
  • Added local storage persistence for sort order and view layout.
  • Ensured responsive behavior for mobile and desktop breakpoints.

• [ADD] components/ui/dropdown-menu.tsx

  • Enhanced dropdown component to support sorting options with active state highlighting.

• [MODIFY] components/ui/button.tsx

  • Updated button styles to support view toggle icons and accessible keyboard navigation.

• [MODIFY] components/SnippetCardContextMenu.tsx

  • Adjusted context menu positioning and z-index to ensure compatibility with new grid/list layouts.

Verification Results

Manual Testing:
✅ Sorting: Items reorder correctly for all 4 criteria (Newest, Oldest, Updated, Alpha).
✅ View Toggle: Grid and List views render consistently without layout shifts.
✅ Persistence: Preferences (Sort + View) survive page refresh and navigation.
✅ Responsive: Layout adapts correctly on mobile (<768px) and desktop.
✅ Accessibility: Controls are keyboard navigable and screen-reader friendly.
✅ Edge Case: Empty dashboard displays correctly in both views.

Acceptance Criteria	Status
Sorting works correctly	✅ Items reorder according to selected criteria
View toggle works	✅ Grid and list views render consistently
Preferences persist	✅ User’s chosen sort and view remain after refresh
Responsive layout	✅ Grid and list views adapt to different screen sizes
No duplicate states	✅ Switching views/sorts does not break UI
Accessible controls	✅ Keyboard and screen-reader friendly

Closes #189

[vercel]

@ajetunmobiabdulsamad is attempting to deploy a commit to the Sudipta 's projects Team on Vercel.

A member of the Team first needs to authorize it.