feat: auth & admin

src/store/slices/queue.ts

@@ -1,6 +1,12 @@
 import { createSlice, type PayloadAction } from '@reduxjs/toolkit';
 
-type QueueSource = 'manual' | 'album' | 'playlist' | 'artist' | 'search';
+type QueueSource =
+  | 'manual'
+  | 'album'
+  | 'playlist'
+  | 'artist'
+  | 'search'
+  | 'radio';
 
 interface QueueEntry {
   trackId: string;
@@ -19,19 +25,63 @@ interface QueueState {
   sourceName: string | null;
 }
 
+// STUB demo queue — purely client-side display data so the player bar and
+// queue drawer render with content before the backend exists. Delete this
+// block (reset entries/currentIndex/source to the empty values) once real
+// playback wires tracks into the queue.
+const DEMO_QUEUE: QueueEntry[] = [
+  {
+    trackId: 'd1',
+    title: 'Quiet Storage',
+    artistName: 'Cyan Atlas',
+    albumTitle: 'Night Index',
+    durationMs: 312_000,
+  },
+  {
+    trackId: 'd2',
+    title: 'Magnetic North',
+    artistName: 'Tidal Bloom',
+    albumTitle: 'Ferric Coast',
+    durationMs: 243_000,
+  },
+  {
+    trackId: 'd3',
+    title: 'Ambergris',
+    artistName: 'Møller',
+    albumTitle: 'Warm Static',
+    durationMs: 201_000,
+  },
+  {
+    trackId: 'd4',
+    title: 'Slow Carrier',
+    artistName: 'Tidal Bloom',
+    albumTitle: 'Ferric Coast',
+    durationMs: 301_000,
+  },
+];
+
 const initialState: QueueState = {
-  entries: [],
-  currentIndex: -1,
-  source: 'manual',
+  entries: DEMO_QUEUE,
+  currentIndex: 0,
+  source: 'radio',
   sourceId: null,
-  sourceName: null,
+  sourceName: 'My radio',
 };
 
 export const queueSlice = createSlice({
   name: 'queue',
   initialState,
   reducers: {
-    setQueue(state, action: PayloadAction<{ entries: QueueEntry[]; startIndex?: number; source: QueueSource; sourceId?: string; sourceName?: string }>) {
+    setQueue(
+      state,
+      action: PayloadAction<{
+        entries: QueueEntry[];
+        startIndex?: number;
+        source: QueueSource;
+        sourceId?: string;
+        sourceName?: string;
+      }>,
+    ) {
       state.entries = action.payload.entries;
       state.currentIndex = action.payload.startIndex ?? 0;
       state.source = action.payload.source;
@@ -53,8 +103,10 @@ export const queueSlice = createSlice({
       const [entry] = state.entries.splice(from, 1);
       state.entries.splice(to, 0, entry);
       if (state.currentIndex === from) state.currentIndex = to;
-      else if (from < state.currentIndex && to >= state.currentIndex) state.currentIndex--;
-      else if (from > state.currentIndex && to <= state.currentIndex) state.currentIndex++;
+      else if (from < state.currentIndex && to >= state.currentIndex)
+        state.currentIndex--;
+      else if (from > state.currentIndex && to <= state.currentIndex)
+        state.currentIndex++;
     },
     goToIndex(state, action: PayloadAction<number>) {
       state.currentIndex = action.payload;
@@ -73,7 +125,14 @@ export const queueSlice = createSlice({
 });
 
 export const {
-  setQueue, addToQueue, addNextInQueue, removeFromQueue,
-  moveInQueue, goToIndex, nextTrack, prevTrack, clearQueue,
+  setQueue,
+  addToQueue,
+  addNextInQueue,
+  removeFromQueue,
+  moveInQueue,
+  goToIndex,
+  nextTrack,
+  prevTrack,
+  clearQueue,
 } = queueSlice.actions;
 export default queueSlice.reducer;