Add playlist and favorites commands, update sidebar

Backend:
- Add playlist.rs commands: get_user_playlists, get_playlist, search_playlists
- Add favorites.rs commands: get_favorites, add_favorite, remove_favorite
- Add API client methods: search_playlists, add_favorite, remove_favorite

Frontend:
- Remove Radio and New from sidebar (no API support)
- Sidebar now loads and displays user playlists dynamically
- Add playlist and favorites views (placeholder for now)
- Pass selectedPlaylistId and onPlaylistSelect to Sidebar
This commit is contained in:
vicrodh committed 2026-01-09 10:49:43 -06:00
1 parent dd2600feaa
commit bda4ea5b76
7 files changed
+276 -50

No files matched your search

+62
View File
@@ -424,6 +424,68 @@ impl QobuzClient {
Ok(serde_json::from_value(playlists.clone())?) Ok(serde_json::from_value(playlists.clone())?)
} }
/// Search playlists
pub async fn search_playlists(&self, query: &str, limit: u32) -> Result<SearchResultsPage<Playlist>> {
let url = endpoints::build_url(paths::PLAYLIST_SEARCH);
let response: Value = self
.http
.get(&url)
.header("X-App-Id", self.app_id().await?)
.query(&[("query", query), ("limit", &limit.to_string())])
.send()
.await?
.json()
.await?;
let playlists = response
.get("playlists")
.ok_or_else(|| ApiError::ApiResponse("No playlists in response".to_string()))?;
Ok(serde_json::from_value(playlists.clone())?)
}
/// Add item to favorites
pub async fn add_favorite(&self, fav_type: &str, item_id: &str) -> Result<()> {
let url = endpoints::build_url(paths::FAVORITE_CREATE);
let type_key = format!("{}_ids", fav_type); // album_ids, track_ids, artist_ids
let response = self
.http
.get(&url)
.header("X-App-Id", self.app_id().await?)
.header("X-User-Auth-Token", self.auth_token().await?)
.query(&[(&type_key, item_id)])
.send()
.await?;
if response.status().is_success() {
Ok(())
} else {
Err(ApiError::ApiResponse(format!("Failed to add favorite: {}", response.status())))
}
}
/// Remove item from favorites
pub async fn remove_favorite(&self, fav_type: &str, item_id: &str) -> Result<()> {
let url = endpoints::build_url(paths::FAVORITE_DELETE);
let type_key = format!("{}_ids", fav_type);
let response = self
.http
.get(&url)
.header("X-App-Id", self.app_id().await?)
.header("X-User-Auth-Token", self.auth_token().await?)
.query(&[(&type_key, item_id)])
.send()
.await?;
if response.status().is_success() {
Ok(())
} else {
Err(ApiError::ApiResponse(format!("Failed to remove favorite: {}", response.status())))
}
}
} }
impl Default for QobuzClient { impl Default for QobuzClient {
+59
View File
@@ -0,0 +1,59 @@
//! Favorites-related Tauri commands
use serde_json::Value;
use tauri::State;
use tokio::sync::Mutex;
use crate::api::client::QobuzClient;
/// Get user's favorites
/// fav_type can be: "albums", "tracks", or "artists"
#[tauri::command]
pub async fn get_favorites(
fav_type: String,
limit: Option<u32>,
offset: Option<u32>,
client: State<'_, std::sync::Arc<Mutex<QobuzClient>>>,
) -> Result<Value, String> {
log::info!("Command: get_favorites type={} limit={:?} offset={:?}", fav_type, limit, offset);
let client = client.lock().await;
client
.get_favorites(&fav_type, limit.unwrap_or(50), offset.unwrap_or(0))
.await
.map_err(|e| format!("Failed to get favorites: {}", e))
}
/// Add item to favorites
/// fav_type can be: "album", "track", or "artist"
#[tauri::command]
pub async fn add_favorite(
fav_type: String,
item_id: String,
client: State<'_, std::sync::Arc<Mutex<QobuzClient>>>,
) -> Result<(), String> {
log::info!("Command: add_favorite type={} id={}", fav_type, item_id);
let client = client.lock().await;
client
.add_favorite(&fav_type, &item_id)
.await
.map_err(|e| format!("Failed to add favorite: {}", e))
}
/// Remove item from favorites
/// fav_type can be: "album", "track", or "artist"
#[tauri::command]
pub async fn remove_favorite(
fav_type: String,
item_id: String,
client: State<'_, std::sync::Arc<Mutex<QobuzClient>>>,
) -> Result<(), String> {
log::info!("Command: remove_favorite type={} id={}", fav_type, item_id);
let client = client.lock().await;
client
.remove_favorite(&fav_type, &item_id)
.await
.map_err(|e| format!("Failed to remove favorite: {}", e))
}
+4
View File
@@ -3,11 +3,15 @@
//! Exposes backend functionality to the frontend via IPC //! Exposes backend functionality to the frontend via IPC
pub mod auth; pub mod auth;
pub mod favorites;
pub mod playback; pub mod playback;
pub mod playlist;
pub mod queue; pub mod queue;
pub mod search; pub mod search;
pub use auth::*; pub use auth::*;
pub use favorites::*;
pub use playback::*; pub use playback::*;
pub use playlist::*;
pub use queue::*; pub use queue::*;
pub use search::*; pub use search::*;
+52
View File
@@ -0,0 +1,52 @@
//! Playlist-related Tauri commands
use tauri::State;
use tokio::sync::Mutex;
use crate::api::client::QobuzClient;
use crate::api::models::{Playlist, SearchResultsPage};
/// Get user's playlists
#[tauri::command]
pub async fn get_user_playlists(
client: State<'_, std::sync::Arc<Mutex<QobuzClient>>>,
) -> Result<Vec<Playlist>, String> {
log::info!("Command: get_user_playlists");
let client = client.lock().await;
client
.get_user_playlists()
.await
.map_err(|e| format!("Failed to get user playlists: {}", e))
}
/// Get a specific playlist by ID
#[tauri::command]
pub async fn get_playlist(
playlist_id: u64,
client: State<'_, std::sync::Arc<Mutex<QobuzClient>>>,
) -> Result<Playlist, String> {
log::info!("Command: get_playlist {}", playlist_id);
let client = client.lock().await;
client
.get_playlist(playlist_id)
.await
.map_err(|e| format!("Failed to get playlist: {}", e))
}
/// Search playlists
#[tauri::command]
pub async fn search_playlists(
query: String,
limit: Option<u32>,
client: State<'_, std::sync::Arc<Mutex<QobuzClient>>>,
) -> Result<SearchResultsPage<Playlist>, String> {
log::info!("Command: search_playlists \"{}\"", query);
let client = client.lock().await;
client
.search_playlists(&query, limit.unwrap_or(20))
.await
.map_err(|e| format!("Failed to search playlists: {}", e))
}
+8
View File
@@ -116,6 +116,14 @@ pub fn run() {
commands::set_repeat, commands::set_repeat,
commands::get_repeat, commands::get_repeat,
commands::get_queue_state, commands::get_queue_state,
// Playlist commands
commands::get_user_playlists,
commands::get_playlist,
commands::search_playlists,
// Favorites commands
commands::get_favorites,
commands::add_favorite,
commands::remove_favorite,
]) ])
.run(tauri::generate_context!()) .run(tauri::generate_context!())
.expect("error while running tauri application"); .expect("error while running tauri application");
+67 -49
View File
@@ -1,24 +1,65 @@
<script lang="ts"> <script lang="ts">
import { Search, Home, Radio, Clock, Music, Disc3, Mic2, Plus, MoreVertical, ChevronDown, Heart } from 'lucide-svelte'; import { Search, Home, Clock, Music, Disc3, Mic2, Plus, MoreVertical, ChevronDown, Heart, ListMusic } from 'lucide-svelte';
import { invoke } from '@tauri-apps/api/core';
import { onMount } from 'svelte';
import NavigationItem from './NavigationItem.svelte'; import NavigationItem from './NavigationItem.svelte';
import UserCard from './UserCard.svelte'; import UserCard from './UserCard.svelte';
interface Playlist {
id: number;
name: string;
tracks_count: number;
}
interface Props { interface Props {
activeView: string; activeView: string;
selectedPlaylistId?: number | null;
onNavigate: (view: string) => void; onNavigate: (view: string) => void;
onPlaylistSelect?: (playlistId: number) => void;
onSettingsClick?: () => void; onSettingsClick?: () => void;
onLogout?: () => void; onLogout?: () => void;
userName?: string; userName?: string;
subscription?: string; subscription?: string;
} }
let { activeView, onNavigate, onSettingsClick, onLogout, userName = 'User', subscription = 'Qobuz' }: Props = $props(); let {
activeView,
selectedPlaylistId = null,
onNavigate,
onPlaylistSelect,
onSettingsClick,
onLogout,
userName = 'User',
subscription = 'Qobuz'
}: Props = $props();
let userPlaylists = $state<Playlist[]>([]);
let playlistsLoading = $state(false);
onMount(() => {
loadUserPlaylists();
});
async function loadUserPlaylists() {
playlistsLoading = true;
try {
const playlists = await invoke<Playlist[]>('get_user_playlists');
userPlaylists = playlists;
} catch (err) {
console.error('Failed to load playlists:', err);
} finally {
playlistsLoading = false;
}
}
function handleViewChange(view: string) { function handleViewChange(view: string) {
console.log('Sidebar: handleViewChange called with view:', view);
console.log('Sidebar: onNavigate function exists:', !!onNavigate);
onNavigate(view); onNavigate(view);
console.log('Sidebar: onNavigate called'); }
function handlePlaylistClick(playlist: Playlist) {
if (onPlaylistSelect) {
onPlaylistSelect(playlist.id);
}
} }
</script> </script>
@@ -47,20 +88,6 @@
> >
{#snippet icon()}<Home size={18} />{/snippet} {#snippet icon()}<Home size={18} />{/snippet}
</NavigationItem> </NavigationItem>
<NavigationItem
label="New"
active={activeView === 'new'}
onclick={() => handleViewChange('new')}
>
{#snippet icon()}<Radio size={18} />{/snippet}
</NavigationItem>
<NavigationItem
label="Radio"
active={activeView === 'radio'}
onclick={() => handleViewChange('radio')}
>
{#snippet icon()}<Radio size={18} />{/snippet}
</NavigationItem>
</nav> </nav>
<!-- Library Section --> <!-- Library Section -->
@@ -101,20 +128,12 @@
<div class="playlists-header"> <div class="playlists-header">
<div class="section-header">Playlists</div> <div class="section-header">Playlists</div>
<div class="header-actions"> <div class="header-actions">
<button class="icon-btn"> <button class="icon-btn" onclick={loadUserPlaylists} title="Refresh playlists">
<MoreVertical size={14} /> <MoreVertical size={14} />
</button> </button>
<button class="icon-btn">
<ChevronDown size={14} />
</button>
</div> </div>
</div> </div>
<button class="create-btn">
<Plus size={18} />
<span>Create New...</span>
</button>
<NavigationItem <NavigationItem
label="Favorites" label="Favorites"
active={activeView === 'favorites'} active={activeView === 'favorites'}
@@ -122,6 +141,22 @@
> >
{#snippet icon()}<Heart size={18} />{/snippet} {#snippet icon()}<Heart size={18} />{/snippet}
</NavigationItem> </NavigationItem>
{#if playlistsLoading}
<div class="playlists-loading">Loading...</div>
{:else if userPlaylists.length > 0}
{#each userPlaylists as playlist (playlist.id)}
<NavigationItem
label={playlist.name}
active={activeView === 'playlist' && selectedPlaylistId === playlist.id}
onclick={() => handlePlaylistClick(playlist)}
>
{#snippet icon()}<ListMusic size={18} />{/snippet}
</NavigationItem>
{/each}
{:else}
<div class="no-playlists">No playlists yet</div>
{/if}
</div> </div>
</div> </div>
@@ -246,28 +281,11 @@
color: var(--text-primary); color: var(--text-primary);
} }
.create-btn { .playlists-loading,
width: 100%; .no-playlists {
height: 36px; font-size: 13px;
display: flex;
align-items: center;
gap: 8px;
padding: 0 12px;
border-radius: 8px;
border: none;
background: transparent;
color: var(--text-muted); color: var(--text-muted);
cursor: pointer; padding: 8px 12px;
transition: background-color 150ms ease;
}
.create-btn:hover {
background-color: var(--bg-hover);
}
.create-btn span {
font-size: 14px;
font-weight: 400;
} }
.user-section { .user-section {
+24 -1
View File
@@ -119,10 +119,11 @@
let userInfo = $state<{ userName: string; subscription: string } | null>(null); let userInfo = $state<{ userName: string; subscription: string } | null>(null);
// View State // View State
type ViewType = 'home' | 'search' | 'library' | 'settings' | 'album'; type ViewType = 'home' | 'search' | 'library' | 'settings' | 'album' | 'playlist' | 'favorites';
let activeView = $state<ViewType>('home'); let activeView = $state<ViewType>('home');
let viewHistory = $state<ViewType[]>(['home']); let viewHistory = $state<ViewType[]>(['home']);
let selectedAlbum = $state<AlbumDetail | null>(null); let selectedAlbum = $state<AlbumDetail | null>(null);
let selectedPlaylistId = $state<number | null>(null);
// Overlay States // Overlay States
let isQueueOpen = $state(false); let isQueueOpen = $state(false);
@@ -166,9 +167,17 @@
if (activeView !== 'album') { if (activeView !== 'album') {
selectedAlbum = null; selectedAlbum = null;
} }
if (activeView !== 'playlist') {
selectedPlaylistId = null;
}
} }
} }
function handlePlaylistSelect(playlistId: number) {
selectedPlaylistId = playlistId;
navigateTo('playlist');
}
async function handleAlbumClick(albumId: string) { async function handleAlbumClick(albumId: string) {
try { try {
showToast('Loading album...', 'info'); showToast('Loading album...', 'info');
@@ -760,7 +769,9 @@
<!-- Sidebar --> <!-- Sidebar -->
<Sidebar <Sidebar
{activeView} {activeView}
{selectedPlaylistId}
onNavigate={navigateTo} onNavigate={navigateTo}
onPlaylistSelect={handlePlaylistSelect}
onSettingsClick={() => navigateTo('settings')} onSettingsClick={() => navigateTo('settings')}
onLogout={handleLogout} onLogout={handleLogout}
userName={userInfo?.userName || 'User'} userName={userInfo?.userName || 'User'}
@@ -794,6 +805,18 @@
<h1>Library</h1> <h1>Library</h1>
<p>Your library will appear here...</p> <p>Your library will appear here...</p>
</div> </div>
{:else if activeView === 'playlist' && selectedPlaylistId}
<div class="placeholder-view">
<h1>Playlist</h1>
<p>Playlist view coming soon... (ID: {selectedPlaylistId})</p>
<button class="back-btn" onclick={goBack}>Go Back</button>
</div>
{:else if activeView === 'favorites'}
<div class="placeholder-view">
<h1>Favorites</h1>
<p>Your favorite tracks and albums will appear here...</p>
<button class="back-btn" onclick={goBack}>Go Back</button>
</div>
{/if} {/if}
</main> </main>