added new feature

[hey-Zayn]

Summary by CodeRabbit

Release Notes

• New Features

  • User playlists: create, manage, and reorder songs with drag-and-drop functionality
  • Edit and delete your personal albums and songs
  • Add songs to playlists from any page
  • Dashboard for managing your music library and viewing personal statistics
  • Increased file upload limit to 50MB

• Updates

  • Admin Dashboard renamed to Dashboard
  • Personal music library filtering and management

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
music-app	Ready	Preview, Comment	Mar 26, 2026 2:40am
music-app-9r1o	Error		Mar 26, 2026 2:40am

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: f09a0363-ff34-47bb-8b57-012bf6774af6

📥 Commits

Reviewing files that changed from the base of the PR and between c3688e5 and 23c2221.

⛔ Files ignored due to path filters (1)

• frontend/package-lock.json is excluded by !**/package-lock.json

📒 Files selected for processing (41)

• backend/src/controllers/album.controller.js
• backend/src/controllers/playlist.controller.js
• backend/src/controllers/song.controller.js
• backend/src/controllers/stats.controller.js
• backend/src/index.js
• backend/src/models/album.model.js
• backend/src/models/playlist.model.js
• backend/src/models/song.model.js
• backend/src/routes/admin.route.js
• backend/src/routes/album.route.js
• backend/src/routes/playlist.route.js
• backend/src/routes/songs.route.js
• backend/src/routes/stats.route.js
• frontend/package.json
• frontend/src/App.tsx
• frontend/src/Providers/AuthProvider.tsx
• frontend/src/components/layout/components/CreatePlaylistDialog.tsx
• frontend/src/components/layout/components/LeftSidebar.jsx
• frontend/src/components/layout/components/TopHeader.jsx
• frontend/src/components/playlist/AddToPlaylistDialog.tsx
• frontend/src/components/playlist/SortableSongItem.tsx
• frontend/src/components/ui/Topbar.jsx
• frontend/src/lib/utils.ts
• frontend/src/pages/admin/AdminPage.tsx
• frontend/src/pages/admin/components/AddAlbumDialog.tsx
• frontend/src/pages/admin/components/AddSongDialog.tsx
• frontend/src/pages/admin/components/AlbumsTabContent.tsx
• frontend/src/pages/admin/components/AlbumsTable.tsx
• frontend/src/pages/admin/components/DashboardStats.tsx
• frontend/src/pages/admin/components/EditAlbumDialog.tsx
• frontend/src/pages/admin/components/EditSongDialog.tsx
• frontend/src/pages/admin/components/NoContent.tsx
• frontend/src/pages/admin/components/SongsTabContent.tsx
• frontend/src/pages/admin/components/SongsTable.tsx
• frontend/src/pages/album/AlbumPage.tsx
• frontend/src/pages/home/components/FeaturedSection.jsx
• frontend/src/pages/home/components/SectionGrid.tsx
• frontend/src/pages/playlists/PlaylistPage.tsx
• frontend/src/store/useMusicStore.tsx
• frontend/src/store/usePlaylistStore.tsx
• plan/development-plan.md

---

📝 Walkthrough

Walkthrough

This pull request adds playlist functionality as a core feature, introduces user-scoped content creation with Clerk ID attribution, implements full CRUD operations for songs and albums with Cloudinary media management, and replaces admin-only gating with authenticated-user creation flows while supporting drag-and-drop playlist song reordering.

Changes

Cohort / File(s)	Summary
Backend Models backend/src/models/album.model.js, backend/src/models/song.model.js, backend/src/models/playlist.model.js	Added optional creator field (Clerk ID) to Album and Song schemas; introduced new Playlist model with name, description, imageUrl, creator, and songs array references with timestamps.
Album Controller backend/src/controllers/album.controller.js	Added Cloudinary integration helpers; implemented createAlbum (validates file/title/artist, uploads to Cloudinary, stores with creator); updateAlbum (replaces image if provided); deleteAlbum (removes Cloudinary assets, enforces creator/admin auth); extended AllAlbums with optional creator-scoped filtering via req.query.user.
Song Controller backend/src/controllers/song.controller.js	Added Cloudinary helpers and createSong (validates audio/image, uploads, stores with creator); updateSong (image replacement); deleteSong (removes from Album, deletes Cloudinary assets, creator/admin-only); enhanced getAllSongs with user=true filtering; updated aggregation pipeline for creator-scoped unique artist counts.
Playlist Controller backend/src/controllers/playlist.controller.js	New controller implementing full CRUD: create/read/update/delete playlists; add/remove songs; enforces creator authorization; returns appropriate HTTP statuses; populates song references.
Routes & Authorization backend/src/routes/album.route.js, backend/src/routes/songs.route.js, backend/src/routes/playlist.route.js, backend/src/routes/admin.route.js, backend/src/routes/stats.route.js	Created new playlist.route.js with protectRoute on all endpoints; removed requireAdmin from song/album creation; added POST/PUT/DELETE mutation routes; removed admin-gated creation from admin.route.js; removed requireAdmin from stats endpoint.
Backend Configuration backend/src/index.js, backend/src/controllers/stats.controller.js	Increased file upload limit from 10MB to 50MB; registered /api/playlists route; added creator-scoped filtering to stats (songs, albums, artists) via ?user=true; renamed totalAlbum to totalAlbums and added uniqueArtists count.
Frontend Playlist Store frontend/src/store/usePlaylistStore.tsx	New Zustand store with state (playlists, currentPlaylist, isLoading, error) and actions: fetchPlaylists, fetchPlaylistById, createPlaylist, updatePlaylist, deletePlaylist, addSongToPlaylist, removeSongFromPlaylist, reorderSongs (optimistic update with rollback).
Frontend Music Store frontend/src/store/useMusicStore.tsx	Updated fetchAlbums, fetchSongs, fetchStats to accept optional userOnly parameter and append ?user=true query; changed deletion endpoints from /admin/* to direct paths; added updateSong and updateAlbum with PUT requests and multipart/form-data handling.
Frontend Playlist Components frontend/src/components/layout/components/CreatePlaylistDialog.tsx, frontend/src/components/playlist/AddToPlaylistDialog.tsx, frontend/src/components/playlist/SortableSongItem.tsx	New dialog for creating playlists; dialog for adding songs to existing playlists; sortable song item using @dnd-kit/sortable with drag handles, play/pause, and removal controls.
Frontend Editor Dialogs frontend/src/pages/admin/components/EditAlbumDialog.tsx, frontend/src/pages/admin/components/EditSongDialog.tsx	New album editor with title/artist/releaseYear/cover-image fields; new song editor with title/artist/duration/album/artwork with ID3 metadata auto-fill and upload progress tracking.
Frontend Playlist Page frontend/src/pages/playlists/PlaylistPage.tsx	New page with playlist header, metadata, play/delete actions, drag-and-drop song reordering via @dnd-kit (DndContext, SortableContext, PointerSensor), and empty-state messaging.
Frontend Layout & Navigation frontend/src/components/layout/components/LeftSidebar.jsx, frontend/src/components/layout/components/TopHeader.jsx, frontend/src/components/ui/Topbar.jsx, frontend/src/App.tsx	Updated sidebar to fetch and display playlists with CreatePlaylistDialog; added /playlists/:id route; changed /admin to /dashboard; removed admin role gating (isAdmin), replaced with SignedIn wrapper; updated auth flow with Axios request interceptor for token refresh.
Frontend Admin Pages & Tables frontend/src/pages/admin/...*	Added album/song edit/delete actions; introduced NoContent empty state component; updated AddSongDialog with ID3 metadata extraction, audio duration detection, and album-required validation; restructured stats display as user-scoped with "Your" labels; changed loading/empty-state handling.
Frontend Song/Album Display frontend/src/pages/album/AlbumPage.tsx, frontend/src/pages/home/components/FeaturedSection.jsx, frontend/src/pages/home/components/SectionGrid.tsx	Integrated AddToPlaylistDialog per-song controls; added theme-based album gradient styling; updated grid layouts to accommodate new action buttons.
Dependencies & Utilities frontend/package.json, frontend/src/lib/utils.ts, frontend/src/Providers/AuthProvider.tsx	Added @dnd-kit/core, @dnd-kit/sortable, @dnd-kit/utilities for drag-and-drop; added formatDuration utility; refactored auth provider to use Axios request interceptor instead of single token fetch; removed checkAdminStatus logic.
Documentation plan/development-plan.md	Comprehensive development roadmap with completed features, known limitations, prioritized task phases (high/medium priority, quick wins), scaling architecture for 1000\+ users, chat enhancements, production readiness checklist, and interview talking points.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~65 minutes

---

Poem

🐰 Hopping through playlists with creative delight,
Cloudinary clouds store our music just right,
Drag-and-drop magic makes reordering fun,
Creator fields flourish—no admins, just one!
User-scoped features, authorization done bright! 🎵

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch Live-0

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}