mirror of
https://github.com/Psychotoxical/psysonic.git
synced 2026-07-21 23:05:46 +00:00
fix(playback): pin queue playback to source server when browsing another library (#717)
* fix(playback): pin queue streams, cover art, and library links to queue server When the active server changes while a queue from another server is playing, keep streams and UI on queueServerId; switch back for artist/album links and queue or player-bar context menus. * fix(playback): switch to queue server when opening Now Playing Ensure active server matches queueServerId before Subsonic fetches on the Now Playing page, mobile player route, and queue info panel; scope caches by server id. * docs(credits): mention Now Playing in PR #717 contribution line * fix(playback): route scrobble and queue sync to queue server Address PR review: apiForServer for scrobble/now-playing/savePlayQueue, clear queueServerId on server removal, mini-player queueServerId sync, block cross-server enqueue with toast, and regression tests.
This commit is contained in:
@@ -488,6 +488,16 @@ Foundational work: faster reviews, narrower diffs, and a safety net under the pa
|
||||
* Album detail **header** shows **multiple album artists** when the server sends OpenSubsonic **`albumArtists`** on the album or on child songs — each name links to its artist page instead of only the first id (issue [#552](https://github.com/Psychotoxical/psysonic/issues/552)).
|
||||
* **Player bar**, **mobile now playing**, and **mini player** copy **`artists`** through **`songToTrack`** so multi-performer tracks get **per-artist** links like the album tracklist column.
|
||||
|
||||
### Multi-server — queue playback stays on the source server when browsing another library
|
||||
|
||||
**By [@cucadmuh](https://github.com/cucadmuh), PR [#717](https://github.com/Psychotoxical/psysonic/pull/717)**
|
||||
|
||||
* With a non-empty queue from server **A**, switching the active server to **B** no longer breaks playback: streams, hot-cache prefetch, seek/resume, and MPRIS cover art use **`queueServerId`** (persisted with the queue).
|
||||
* **Cover art** in the queue panel, player bar, mini/fullscreen/mobile players, and Now Playing loads from the queue server when it differs from the browsed server.
|
||||
* **Artist/album links** from the player, queue, Now Playing, and mini player switch back to the queue server before navigating; **queue** and **player-bar album** context menus pin API actions to that server as well.
|
||||
* Opening **Now Playing** (sidebar, mobile route, or queue info panel) switches to the queue server before Subsonic metadata loads, with per-server fetch caches so artist/album cards do not show the wrong library.
|
||||
* **Scrobble**, **now-playing report**, and **savePlayQueue** sync use the queue server as well; removing that server profile clears `queueServerId`; the mini-player bridge receives `queueServerId`; enqueue/play-next from another browsed server is blocked with a toast.
|
||||
|
||||
## [1.45.0] - 2026-05-04
|
||||
|
||||
## Added
|
||||
|
||||
@@ -2,6 +2,7 @@ import axios from 'axios';
|
||||
import md5 from 'md5';
|
||||
import { version } from '../../package.json';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import type { ServerProfile } from '../store/authStoreTypes';
|
||||
|
||||
export const SUBSONIC_CLIENT = `psysonic/${version}`;
|
||||
|
||||
@@ -51,6 +52,22 @@ export function getClient() {
|
||||
return { baseUrl: `${baseUrl}/rest`, params };
|
||||
}
|
||||
|
||||
export function getServerById(serverId: string): ServerProfile | undefined {
|
||||
return useAuthStore.getState().servers.find(s => s.id === serverId);
|
||||
}
|
||||
|
||||
/** Subsonic REST call against an explicit saved server (not necessarily the active one). */
|
||||
export async function apiForServer<T>(
|
||||
serverId: string,
|
||||
endpoint: string,
|
||||
extra: Record<string, unknown> = {},
|
||||
timeout = 15000,
|
||||
): Promise<T> {
|
||||
const server = getServerById(serverId);
|
||||
if (!server) throw new Error(`Unknown server: ${serverId}`);
|
||||
return apiWithCredentials(server.url, server.username, server.password, endpoint, extra, timeout);
|
||||
}
|
||||
|
||||
export async function api<T>(endpoint: string, extra: Record<string, unknown> = {}, timeout = 15000): Promise<T> {
|
||||
const { baseUrl, params } = getClient();
|
||||
const resp = await axios.get(`${baseUrl}/${endpoint}`, {
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { api } from './subsonicClient';
|
||||
import { api, apiForServer } from './subsonicClient';
|
||||
import type { SubsonicSong } from './subsonicTypes';
|
||||
|
||||
export async function getPlayQueue(): Promise<{ current?: string; position?: number; songs: SubsonicSong[] }> {
|
||||
@@ -11,10 +11,16 @@ export async function getPlayQueue(): Promise<{ current?: string; position?: num
|
||||
}
|
||||
}
|
||||
|
||||
export async function savePlayQueue(songIds: string[], current?: string, position?: number): Promise<void> {
|
||||
export async function savePlayQueue(
|
||||
songIds: string[],
|
||||
current: string | undefined,
|
||||
position: number | undefined,
|
||||
serverId: string,
|
||||
): Promise<void> {
|
||||
if (!serverId) return;
|
||||
const params: Record<string, unknown> = {};
|
||||
if (songIds.length > 0) params.id = songIds;
|
||||
if (current !== undefined) params.current = current;
|
||||
if (position !== undefined) params.position = position;
|
||||
await api('savePlayQueue.view', params);
|
||||
await apiForServer(serverId, 'savePlayQueue.view', params);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,41 @@
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import { usePlayerStore } from '../store/playerStore';
|
||||
import { scrobbleSong } from './subsonicScrobble';
|
||||
|
||||
const { apiForServerMock } = vi.hoisted(() => ({
|
||||
apiForServerMock: vi.fn(async () => ({})),
|
||||
}));
|
||||
|
||||
vi.mock('./subsonicClient', () => ({
|
||||
api: vi.fn(),
|
||||
apiForServer: apiForServerMock,
|
||||
}));
|
||||
|
||||
describe('subsonicScrobble', () => {
|
||||
beforeEach(() => {
|
||||
apiForServerMock.mockClear();
|
||||
useAuthStore.setState({
|
||||
servers: [
|
||||
{ id: 'a', name: 'A', url: 'http://a.test', username: 'u', password: 'p' },
|
||||
{ id: 'b', name: 'B', url: 'http://b.test', username: 'u', password: 'p' },
|
||||
],
|
||||
activeServerId: 'b',
|
||||
isLoggedIn: true,
|
||||
});
|
||||
usePlayerStore.setState({
|
||||
queue: [{ id: 't1', title: 'T', artist: 'A', album: 'Al', albumId: 'al1', duration: 100 }],
|
||||
queueServerId: 'a',
|
||||
queueIndex: 0,
|
||||
});
|
||||
});
|
||||
|
||||
it('scrobbleSong targets the queue server when active server differs', async () => {
|
||||
await scrobbleSong('t1', 1_700_000_000_000, 'a');
|
||||
expect(apiForServerMock).toHaveBeenCalledWith(
|
||||
'a',
|
||||
'scrobble.view',
|
||||
expect.objectContaining({ id: 't1', submission: true, time: 1_700_000_000_000 }),
|
||||
);
|
||||
});
|
||||
});
|
||||
@@ -1,17 +1,30 @@
|
||||
import { api } from './subsonicClient';
|
||||
import { api, apiForServer } from './subsonicClient';
|
||||
import type { SubsonicNowPlaying } from './subsonicTypes';
|
||||
|
||||
export async function scrobbleSong(id: string, time: number): Promise<void> {
|
||||
async function scrobbleOnServer(
|
||||
serverId: string,
|
||||
id: string,
|
||||
submission: boolean,
|
||||
time?: number,
|
||||
): Promise<void> {
|
||||
const params: Record<string, unknown> = { id, submission };
|
||||
if (time !== undefined) params.time = time;
|
||||
await apiForServer(serverId, 'scrobble.view', params);
|
||||
}
|
||||
|
||||
export async function scrobbleSong(id: string, time: number, serverId: string): Promise<void> {
|
||||
if (!serverId) return;
|
||||
try {
|
||||
await api('scrobble.view', { id, time, submission: true });
|
||||
await scrobbleOnServer(serverId, id, true, time);
|
||||
} catch {
|
||||
// best effort
|
||||
}
|
||||
}
|
||||
|
||||
export async function reportNowPlaying(id: string): Promise<void> {
|
||||
export async function reportNowPlaying(id: string, serverId: string): Promise<void> {
|
||||
if (!serverId) return;
|
||||
try {
|
||||
await api('scrobble.view', { id, submission: false });
|
||||
await scrobbleOnServer(serverId, id, false);
|
||||
} catch {
|
||||
// best effort
|
||||
}
|
||||
|
||||
@@ -17,18 +17,39 @@ function coverArtQueryParams(username: string, password: string, id: string, siz
|
||||
});
|
||||
}
|
||||
|
||||
function streamUrlFromProfile(
|
||||
serverUrl: string,
|
||||
username: string,
|
||||
password: string,
|
||||
id: string,
|
||||
): string {
|
||||
const baseUrl = restBaseFromUrl(serverUrl);
|
||||
const salt = secureRandomSalt();
|
||||
const token = md5(password + salt);
|
||||
const p = new URLSearchParams({
|
||||
id,
|
||||
u: username,
|
||||
t: token,
|
||||
s: salt,
|
||||
v: '1.16.1',
|
||||
c: SUBSONIC_CLIENT,
|
||||
f: 'json',
|
||||
});
|
||||
return `${baseUrl}/stream.view?${p.toString()}`;
|
||||
}
|
||||
|
||||
export function buildStreamUrlForServer(serverId: string, id: string): string {
|
||||
const server = useAuthStore.getState().servers.find(s => s.id === serverId);
|
||||
if (!server) return buildStreamUrl(id);
|
||||
return streamUrlFromProfile(server.url, server.username, server.password, id);
|
||||
}
|
||||
|
||||
export function buildStreamUrl(id: string): string {
|
||||
const { getBaseUrl, getActiveServer } = useAuthStore.getState();
|
||||
const server = getActiveServer();
|
||||
const baseUrl = getBaseUrl();
|
||||
const salt = secureRandomSalt();
|
||||
const token = md5((server?.password ?? '') + salt);
|
||||
const p = new URLSearchParams({
|
||||
id,
|
||||
u: server?.username ?? '',
|
||||
t: token, s: salt, v: '1.16.1', c: SUBSONIC_CLIENT, f: 'json',
|
||||
});
|
||||
return `${baseUrl}/rest/stream.view?${p.toString()}`;
|
||||
if (!server || !baseUrl) return streamUrlFromProfile('', '', '', id);
|
||||
return streamUrlFromProfile(server.url, server.username, server.password, id);
|
||||
}
|
||||
|
||||
/** Stable cache key for cover art — does not include ephemeral auth params. */
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import React, { Suspense, useCallback, useEffect, useState } from 'react';
|
||||
import { useLocation, useNavigate } from 'react-router-dom';
|
||||
import { ensurePlaybackServerActive } from '../utils/playback/playbackServer';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { PanelRight } from 'lucide-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
@@ -97,7 +98,10 @@ export function AppShell() {
|
||||
useEffect(() => {
|
||||
const onPsyNavigate = (e: Event) => {
|
||||
const detail = (e as CustomEvent).detail;
|
||||
if (detail?.to) navigate(detail.to);
|
||||
if (!detail?.to) return;
|
||||
void ensurePlaybackServerActive().then(ok => {
|
||||
if (ok) navigate(detail.to);
|
||||
});
|
||||
};
|
||||
window.addEventListener('psy:navigate', onPsyNavigate);
|
||||
return () => window.removeEventListener('psy:navigate', onPsyNavigate);
|
||||
|
||||
@@ -15,6 +15,8 @@ import {
|
||||
} from '../utils/componentHelpers/contextMenuActions';
|
||||
import { useContextMenuKeyboardNav } from '../hooks/useContextMenuKeyboardNav';
|
||||
import { useContextMenuRating } from '../hooks/useContextMenuRating';
|
||||
import { usePlaybackLibraryNavigate } from '../hooks/usePlaybackLibraryNavigate';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import ContextMenuItems from './contextMenu/ContextMenuItems';
|
||||
|
||||
export { AddToPlaylistSubmenu };
|
||||
@@ -22,6 +24,8 @@ export { AddToPlaylistSubmenu };
|
||||
|
||||
export default function ContextMenu() {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const navigatePlaybackLibrary = usePlaybackLibraryNavigate();
|
||||
const orbitRole = useOrbitStore(s => s.role);
|
||||
const { contextMenu, closeContextMenu, playTrack, enqueue, playNext, queue, currentTrack, removeTrack, lastfmLovedCache, setLastfmLovedForSong, starredOverrides, setStarredOverride, openSongInfo, userRatingOverrides, setUserRatingOverride } = usePlayerStore(
|
||||
useShallow(s => ({
|
||||
@@ -125,7 +129,18 @@ export default function ContextMenu() {
|
||||
}, [contextMenu.isOpen, closeContextMenu, cancelPlaylistSubmenuCloseTimer]);
|
||||
|
||||
|
||||
const { type, item, queueIndex, playlistId, playlistSongIndex, shareKindOverride } = contextMenu;
|
||||
const {
|
||||
type,
|
||||
item,
|
||||
queueIndex,
|
||||
playlistId,
|
||||
playlistSongIndex,
|
||||
shareKindOverride,
|
||||
pinToPlaybackServer = false,
|
||||
} = contextMenu;
|
||||
const navigateLibrary = pinToPlaybackServer
|
||||
? navigatePlaybackLibrary
|
||||
: (path: string) => { navigate(path); };
|
||||
|
||||
const isStarred = (id: string, itemStarred?: string) =>
|
||||
id in starredOverrides ? starredOverrides[id] : !!itemStarred;
|
||||
@@ -216,6 +231,8 @@ export default function ContextMenu() {
|
||||
downloadAlbum={downloadAlbum}
|
||||
copyShareLink={copyShareLink}
|
||||
isStarred={isStarred}
|
||||
pinToPlaybackServer={pinToPlaybackServer}
|
||||
navigateLibrary={navigateLibrary}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { star, unstar } from '../api/subsonicStarRating';
|
||||
import { buildCoverArtUrl, coverArtCacheKey } from '../api/subsonicStreamUrl';
|
||||
import { usePlaybackCoverArt } from '../hooks/usePlaybackCoverArt';
|
||||
import { playbackCoverArtForId } from '../utils/playback/playbackServer';
|
||||
import React, { useCallback, useEffect, useState, useRef, useMemo } from 'react';
|
||||
import {
|
||||
SkipBack, SkipForward,
|
||||
@@ -56,12 +57,13 @@ export default function FullscreenPlayer({ onClose }: FullscreenPlayerProps) {
|
||||
|
||||
const duration = currentTrack?.duration ?? 0;
|
||||
|
||||
// buildCoverArtUrl generates a new salt on every call — must be memoized.
|
||||
// 300px for the small art box; 500px for the right-side portrait fallback.
|
||||
const artUrl = useMemo(() => currentTrack?.coverArt ? buildCoverArtUrl(currentTrack.coverArt, 300) : '', [currentTrack?.coverArt]);
|
||||
const artKey = useMemo(() => currentTrack?.coverArt ? coverArtCacheKey(currentTrack.coverArt, 300) : '', [currentTrack?.coverArt]);
|
||||
const coverUrl = useMemo(() => currentTrack?.coverArt ? buildCoverArtUrl(currentTrack.coverArt, 500) : '', [currentTrack?.coverArt]);
|
||||
const coverKey = useMemo(() => currentTrack?.coverArt ? coverArtCacheKey(currentTrack.coverArt, 500) : '', [currentTrack?.coverArt]);
|
||||
const artCover = usePlaybackCoverArt(currentTrack?.coverArt, 300);
|
||||
const artUrl = artCover.src;
|
||||
const artKey = artCover.cacheKey;
|
||||
const portraitCover = usePlaybackCoverArt(currentTrack?.coverArt, 500);
|
||||
const coverUrl = portraitCover.src;
|
||||
const coverKey = portraitCover.cacheKey;
|
||||
// `false` = no fetchUrl fallback — prevents double crossfade (fetchUrl → blobUrl).
|
||||
const resolvedCoverUrl = useCachedUrl(coverUrl, coverKey, false);
|
||||
|
||||
@@ -86,12 +88,13 @@ export default function FullscreenPlayer({ onClose }: FullscreenPlayerProps) {
|
||||
const idx = s.queueIndex;
|
||||
return (idx >= 0 && idx + 1 < q.length) ? (q[idx + 1]?.coverArt ?? null) : null;
|
||||
});
|
||||
const queueServerId = usePlayerStore(s => s.queueServerId);
|
||||
const activeServerId = useAuthStore(s => s.activeServerId);
|
||||
useEffect(() => {
|
||||
if (!nextCoverArt) return;
|
||||
const url = buildCoverArtUrl(nextCoverArt, 300);
|
||||
const key = coverArtCacheKey(nextCoverArt, 300);
|
||||
const { src: url, cacheKey: key } = playbackCoverArtForId(nextCoverArt, 300);
|
||||
getCachedBlob(url, key).catch(() => {});
|
||||
}, [nextCoverArt]);
|
||||
}, [nextCoverArt, queueServerId, activeServerId]);
|
||||
|
||||
// Lyrics settings popover state
|
||||
const [lyricsMenuOpen, setLyricsMenuOpen] = useState(false);
|
||||
|
||||
@@ -1,8 +1,9 @@
|
||||
import { buildCoverArtUrl, coverArtCacheKey } from '../api/subsonicStreamUrl';
|
||||
import { usePlaybackCoverArt } from '../hooks/usePlaybackCoverArt';
|
||||
import { useEffect, useMemo, useRef, useState } from 'react';
|
||||
import { emit } from '@tauri-apps/api/event';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { usePlayerStore } from '../store/playerStore';
|
||||
import { registerQueueDragHitTest } from '../contexts/DragDropContext';
|
||||
import MiniContextMenu from './MiniContextMenu';
|
||||
import type { MiniSyncPayload, MiniControlAction, MiniTrackInfo } from '../utils/miniPlayerBridge';
|
||||
@@ -63,6 +64,7 @@ export default function MiniPlayer() {
|
||||
useMiniSync({
|
||||
onSync: (payload) => {
|
||||
setState(payload);
|
||||
usePlayerStore.setState({ queueServerId: payload.queueServerId ?? null });
|
||||
if (payload.track?.duration) setDuration(payload.track.duration);
|
||||
if (typeof payload.volume === 'number') setVolumeState(payload.volume);
|
||||
},
|
||||
@@ -138,14 +140,7 @@ export default function MiniPlayer() {
|
||||
}, [queueOpen, state.queueIndex]);
|
||||
|
||||
const { track, isPlaying } = state;
|
||||
const miniCoverSrc = useMemo(
|
||||
() => (track?.coverArt ? buildCoverArtUrl(track.coverArt, 300) : ''),
|
||||
[track?.coverArt],
|
||||
);
|
||||
const miniCoverKey = useMemo(
|
||||
() => (track?.coverArt ? coverArtCacheKey(track.coverArt, 300) : ''),
|
||||
[track?.coverArt],
|
||||
);
|
||||
const { src: miniCoverSrc, cacheKey: miniCoverKey } = usePlaybackCoverArt(track?.coverArt, 300);
|
||||
const progress = duration > 0 ? Math.min(100, (currentTime / duration) * 100) : 0;
|
||||
|
||||
return (
|
||||
|
||||
@@ -1,9 +1,11 @@
|
||||
import { star, unstar } from '../api/subsonicStarRating';
|
||||
import { buildCoverArtUrl, coverArtCacheKey } from '../api/subsonicStreamUrl';
|
||||
import { usePlaybackCoverArt } from '../hooks/usePlaybackCoverArt';
|
||||
import type { Track } from '../store/playerStoreTypes';
|
||||
import { getPlaybackProgressSnapshot, subscribePlaybackProgress } from '../store/playbackProgress';
|
||||
import React, { useState, useCallback, useMemo, useRef, useEffect, useSyncExternalStore, CSSProperties } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { usePlaybackLibraryNavigate } from '../hooks/usePlaybackLibraryNavigate';
|
||||
import { useEnsurePlaybackServerOnMount } from '../hooks/useEnsurePlaybackServerOnMount';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import {
|
||||
ChevronDown, Play, Pause, SkipBack, SkipForward,
|
||||
@@ -152,6 +154,8 @@ function LyricsDrawer({ onClose, currentTrack }: { onClose: () => void; currentT
|
||||
export default function MobilePlayerView() {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const navigatePlaybackLibrary = usePlaybackLibraryNavigate();
|
||||
useEnsurePlaybackServerOnMount();
|
||||
|
||||
// Lock body scroll while full-screen player is mounted
|
||||
useEffect(() => {
|
||||
@@ -185,12 +189,7 @@ export default function MobilePlayerView() {
|
||||
|
||||
const duration = currentTrack?.duration ?? 0;
|
||||
|
||||
// Cover art
|
||||
const coverFetchUrl = useMemo(
|
||||
() => currentTrack?.coverArt ? buildCoverArtUrl(currentTrack.coverArt, 800) : '',
|
||||
[currentTrack?.coverArt]
|
||||
);
|
||||
const coverKey = currentTrack?.coverArt ? coverArtCacheKey(currentTrack.coverArt, 800) : '';
|
||||
const { src: coverFetchUrl, cacheKey: coverKey } = usePlaybackCoverArt(currentTrack?.coverArt, 800);
|
||||
const resolvedCover = useCachedUrl(coverFetchUrl, coverKey);
|
||||
|
||||
// Dynamic background color extracted from cover art
|
||||
@@ -332,7 +331,7 @@ export default function MobilePlayerView() {
|
||||
<OpenArtistRefInline
|
||||
refs={currentTrack.artists}
|
||||
fallbackName={currentTrack.artist}
|
||||
onGoArtist={id => navigate(`/artist/${id}`)}
|
||||
onGoArtist={id => { void navigatePlaybackLibrary(`/artist/${id}`); }}
|
||||
as="none"
|
||||
linkTag="span"
|
||||
linkClassName="mp-artist-link"
|
||||
@@ -341,12 +340,12 @@ export default function MobilePlayerView() {
|
||||
<span
|
||||
role={currentTrack.artistId ? 'link' : undefined}
|
||||
tabIndex={currentTrack.artistId ? 0 : undefined}
|
||||
onClick={() => currentTrack.artistId && navigate(`/artist/${currentTrack.artistId}`)}
|
||||
onClick={() => currentTrack.artistId && void navigatePlaybackLibrary(`/artist/${currentTrack.artistId}`)}
|
||||
onKeyDown={e => {
|
||||
if (!currentTrack.artistId) return;
|
||||
if (e.key === 'Enter' || e.key === ' ') {
|
||||
e.preventDefault();
|
||||
navigate(`/artist/${currentTrack.artistId}`);
|
||||
void navigatePlaybackLibrary(`/artist/${currentTrack.artistId}`);
|
||||
}
|
||||
}}
|
||||
style={{ cursor: currentTrack.artistId ? 'pointer' : 'default' }}
|
||||
|
||||
@@ -7,6 +7,7 @@ import { Info } from 'lucide-react';
|
||||
import { open as shellOpen } from '@tauri-apps/plugin-shell';
|
||||
import { usePlayerStore } from '../store/playerStore';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import { useEnsurePlaybackServerOnMount } from '../hooks/useEnsurePlaybackServerOnMount';
|
||||
import { fetchBandsintownEvents, type BandsintownEvent } from '../api/bandsintown';
|
||||
import CachedImage from './CachedImage';
|
||||
import OverlayScrollArea from './OverlayScrollArea';
|
||||
@@ -72,21 +73,31 @@ function buildContributorRows(
|
||||
return out;
|
||||
}
|
||||
|
||||
function queuePanelCacheKey(serverId: string, id: string): string {
|
||||
return serverId ? `${serverId}:${id}` : id;
|
||||
}
|
||||
|
||||
export default function NowPlayingInfo() {
|
||||
const { t } = useTranslation();
|
||||
const currentTrack = usePlayerStore(s => s.currentTrack);
|
||||
const enableBandsintown = useAuthStore(s => s.enableBandsintown);
|
||||
const setEnableBandsintown = useAuthStore(s => s.setEnableBandsintown);
|
||||
const subsonicReady = useEnsurePlaybackServerOnMount();
|
||||
const subsonicServerId = useAuthStore(s => s.activeServerId ?? '');
|
||||
|
||||
const artistName = currentTrack?.artist || '';
|
||||
const artistId = currentTrack?.artistId || '';
|
||||
const songId = currentTrack?.id || '';
|
||||
|
||||
const [artistInfo, setArtistInfo] = useState<SubsonicArtistInfo | null>(
|
||||
artistId ? artistInfoCache.get(artistId) ?? null : null,
|
||||
artistId && subsonicServerId
|
||||
? artistInfoCache.get(queuePanelCacheKey(subsonicServerId, artistId)) ?? null
|
||||
: null,
|
||||
);
|
||||
const [songDetail, setSongDetail] = useState<SubsonicSong | null>(
|
||||
songId ? songDetailCache.get(songId) ?? null : null,
|
||||
songId && subsonicServerId
|
||||
? songDetailCache.get(queuePanelCacheKey(subsonicServerId, songId)) ?? null
|
||||
: null,
|
||||
);
|
||||
const [tourEvents, setTourEvents] = useState<BandsintownEvent[]>([]);
|
||||
const [tourLoading, setTourLoading] = useState(false);
|
||||
@@ -101,27 +112,29 @@ export default function NowPlayingInfo() {
|
||||
|
||||
// Artist bio + image
|
||||
useEffect(() => {
|
||||
if (!artistId) { setArtistInfo(null); return; }
|
||||
const cached = artistInfoCache.get(artistId);
|
||||
if (!subsonicReady || !subsonicServerId || !artistId) { setArtistInfo(null); return; }
|
||||
const cacheKey = queuePanelCacheKey(subsonicServerId, artistId);
|
||||
const cached = artistInfoCache.get(cacheKey);
|
||||
if (cached !== undefined) { setArtistInfo(cached); return; }
|
||||
let cancelled = false;
|
||||
getArtistInfo(artistId)
|
||||
.then(info => { if (!cancelled) { artistInfoCache.set(artistId, info ?? null); setArtistInfo(info ?? null); } })
|
||||
.catch(() => { if (!cancelled) { artistInfoCache.set(artistId, null); setArtistInfo(null); } });
|
||||
.then(info => { if (!cancelled) { artistInfoCache.set(cacheKey, info ?? null); setArtistInfo(info ?? null); } })
|
||||
.catch(() => { if (!cancelled) { artistInfoCache.set(cacheKey, null); setArtistInfo(null); } });
|
||||
return () => { cancelled = true; };
|
||||
}, [artistId]);
|
||||
}, [subsonicReady, subsonicServerId, artistId]);
|
||||
|
||||
// Song detail (for OpenSubsonic contributors[])
|
||||
useEffect(() => {
|
||||
if (!songId) { setSongDetail(null); return; }
|
||||
const cached = songDetailCache.get(songId);
|
||||
if (!subsonicReady || !subsonicServerId || !songId) { setSongDetail(null); return; }
|
||||
const cacheKey = queuePanelCacheKey(subsonicServerId, songId);
|
||||
const cached = songDetailCache.get(cacheKey);
|
||||
if (cached !== undefined) { setSongDetail(cached); return; }
|
||||
let cancelled = false;
|
||||
getSong(songId)
|
||||
.then(song => { if (!cancelled) { songDetailCache.set(songId, song ?? null); setSongDetail(song ?? null); } })
|
||||
.catch(() => { if (!cancelled) { songDetailCache.set(songId, null); setSongDetail(null); } });
|
||||
.then(song => { if (!cancelled) { songDetailCache.set(cacheKey, song ?? null); setSongDetail(song ?? null); } })
|
||||
.catch(() => { if (!cancelled) { songDetailCache.set(cacheKey, null); setSongDetail(null); } });
|
||||
return () => { cancelled = true; };
|
||||
}, [songId]);
|
||||
}, [subsonicReady, subsonicServerId, songId]);
|
||||
|
||||
// Bandsintown — only when opt-in toggle is on
|
||||
useEffect(() => {
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { star, unstar } from '../api/subsonicStarRating';
|
||||
import { buildCoverArtUrl, coverArtCacheKey } from '../api/subsonicStreamUrl';
|
||||
import { usePlaybackCoverArt } from '../hooks/usePlaybackCoverArt';
|
||||
import type { SubsonicAlbum } from '../api/subsonicTypes';
|
||||
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
||||
import { createPortal } from 'react-dom';
|
||||
@@ -17,7 +18,7 @@ import WaveformSeek from './WaveformSeek';
|
||||
import Equalizer from './Equalizer';
|
||||
import StarRating from './StarRating';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { usePlaybackLibraryNavigate } from '../hooks/usePlaybackLibraryNavigate';
|
||||
import { useLyricsStore } from '../store/lyricsStore';
|
||||
import MarqueeText from './MarqueeText';
|
||||
import LastfmIcon from './LastfmIcon';
|
||||
@@ -40,7 +41,7 @@ import { useUtilityOverflowMenu } from '../hooks/useUtilityOverflowMenu';
|
||||
|
||||
export default function PlayerBar() {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const navigatePlaybackLibrary = usePlaybackLibraryNavigate();
|
||||
const [eqOpen, setEqOpen] = useState(false);
|
||||
const [showVolPct, setShowVolPct] = useState(false);
|
||||
const [localShowRemaining, setLocalShowRemaining] = useState(() => useThemeStore.getState().showRemainingTime);
|
||||
@@ -156,8 +157,14 @@ export default function PlayerBar() {
|
||||
? currentTrack.artists
|
||||
: undefined;
|
||||
|
||||
const coverSrc = useMemo(() => displayCoverArt ? buildCoverArtUrl(displayCoverArt, 128) : '', [displayCoverArt]);
|
||||
const coverKey = displayCoverArt ? coverArtCacheKey(displayCoverArt, 128) : '';
|
||||
const previewCover = useMemo(() => {
|
||||
if (!showPreviewMeta || !previewingTrack?.coverArt) return { src: '', cacheKey: '' };
|
||||
const id = previewingTrack.coverArt;
|
||||
return { src: buildCoverArtUrl(id, 128), cacheKey: coverArtCacheKey(id, 128) };
|
||||
}, [showPreviewMeta, previewingTrack?.coverArt]);
|
||||
const queueCover = usePlaybackCoverArt(showPreviewMeta ? undefined : displayCoverArt, 128);
|
||||
const coverSrc = showPreviewMeta ? previewCover.src : queueCover.src;
|
||||
const coverKey = showPreviewMeta ? previewCover.cacheKey : queueCover.cacheKey;
|
||||
|
||||
const handleVolume = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setVolume(parseFloat(e.target.value));
|
||||
@@ -220,7 +227,7 @@ export default function PlayerBar() {
|
||||
userRatingOverrides={userRatingOverrides}
|
||||
setUserRatingOverride={setUserRatingOverride}
|
||||
toggleFullscreen={toggleFullscreen}
|
||||
navigate={navigate}
|
||||
navigate={navigatePlaybackLibrary}
|
||||
openContextMenu={openContextMenu}
|
||||
t={t}
|
||||
/>
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import { getPlaylist, updatePlaylist } from '../api/subsonicPlaylists';
|
||||
import { buildCoverArtUrl, coverArtCacheKey } from '../api/subsonicStreamUrl';
|
||||
import { songToTrack } from '../utils/playback/songToTrack';
|
||||
import type { Track } from '../store/playerStoreTypes';
|
||||
import { useState, useRef, useMemo } from 'react';
|
||||
@@ -11,7 +10,7 @@ import HostApprovalQueue from './HostApprovalQueue';
|
||||
import { usePlaylistStore } from '../store/playlistStore';
|
||||
import { useCachedUrl } from './CachedImage';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { usePlaybackLibraryNavigate } from '../hooks/usePlaybackLibraryNavigate';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import { encodeSharePayload } from '../utils/share/shareLink';
|
||||
import { copyTextToClipboard } from '../utils/server/serverMagicString';
|
||||
@@ -34,6 +33,7 @@ import { QueueToolbar } from './queuePanel/QueueToolbar';
|
||||
import { QueueList } from './queuePanel/QueueList';
|
||||
import { QueueTabBar } from './queuePanel/QueueTabBar';
|
||||
import { useQueueAutoScroll } from '../hooks/useQueueAutoScroll';
|
||||
import { usePlaybackCoverArt } from '../hooks/usePlaybackCoverArt';
|
||||
|
||||
export default function QueuePanel() {
|
||||
const orbitRole = useOrbitStore(s => s.role);
|
||||
@@ -49,7 +49,7 @@ export default function QueuePanel() {
|
||||
|
||||
function QueuePanelHostOrSolo() {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const navigatePlaybackLibrary = usePlaybackLibraryNavigate();
|
||||
const orbitRole = useOrbitStore(s => s.role);
|
||||
const orbitState = useOrbitStore(s => s.state);
|
||||
/** trackId → addedBy (host username or guest username) — only populated while
|
||||
@@ -78,13 +78,9 @@ function QueuePanelHostOrSolo() {
|
||||
const queueIndex = usePlayerStore(s => s.queueIndex);
|
||||
const currentTrack = usePlayerStore(s => s.currentTrack);
|
||||
const userRatingOverrides = usePlayerStore(s => s.userRatingOverrides);
|
||||
const currentCoverFetchUrl = useMemo(
|
||||
() => currentTrack?.coverArt ? buildCoverArtUrl(currentTrack.coverArt, 128) : '',
|
||||
[currentTrack?.coverArt]
|
||||
);
|
||||
const currentCoverCacheKey = useMemo(
|
||||
() => currentTrack?.coverArt ? coverArtCacheKey(currentTrack.coverArt, 128) : '',
|
||||
[currentTrack?.coverArt]
|
||||
const { src: currentCoverFetchUrl, cacheKey: currentCoverCacheKey } = usePlaybackCoverArt(
|
||||
currentTrack?.coverArt,
|
||||
128,
|
||||
);
|
||||
const currentCoverSrc = useCachedUrl(currentCoverFetchUrl, currentCoverCacheKey);
|
||||
const isQueueVisible = usePlayerStore(s => s.isQueueVisible);
|
||||
@@ -265,7 +261,7 @@ function QueuePanelHostOrSolo() {
|
||||
currentCoverSrc={currentCoverSrc}
|
||||
userRatingOverrides={userRatingOverrides}
|
||||
orbitAttributionLabel={orbitAttributionLabel}
|
||||
navigate={navigate}
|
||||
navigate={navigatePlaybackLibrary}
|
||||
playbackSource={playbackSource}
|
||||
normalizationEngine={normalizationEngine}
|
||||
normalizationEngineLive={normalizationEngineLive}
|
||||
|
||||
@@ -22,10 +22,12 @@ export default function AlbumContextItems(props: ContextMenuItemsProps) {
|
||||
orbitRole, entityRatingSupport, audiomuseNavidromeEnabled,
|
||||
applySongRating, applyAlbumRating, applyArtistRating,
|
||||
handleAction, startRadio, startInstantMix, downloadAlbum, copyShareLink, isStarred,
|
||||
pinToPlaybackServer, navigateLibrary,
|
||||
} = props;
|
||||
const { t } = useTranslation();
|
||||
const auth = useAuthStore();
|
||||
const navigate = useNavigate();
|
||||
const goLibrary = pinToPlaybackServer ? navigateLibrary : (path: string) => { navigate(path); };
|
||||
|
||||
return (
|
||||
<>
|
||||
@@ -34,7 +36,7 @@ export default function AlbumContextItems(props: ContextMenuItemsProps) {
|
||||
const albumRatingDisabled = entityRatingSupport === 'track_only';
|
||||
return (
|
||||
<>
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => navigate(`/album/${album.id}`))}>
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => goLibrary(`/album/${album.id}`))}>
|
||||
<Play size={14} /> {t('contextMenu.openAlbum')}
|
||||
</div>
|
||||
<div className="context-menu-item" onClick={() => handleAction(async () => {
|
||||
@@ -52,7 +54,7 @@ export default function AlbumContextItems(props: ContextMenuItemsProps) {
|
||||
<ListPlus size={14} /> {t('contextMenu.enqueueAlbum')}
|
||||
</div>
|
||||
<div className="context-menu-divider" />
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => navigate(`/artist/${album.artistId}`))}>
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => goLibrary(`/artist/${album.artistId}`))}>
|
||||
<User size={14} /> {t('contextMenu.goToArtist')}
|
||||
</div>
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => {
|
||||
|
||||
@@ -1,6 +1,5 @@
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Play, Radio, Heart, ChevronRight, User, Disc3, ListMusic, Info, Sparkles, Star, Trash2, Share2 } from 'lucide-react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { star, unstar } from '../../api/subsonicStarRating';
|
||||
import { lastfmLoveTrack, lastfmUnloveTrack } from '../../api/lastfm';
|
||||
import type { Track } from '../../store/playerStoreTypes';
|
||||
@@ -21,10 +20,10 @@ export default function QueueItemContextItems(props: ContextMenuItemsProps) {
|
||||
orbitRole, entityRatingSupport, audiomuseNavidromeEnabled,
|
||||
applySongRating, applyAlbumRating, applyArtistRating,
|
||||
handleAction, startRadio, startInstantMix, downloadAlbum, copyShareLink, isStarred,
|
||||
navigateLibrary,
|
||||
} = props;
|
||||
const { t } = useTranslation();
|
||||
const auth = useAuthStore();
|
||||
const navigate = useNavigate();
|
||||
|
||||
return (
|
||||
<>
|
||||
@@ -54,12 +53,12 @@ export default function QueueItemContextItems(props: ContextMenuItemsProps) {
|
||||
</div>
|
||||
<div className="context-menu-divider" />
|
||||
{song.albumId && (
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => navigate(`/album/${song.albumId}`))}>
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => navigateLibrary(`/album/${song.albumId}`))}>
|
||||
<Disc3 size={14} /> {t('contextMenu.openAlbum')}
|
||||
</div>
|
||||
)}
|
||||
{song.artistId && (
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => navigate(`/artist/${song.artistId}`))}>
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => navigateLibrary(`/artist/${song.artistId}`))}>
|
||||
<User size={14} /> {t('contextMenu.goToArtist')}
|
||||
</div>
|
||||
)}
|
||||
|
||||
@@ -51,4 +51,7 @@ export interface ContextMenuItemsProps {
|
||||
downloadAlbum: (albumName: string, albumId: string) => Promise<void>;
|
||||
copyShareLink: (kind: EntityShareKind, id: string) => void;
|
||||
isStarred: (id: string, itemStarred?: string) => boolean;
|
||||
/** When true, album/artist links switch to the queue server before routing. */
|
||||
pinToPlaybackServer: boolean;
|
||||
navigateLibrary: (path: string) => void | Promise<void>;
|
||||
}
|
||||
|
||||
@@ -35,7 +35,7 @@ interface Props {
|
||||
userRatingOverrides: Record<string, number>;
|
||||
setUserRatingOverride: (id: string, r: number) => void;
|
||||
toggleFullscreen: () => void;
|
||||
navigate: (to: string) => void;
|
||||
navigate: (to: string) => void | Promise<void>;
|
||||
openContextMenu: PlayerState['openContextMenu'];
|
||||
t: TFunction;
|
||||
}
|
||||
@@ -115,7 +115,7 @@ export function PlayerTrackInfo({
|
||||
songCount: 0,
|
||||
duration: 0,
|
||||
};
|
||||
openContextMenu(e.clientX, e.clientY, album, 'album');
|
||||
openContextMenu(e.clientX, e.clientY, album, 'album', undefined, undefined, undefined, undefined, true);
|
||||
}
|
||||
: undefined}
|
||||
/>
|
||||
|
||||
@@ -17,7 +17,7 @@ interface Props {
|
||||
currentCoverSrc: string;
|
||||
userRatingOverrides: Record<string, number>;
|
||||
orbitAttributionLabel: (trackId: string) => string | null;
|
||||
navigate: (to: string) => void;
|
||||
navigate: (to: string) => void | Promise<void>;
|
||||
playbackSource: PlaybackSourceKind | null;
|
||||
normalizationEngine: NormalizationEngine;
|
||||
normalizationEngineLive: 'off' | 'replaygain' | 'loudness';
|
||||
|
||||
@@ -112,6 +112,7 @@ const CONTRIBUTOR_ENTRIES = [
|
||||
'Internet Radio: portal add/edit station modal to document.body — fixes clipped modal on empty library (report: voidboywannabe on Psysonic Discord) (PR #699)',
|
||||
'Now Playing: composite list keys on similar artists, album-card tracklist, and top songs — avoids duplicate React keys when Subsonic repeats ids (PR #703)',
|
||||
'Search: share links in live/mobile search + queue preview modal (PR #716)',
|
||||
'Multi-server: pin queue streams, cover art, links, context menu, and Now Playing to queue server (PR #717)',
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
@@ -0,0 +1,33 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import { usePlayerStore } from '../store/playerStore';
|
||||
import {
|
||||
ensurePlaybackServerActive,
|
||||
playbackServerDiffersFromActive,
|
||||
} from '../utils/playback/playbackServer';
|
||||
|
||||
/**
|
||||
* On Now Playing surfaces, switch the browsed server to {@link queueServerId}
|
||||
* before Subsonic fetches run. Returns false while a switch is in flight.
|
||||
*/
|
||||
export function useEnsurePlaybackServerOnMount(): boolean {
|
||||
const queueServerId = usePlayerStore(s => s.queueServerId);
|
||||
const queueLength = usePlayerStore(s => s.queue.length);
|
||||
const activeServerId = useAuthStore(s => s.activeServerId);
|
||||
const [ready, setReady] = useState(() => !playbackServerDiffersFromActive());
|
||||
|
||||
useEffect(() => {
|
||||
if (!playbackServerDiffersFromActive()) {
|
||||
setReady(true);
|
||||
return;
|
||||
}
|
||||
let cancelled = false;
|
||||
setReady(false);
|
||||
void ensurePlaybackServerActive().then(ok => {
|
||||
if (!cancelled) setReady(ok);
|
||||
});
|
||||
return () => { cancelled = true; };
|
||||
}, [queueServerId, queueLength, activeServerId]);
|
||||
|
||||
return ready;
|
||||
}
|
||||
@@ -28,6 +28,10 @@ export interface NowPlayingFetchersDeps {
|
||||
audiomuseNavidromeEnabled: boolean;
|
||||
lastfmUsername: string;
|
||||
currentTrack: { artist: string; title: string } | null;
|
||||
/** Subsonic server for API calls — must match the playing queue server. */
|
||||
subsonicServerId: string;
|
||||
/** False while switching active server to the queue server. */
|
||||
fetchEnabled?: boolean;
|
||||
}
|
||||
|
||||
export interface NowPlayingFetchersResult {
|
||||
@@ -42,64 +46,80 @@ export interface NowPlayingFetchersResult {
|
||||
lfmArtist: LastfmArtistStats | null;
|
||||
}
|
||||
|
||||
function subsonicCacheKey(serverId: string, id: string): string {
|
||||
return serverId ? `${serverId}:${id}` : id;
|
||||
}
|
||||
|
||||
export function useNowPlayingFetchers(deps: NowPlayingFetchersDeps): NowPlayingFetchersResult {
|
||||
const { songId, artistId, albumId, artistName, enableBandsintown, audiomuseNavidromeEnabled, lastfmUsername, currentTrack } = deps;
|
||||
const {
|
||||
songId, artistId, albumId, artistName, enableBandsintown, audiomuseNavidromeEnabled,
|
||||
lastfmUsername, currentTrack, subsonicServerId, fetchEnabled = true,
|
||||
} = deps;
|
||||
|
||||
// Entity state, seeded from TTL cache so same-artist song switches are instant
|
||||
const [songMeta, setSongMeta] = useState<SubsonicSong | null>(() => songId ? songMetaCache.get(songId) ?? null : null);
|
||||
const [artistInfo, setArtistInfo] = useState<SubsonicArtistInfo | null>(() => artistId ? artistInfoCache.get(artistId) ?? null : null);
|
||||
const [albumData, setAlbumData] = useState<{ album: SubsonicAlbum; songs: SubsonicSong[] } | null>(() => albumId ? albumCache.get(albumId) ?? null : null);
|
||||
const [topSongs, setTopSongs] = useState<SubsonicSong[]>(() => artistName ? topSongsCache.get(artistName) ?? [] : []);
|
||||
const [songMeta, setSongMeta] = useState<SubsonicSong | null>(() =>
|
||||
songId && subsonicServerId ? songMetaCache.get(subsonicCacheKey(subsonicServerId, songId)) ?? null : null);
|
||||
const [artistInfo, setArtistInfo] = useState<SubsonicArtistInfo | null>(() =>
|
||||
artistId && subsonicServerId ? artistInfoCache.get(subsonicCacheKey(subsonicServerId, artistId)) ?? null : null);
|
||||
const [albumData, setAlbumData] = useState<{ album: SubsonicAlbum; songs: SubsonicSong[] } | null>(() =>
|
||||
albumId && subsonicServerId ? albumCache.get(subsonicCacheKey(subsonicServerId, albumId)) ?? null : null);
|
||||
const [topSongs, setTopSongs] = useState<SubsonicSong[]>(() =>
|
||||
artistName && subsonicServerId ? topSongsCache.get(subsonicCacheKey(subsonicServerId, artistName)) ?? [] : []);
|
||||
const [tourEvents, setTourEvents] = useState<BandsintownEvent[]>(() => artistName ? tourCache.get(artistName) ?? [] : []);
|
||||
const [tourLoading, setTourLoading] = useState(false);
|
||||
const [discography, setDiscography] = useState<SubsonicAlbum[]>(() => artistId ? discographyCache.get(artistId) ?? [] : []);
|
||||
const [discography, setDiscography] = useState<SubsonicAlbum[]>(() =>
|
||||
artistId && subsonicServerId ? discographyCache.get(subsonicCacheKey(subsonicServerId, artistId)) ?? [] : []);
|
||||
const [lfmTrack, setLfmTrack] = useState<LastfmTrackInfo | null>(null);
|
||||
const [lfmArtist, setLfmArtist] = useState<LastfmArtistStats | null>(null);
|
||||
|
||||
// Fetch batch per entity change (not per song switch — same-artist songs share artist/top/tour fetches)
|
||||
useEffect(() => {
|
||||
if (!songId) { setSongMeta(null); return; }
|
||||
const cached = songMetaCache.get(songId);
|
||||
if (!fetchEnabled || !subsonicServerId || !songId) { setSongMeta(null); return; }
|
||||
const cacheKey = subsonicCacheKey(subsonicServerId, songId);
|
||||
const cached = songMetaCache.get(cacheKey);
|
||||
if (cached !== undefined) { setSongMeta(cached); return; }
|
||||
let cancelled = false;
|
||||
getSong(songId)
|
||||
.then(v => { if (!cancelled) { songMetaCache.set(songId, v ?? null); setSongMeta(v ?? null); } })
|
||||
.catch(() => { if (!cancelled) { songMetaCache.set(songId, null); setSongMeta(null); } });
|
||||
.then(v => { if (!cancelled) { songMetaCache.set(cacheKey, v ?? null); setSongMeta(v ?? null); } })
|
||||
.catch(() => { if (!cancelled) { songMetaCache.set(cacheKey, null); setSongMeta(null); } });
|
||||
return () => { cancelled = true; };
|
||||
}, [songId]);
|
||||
}, [fetchEnabled, subsonicServerId, songId]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!artistId) { setArtistInfo(null); return; }
|
||||
const cached = artistInfoCache.get(artistId);
|
||||
if (!fetchEnabled || !subsonicServerId || !artistId) { setArtistInfo(null); return; }
|
||||
const cacheKey = subsonicCacheKey(subsonicServerId, artistId);
|
||||
const cached = artistInfoCache.get(cacheKey);
|
||||
if (cached !== undefined) { setArtistInfo(cached); return; }
|
||||
let cancelled = false;
|
||||
getArtistInfo(artistId, { similarArtistCount: audiomuseNavidromeEnabled ? 24 : undefined })
|
||||
.then(v => { if (!cancelled) { artistInfoCache.set(artistId, v ?? null); setArtistInfo(v ?? null); } })
|
||||
.catch(() => { if (!cancelled) { artistInfoCache.set(artistId, null); setArtistInfo(null); } });
|
||||
.then(v => { if (!cancelled) { artistInfoCache.set(cacheKey, v ?? null); setArtistInfo(v ?? null); } })
|
||||
.catch(() => { if (!cancelled) { artistInfoCache.set(cacheKey, null); setArtistInfo(null); } });
|
||||
return () => { cancelled = true; };
|
||||
}, [artistId, audiomuseNavidromeEnabled]);
|
||||
}, [fetchEnabled, subsonicServerId, artistId, audiomuseNavidromeEnabled]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!albumId) { setAlbumData(null); return; }
|
||||
const cached = albumCache.get(albumId);
|
||||
if (!fetchEnabled || !subsonicServerId || !albumId) { setAlbumData(null); return; }
|
||||
const cacheKey = subsonicCacheKey(subsonicServerId, albumId);
|
||||
const cached = albumCache.get(cacheKey);
|
||||
if (cached !== undefined) { setAlbumData(cached); return; }
|
||||
let cancelled = false;
|
||||
getAlbum(albumId)
|
||||
.then(v => { if (!cancelled) { albumCache.set(albumId, v); setAlbumData(v); } })
|
||||
.catch(() => { if (!cancelled) { albumCache.set(albumId, null); setAlbumData(null); } });
|
||||
.then(v => { if (!cancelled) { albumCache.set(cacheKey, v); setAlbumData(v); } })
|
||||
.catch(() => { if (!cancelled) { albumCache.set(cacheKey, null); setAlbumData(null); } });
|
||||
return () => { cancelled = true; };
|
||||
}, [albumId]);
|
||||
}, [fetchEnabled, subsonicServerId, albumId]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!artistName) { setTopSongs([]); return; }
|
||||
const cached = topSongsCache.get(artistName);
|
||||
if (!fetchEnabled || !subsonicServerId || !artistName) { setTopSongs([]); return; }
|
||||
const cacheKey = subsonicCacheKey(subsonicServerId, artistName);
|
||||
const cached = topSongsCache.get(cacheKey);
|
||||
if (cached !== undefined) { setTopSongs(cached); return; }
|
||||
let cancelled = false;
|
||||
getTopSongs(artistName)
|
||||
.then(v => { if (!cancelled) { topSongsCache.set(artistName, v); setTopSongs(v); } })
|
||||
.catch(() => { if (!cancelled) { topSongsCache.set(artistName, []); setTopSongs([]); } });
|
||||
.then(v => { if (!cancelled) { topSongsCache.set(cacheKey, v); setTopSongs(v); } })
|
||||
.catch(() => { if (!cancelled) { topSongsCache.set(cacheKey, []); setTopSongs([]); } });
|
||||
return () => { cancelled = true; };
|
||||
}, [artistName]);
|
||||
}, [fetchEnabled, subsonicServerId, artistName]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!enableBandsintown || !artistName) { setTourEvents([]); return; }
|
||||
@@ -115,15 +135,16 @@ export function useNowPlayingFetchers(deps: NowPlayingFetchersDeps): NowPlayingF
|
||||
|
||||
// Discography via getArtist
|
||||
useEffect(() => {
|
||||
if (!artistId) { setDiscography([]); return; }
|
||||
const cached = discographyCache.get(artistId);
|
||||
if (!fetchEnabled || !subsonicServerId || !artistId) { setDiscography([]); return; }
|
||||
const cacheKey = subsonicCacheKey(subsonicServerId, artistId);
|
||||
const cached = discographyCache.get(cacheKey);
|
||||
if (cached !== undefined) { setDiscography(cached); return; }
|
||||
let cancelled = false;
|
||||
getArtist(artistId)
|
||||
.then(v => { if (!cancelled) { discographyCache.set(artistId, v.albums); setDiscography(v.albums); } })
|
||||
.catch(() => { if (!cancelled) { discographyCache.set(artistId, []); setDiscography([]); } });
|
||||
.then(v => { if (!cancelled) { discographyCache.set(cacheKey, v.albums); setDiscography(v.albums); } })
|
||||
.catch(() => { if (!cancelled) { discographyCache.set(cacheKey, []); setDiscography([]); } });
|
||||
return () => { cancelled = true; };
|
||||
}, [artistId]);
|
||||
}, [fetchEnabled, subsonicServerId, artistId]);
|
||||
|
||||
// Last.fm track info (per-track)
|
||||
const lfmTrackKey = currentTrack ? `${currentTrack.artist} ${currentTrack.title} ${lastfmUsername}` : '';
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
import { useMemo } from 'react';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import { usePlayerStore } from '../store/playerStore';
|
||||
import { playbackCoverArtForId } from '../utils/playback/playbackServer';
|
||||
|
||||
/** Cover art for the playing queue — uses {@link queueServerId} when it differs from the browsed server. */
|
||||
export function usePlaybackCoverArt(coverId: string | undefined, size: number) {
|
||||
const queueServerId = usePlayerStore(s => s.queueServerId);
|
||||
const queueLength = usePlayerStore(s => s.queue.length);
|
||||
const activeServerId = useAuthStore(s => s.activeServerId);
|
||||
const servers = useAuthStore(s => s.servers);
|
||||
|
||||
return useMemo(() => {
|
||||
if (!coverId) return { src: '', cacheKey: '' };
|
||||
return playbackCoverArtForId(coverId, size);
|
||||
}, [coverId, size, queueServerId, queueLength, activeServerId, servers]);
|
||||
}
|
||||
@@ -0,0 +1,12 @@
|
||||
import { useCallback } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { ensurePlaybackServerActive } from '../utils/playback/playbackServer';
|
||||
|
||||
/** Navigate to library routes for the playing queue — switches to {@link queueServerId} when needed. */
|
||||
export function usePlaybackLibraryNavigate() {
|
||||
const navigate = useNavigate();
|
||||
return useCallback(async (path: string) => {
|
||||
await ensurePlaybackServerActive();
|
||||
navigate(path);
|
||||
}, [navigate]);
|
||||
}
|
||||
+14
-9
@@ -1,4 +1,5 @@
|
||||
import { buildStreamUrl } from './api/subsonicStreamUrl';
|
||||
import { buildStreamUrlForServer } from './api/subsonicStreamUrl';
|
||||
import { getPlaybackServerId } from './utils/playback/playbackServer';
|
||||
import type { Track } from './store/playerStoreTypes';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { useAuthStore } from './store/authStore';
|
||||
@@ -73,7 +74,8 @@ async function runWorker() {
|
||||
try {
|
||||
while (pendingQueue.length > 0) {
|
||||
const auth = useAuthStore.getState();
|
||||
if (!auth.isLoggedIn || !auth.hotCacheEnabled || !auth.activeServerId) {
|
||||
const playbackSid = getPlaybackServerId();
|
||||
if (!auth.isLoggedIn || !auth.hotCacheEnabled || !playbackSid) {
|
||||
hotCacheFrontendDebug({
|
||||
event: 'prefetch-worker-stop',
|
||||
reason: 'auth-disabled-or-logged-out',
|
||||
@@ -153,7 +155,7 @@ async function runWorker() {
|
||||
continue;
|
||||
}
|
||||
|
||||
const url = buildStreamUrl(job.trackId);
|
||||
const url = buildStreamUrlForServer(job.serverId, job.trackId);
|
||||
try {
|
||||
const customDir = auth.hotCacheDownloadDir || null;
|
||||
hotCacheFrontendDebug({ event: 'prefetch-invoke', trackId: job.trackId });
|
||||
@@ -173,7 +175,7 @@ async function runWorker() {
|
||||
fresh.queue,
|
||||
fresh.queueIndex,
|
||||
maxAfter,
|
||||
authAfter.activeServerId ?? '',
|
||||
getPlaybackServerId(),
|
||||
authAfter.hotCacheDownloadDir || null,
|
||||
);
|
||||
} catch (e: unknown) {
|
||||
@@ -188,7 +190,8 @@ async function runWorker() {
|
||||
|
||||
function scheduleReplan() {
|
||||
const auth = useAuthStore.getState();
|
||||
if (!auth.isLoggedIn || !auth.hotCacheEnabled || !auth.activeServerId) {
|
||||
const playbackSid = getPlaybackServerId();
|
||||
if (!auth.isLoggedIn || !auth.hotCacheEnabled || !playbackSid) {
|
||||
if (debounceTimer) {
|
||||
clearTimeout(debounceTimer);
|
||||
debounceTimer = null;
|
||||
@@ -206,9 +209,10 @@ function scheduleReplan() {
|
||||
|
||||
async function replanNow() {
|
||||
const auth = useAuthStore.getState();
|
||||
if (!auth.isLoggedIn || !auth.hotCacheEnabled || !auth.activeServerId) return;
|
||||
const playbackSid = getPlaybackServerId();
|
||||
if (!auth.isLoggedIn || !auth.hotCacheEnabled || !playbackSid) return;
|
||||
|
||||
const serverId = auth.activeServerId;
|
||||
const serverId = playbackSid;
|
||||
const maxBytes = Math.max(0, auth.hotCacheMaxMb) * 1024 * 1024;
|
||||
const customDir = auth.hotCacheDownloadDir || null;
|
||||
if (maxBytes <= 0) return;
|
||||
@@ -286,8 +290,9 @@ export function initHotCachePrefetch(): () => void {
|
||||
if (onlyIndexMoved && i > prevIdx && prevIdx >= 0 && Array.isArray(prevQ)) {
|
||||
const left = (prevQ as Track[])[prevIdx];
|
||||
const a = useAuthStore.getState();
|
||||
if (left && a.activeServerId) {
|
||||
bumpHotCachePreviousTrackGrace(left.id, a.activeServerId, a.hotCacheDebounceSec);
|
||||
const graceSid = getPlaybackServerId();
|
||||
if (left && graceSid) {
|
||||
bumpHotCachePreviousTrackGrace(left.id, graceSid, a.hotCacheDebounceSec);
|
||||
scheduleEvictAfterPreviousGrace();
|
||||
}
|
||||
}
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: 'Warteschlangen-Link kopieren',
|
||||
shareQueueEmpty: 'Die Warteschlange ist leer — nichts zu teilen.',
|
||||
emptyQueue: 'Die Warteschlange ist leer.',
|
||||
crossServerEnqueueBlocked: 'Titel von einem anderen Server können der aktuellen Warteschlange nicht hinzugefügt werden. Beende oder leere die Warteschlange zuerst.',
|
||||
trackSingular: 'Titel',
|
||||
trackPlural: 'Titel',
|
||||
showRemaining: 'Restzeit anzeigen',
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: 'Copy queue share link',
|
||||
shareQueueEmpty: 'The queue is empty — nothing to share.',
|
||||
emptyQueue: 'The queue is empty.',
|
||||
crossServerEnqueueBlocked: 'Tracks from another server cannot be added to the current queue. Finish or clear the queue first.',
|
||||
trackSingular: 'track',
|
||||
trackPlural: 'tracks',
|
||||
showRemaining: 'Show remaining time',
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: 'Copiar enlace de la cola',
|
||||
shareQueueEmpty: 'La cola está vacía — no hay nada que compartir.',
|
||||
emptyQueue: 'La cola está vacía.',
|
||||
crossServerEnqueueBlocked: 'No se pueden añadir pistas de otro servidor a la cola actual. Termina o vacía la cola primero.',
|
||||
trackSingular: 'pista',
|
||||
trackPlural: 'pistas',
|
||||
showRemaining: 'Mostrar tiempo restante',
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: 'Copier le lien de la file d’attente',
|
||||
shareQueueEmpty: 'La file d’attente est vide — rien à partager.',
|
||||
emptyQueue: 'La file d\'attente est vide.',
|
||||
crossServerEnqueueBlocked: 'Les titres d\'un autre serveur ne peuvent pas être ajoutés à la file en cours. Terminez ou videz la file d\'abord.',
|
||||
trackSingular: 'piste',
|
||||
trackPlural: 'pistes',
|
||||
showRemaining: 'Afficher le temps restant',
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: 'Kopiér lenke til kø',
|
||||
shareQueueEmpty: 'Køen er tom — ingenting å dele.',
|
||||
emptyQueue: 'Køen er tom.',
|
||||
crossServerEnqueueBlocked: 'Spor fra en annen server kan ikke legges til i den nåværende køen. Tøm eller avslutt køen først.',
|
||||
trackSingular: 'spor',
|
||||
trackPlural: 'spor',
|
||||
showRemaining: 'Vis gjenværende tid',
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: 'Wachtrij-deellink kopiëren',
|
||||
shareQueueEmpty: 'De wachtrij is leeg — niets om te delen.',
|
||||
emptyQueue: 'De wachtrij is leeg.',
|
||||
crossServerEnqueueBlocked: 'Tracks van een andere server kunnen niet aan de huidige wachtrij worden toegevoegd. Maak de wachtrij eerst leeg of stop afspelen.',
|
||||
trackSingular: 'nummer',
|
||||
trackPlural: 'nummers',
|
||||
showRemaining: 'Resterende tijd tonen',
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: 'Copiază link-ul distribuirii cozii',
|
||||
shareQueueEmpty: 'Coada este goală — nimic de distribuit.',
|
||||
emptyQueue: 'Coada este goală.',
|
||||
crossServerEnqueueBlocked: 'Piesele de pe alt server nu pot fi adăugate în coada curentă. Golește sau oprește coada mai întâi.',
|
||||
trackSingular: 'piesă',
|
||||
trackPlural: 'piese',
|
||||
showRemaining: 'Arată timpul rămas',
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: 'Копировать ссылку на очередь',
|
||||
shareQueueEmpty: 'Очередь пуста — нечем поделиться.',
|
||||
emptyQueue: 'Очередь пуста.',
|
||||
crossServerEnqueueBlocked: 'Треки с другого сервера нельзя добавить в текущую очередь. Завершите или очистите очередь.',
|
||||
trackSingular: 'трек',
|
||||
trackPlural: 'треков',
|
||||
showRemaining: 'Осталось',
|
||||
|
||||
@@ -28,6 +28,7 @@ export const queue = {
|
||||
shareQueue: '复制队列分享链接',
|
||||
shareQueueEmpty: '队列为空,无法分享。',
|
||||
emptyQueue: '队列为空。',
|
||||
crossServerEnqueueBlocked: '无法将其他服务器的曲目加入当前播放队列。请先清空或结束当前队列。',
|
||||
trackSingular: '首曲目',
|
||||
trackPlural: '首曲目',
|
||||
showRemaining: '显示剩余时间',
|
||||
|
||||
@@ -1,7 +1,9 @@
|
||||
import { buildCoverArtUrl, coverArtCacheKey } from '../api/subsonicStreamUrl';
|
||||
import { usePlaybackCoverArt } from '../hooks/usePlaybackCoverArt';
|
||||
import type { SubsonicArtistInfo, SubsonicSong } from '../api/subsonicTypes';
|
||||
import React, { useState, useRef, useEffect, useCallback, useMemo, memo } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import { usePlaybackLibraryNavigate } from '../hooks/usePlaybackLibraryNavigate';
|
||||
import { useEnsurePlaybackServerOnMount } from '../hooks/useEnsurePlaybackServerOnMount';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { Music, ExternalLink, Cast, Users, Radio, Clock, SkipForward, Info, Calendar, Disc3, Play, EyeOff, LayoutGrid, RotateCcw, Eye } from 'lucide-react';
|
||||
import { open as shellOpen } from '@tauri-apps/plugin-shell';
|
||||
@@ -43,8 +45,9 @@ import { useNowPlayingStarLove } from '../hooks/useNowPlayingStarLove';
|
||||
|
||||
export default function NowPlaying() {
|
||||
const { t } = useTranslation();
|
||||
const navigate = useNavigate();
|
||||
const stableNavigate = useCallback((path: string) => navigate(path), [navigate]);
|
||||
const stableNavigate = usePlaybackLibraryNavigate();
|
||||
const subsonicReady = useEnsurePlaybackServerOnMount();
|
||||
const activeServerId = useAuthStore(s => s.activeServerId ?? '');
|
||||
|
||||
const currentTrack = usePlayerStore(s => s.currentTrack);
|
||||
const currentRadio = usePlayerStore(s => s.currentRadio);
|
||||
@@ -78,6 +81,8 @@ export default function NowPlaying() {
|
||||
songId, artistId, albumId, artistName,
|
||||
enableBandsintown, audiomuseNavidromeEnabled,
|
||||
lastfmUsername, currentTrack,
|
||||
subsonicServerId: activeServerId,
|
||||
fetchEnabled: subsonicReady,
|
||||
});
|
||||
|
||||
// Star + Last.fm love + their toggle callbacks
|
||||
@@ -91,10 +96,8 @@ export default function NowPlaying() {
|
||||
showLyrics();
|
||||
}, [isQueueVisible, toggleQueue, showLyrics]);
|
||||
|
||||
// Cover
|
||||
const coverFetchUrl = currentTrack?.coverArt ? buildCoverArtUrl(currentTrack.coverArt, 800) : '';
|
||||
const coverKey = currentTrack?.coverArt ? coverArtCacheKey(currentTrack.coverArt, 800) : '';
|
||||
const resolvedCover = useCachedUrl(coverFetchUrl, coverKey);
|
||||
const { src: coverFetchUrl, cacheKey: coverKey } = usePlaybackCoverArt(currentTrack?.coverArt, 800);
|
||||
const resolvedCover = useCachedUrl(coverFetchUrl, coverKey);
|
||||
|
||||
const radioCoverFetchUrl = currentRadio?.coverArt ? buildCoverArtUrl(`ra-${currentRadio.id}`, 800) : '';
|
||||
const radioCoverKey = currentRadio?.coverArt ? coverArtCacheKey(`ra-${currentRadio.id}`, 800) : '';
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { reportNowPlaying } from '../api/subsonicScrobble';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { getPlaybackServerId } from '../utils/playback/playbackServer';
|
||||
import { getPlaybackSourceKind } from '../utils/playback/resolvePlaybackUrl';
|
||||
import { useAuthStore } from './authStore';
|
||||
import {
|
||||
@@ -129,9 +130,9 @@ export function applyQueueHistorySnapshot(
|
||||
PlayerState,
|
||||
'normalizationNowDb' | 'normalizationTargetLufs' | 'normalizationEngineLive'
|
||||
>);
|
||||
const authSnap = useAuthStore.getState();
|
||||
const playbackSid = getPlaybackServerId();
|
||||
const playbackSourceUndo = nextTrack
|
||||
? getPlaybackSourceKind(nextTrack.id, authSnap.activeServerId ?? '', null)
|
||||
? getPlaybackSourceKind(nextTrack.id, playbackSid, null)
|
||||
: null;
|
||||
const playbackSourceFinal = keepPlaybackFromPrior && prior.currentPlaybackSource != null
|
||||
? prior.currentPlaybackSource
|
||||
@@ -186,7 +187,7 @@ export function applyQueueHistorySnapshot(
|
||||
|
||||
if (!keepPlaybackFromPrior) {
|
||||
const { nowPlayingEnabled: npUndo } = useAuthStore.getState();
|
||||
if (npUndo) reportNowPlaying(nextTrack.id);
|
||||
if (npUndo) reportNowPlaying(nextTrack.id, getPlaybackServerId());
|
||||
|
||||
queueUndoRestoreAudioEngine({
|
||||
generation: gen,
|
||||
|
||||
@@ -5,6 +5,7 @@ import { lastfmGetTrackLoved, lastfmScrobble, lastfmUpdateNowPlaying } from '../
|
||||
import { setDeferHotCachePrefetch } from '../utils/cache/hotCacheGate';
|
||||
import { getPerfProbeFlags } from '../utils/perf/perfFlags';
|
||||
import { bumpPerfCounter } from '../utils/perf/perfTelemetry';
|
||||
import { getPlaybackServerId } from '../utils/playback/playbackServer';
|
||||
import { resolvePlaybackUrl } from '../utils/playback/resolvePlaybackUrl';
|
||||
import { resolveReplayGainDb } from '../utils/audio/resolveReplayGainDb';
|
||||
import { showToast } from '../utils/ui/toast';
|
||||
@@ -160,7 +161,7 @@ export function handleAudioProgress(current_time: number, duration: number): voi
|
||||
// Scrobble at 50%: Last.fm + Navidrome (updates play_date / recently played)
|
||||
if (progress >= 0.5 && !store.scrobbled) {
|
||||
usePlayerStore.setState({ scrobbled: true });
|
||||
scrobbleSong(track.id, Date.now());
|
||||
scrobbleSong(track.id, Date.now(), getPlaybackServerId());
|
||||
const { scrobblingEnabled, lastfmSessionKey } = useAuthStore.getState();
|
||||
if (scrobblingEnabled && lastfmSessionKey) {
|
||||
lastfmScrobble(track, Date.now(), lastfmSessionKey);
|
||||
@@ -236,7 +237,7 @@ export function handleAudioProgress(current_time: number, duration: number): voi
|
||||
const shouldBytePreloadForGaplessBackup =
|
||||
gaplessEnabled && remaining < gaplessBackupWindowSecs && remaining > 0;
|
||||
|
||||
const serverId = useAuthStore.getState().activeServerId ?? '';
|
||||
const serverId = getPlaybackServerId();
|
||||
const nextUrl = resolvePlaybackUrl(nextTrack.id, serverId);
|
||||
|
||||
// Byte pre-download — runs early so bytes are cached by chain time.
|
||||
@@ -322,7 +323,7 @@ export function handleAudioEnded(): void {
|
||||
void (async () => {
|
||||
if (repeatMode === 'one' && currentTrack) {
|
||||
const authState = useAuthStore.getState();
|
||||
const repeatPromoteSid = authState.activeServerId;
|
||||
const repeatPromoteSid = getPlaybackServerId();
|
||||
if (authState.hotCacheEnabled && repeatPromoteSid) {
|
||||
// Same-track repeat never hit `playTrack`'s prev→promote path; flush
|
||||
// Rust `stream_completed_cache` to disk so `resolvePlaybackUrl` uses local.
|
||||
@@ -373,7 +374,7 @@ export function handleAudioTrackSwitched(_duration: number): void {
|
||||
|
||||
if (!nextTrack) return;
|
||||
|
||||
const switchServerId = useAuthStore.getState().activeServerId ?? '';
|
||||
const switchServerId = getPlaybackServerId();
|
||||
const switchResolvedUrl = resolvePlaybackUrl(nextTrack.id, switchServerId);
|
||||
const switchPlaybackSource = playbackSourceHintForResolvedUrl(nextTrack.id, switchServerId, switchResolvedUrl);
|
||||
|
||||
@@ -403,7 +404,7 @@ export function handleAudioTrackSwitched(_duration: number): void {
|
||||
|
||||
// Report Now Playing to Navidrome + Last.fm
|
||||
const { nowPlayingEnabled, scrobblingEnabled, lastfmSessionKey } = useAuthStore.getState();
|
||||
if (nowPlayingEnabled) reportNowPlaying(nextTrack.id);
|
||||
if (nowPlayingEnabled) reportNowPlaying(nextTrack.id, getPlaybackServerId());
|
||||
if (lastfmSessionKey) {
|
||||
if (scrobblingEnabled) lastfmUpdateNowPlaying(nextTrack, lastfmSessionKey);
|
||||
lastfmGetTrackLoved(nextTrack.title, nextTrack.artist, lastfmSessionKey).then(loved => {
|
||||
@@ -415,7 +416,7 @@ export function handleAudioTrackSwitched(_duration: number): void {
|
||||
});
|
||||
}
|
||||
syncQueueToServer(queue, nextTrack, 0);
|
||||
touchHotCacheOnPlayback(nextTrack.id, useAuthStore.getState().activeServerId ?? '');
|
||||
touchHotCacheOnPlayback(nextTrack.id, getPlaybackServerId());
|
||||
}
|
||||
|
||||
export function handleAudioError(message: string): void {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { buildCoverArtUrl } from '../../api/subsonicStreamUrl';
|
||||
import { playbackCoverArtForId } from '../../utils/playback/playbackServer';
|
||||
import { usePlayerStore } from '../playerStore';
|
||||
import { getPlaybackProgressSnapshot, subscribePlaybackProgress } from '../playbackProgress';
|
||||
|
||||
@@ -22,7 +22,7 @@ export function setupMprisSync(): () => void {
|
||||
prevTrackId = currentTrack.id;
|
||||
prevRadioId = null;
|
||||
const coverUrl = currentTrack.coverArt
|
||||
? buildCoverArtUrl(currentTrack.coverArt, 512)
|
||||
? playbackCoverArtForId(currentTrack.coverArt, 512).src
|
||||
: undefined;
|
||||
invoke('mpris_set_metadata', {
|
||||
title: currentTrack.title,
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
import type { AuthState } from './authStoreTypes';
|
||||
import { generateId } from './authStoreHelpers';
|
||||
import { usePlayerStore } from './playerStore';
|
||||
import { clearQueueServerForPlayback } from '../utils/playback/playbackServer';
|
||||
|
||||
type SetState = (
|
||||
partial: Partial<AuthState> | ((state: AuthState) => Partial<AuthState>),
|
||||
@@ -38,6 +40,9 @@ export function createServerProfileActions(set: SetState): Pick<
|
||||
},
|
||||
|
||||
removeServer: (id) => {
|
||||
if (usePlayerStore.getState().queueServerId === id) {
|
||||
clearQueueServerForPlayback();
|
||||
}
|
||||
set(s => {
|
||||
const newServers = s.servers.filter(srv => srv.id !== id);
|
||||
const switchedAway = s.activeServerId === id;
|
||||
|
||||
@@ -12,7 +12,9 @@
|
||||
*/
|
||||
import { beforeEach, describe, expect, it } from 'vitest';
|
||||
import { useAuthStore } from './authStore';
|
||||
import { usePlayerStore } from './playerStore';
|
||||
import { resetAuthStore } from '@/test/helpers/storeReset';
|
||||
import { resetPlayerStore } from '@/test/helpers/storeReset';
|
||||
import { makeServer } from '@/test/helpers/factories';
|
||||
|
||||
function addThree(): { a: string; b: string; c: string } {
|
||||
@@ -24,6 +26,7 @@ function addThree(): { a: string; b: string; c: string } {
|
||||
|
||||
beforeEach(() => {
|
||||
resetAuthStore();
|
||||
resetPlayerStore();
|
||||
});
|
||||
|
||||
describe('addServer / updateServer', () => {
|
||||
@@ -122,6 +125,18 @@ describe('removeServer', () => {
|
||||
useAuthStore.getState().removeServer(a);
|
||||
expect(useAuthStore.getState().activeServerId).toBe(b);
|
||||
});
|
||||
|
||||
it('clears queueServerId when the removed server owned the playback queue', () => {
|
||||
const { a, b } = addThree();
|
||||
useAuthStore.getState().setActiveServer(b);
|
||||
usePlayerStore.setState({
|
||||
queue: [{ id: 't1', title: 'T', artist: 'A', album: 'Al', albumId: 'al1', duration: 100 }],
|
||||
queueServerId: a,
|
||||
queueIndex: 0,
|
||||
});
|
||||
useAuthStore.getState().removeServer(a);
|
||||
expect(usePlayerStore.getState().queueServerId).toBeNull();
|
||||
});
|
||||
});
|
||||
|
||||
describe('selectors — getBaseUrl / getActiveServer', () => {
|
||||
|
||||
@@ -4,6 +4,11 @@ import { lastfmGetTrackLoved, lastfmUpdateNowPlaying } from '../api/lastfm';
|
||||
import { setDeferHotCachePrefetch } from '../utils/cache/hotCacheGate';
|
||||
import { orbitBulkGuard } from '../utils/orbitBulkGuard';
|
||||
import { sameQueueTrackId } from '../utils/playback/queueIdentity';
|
||||
import {
|
||||
bindQueueServerForPlayback,
|
||||
getPlaybackServerId,
|
||||
shouldBindQueueServerForPlay,
|
||||
} from '../utils/playback/playbackServer';
|
||||
import { resolvePlaybackUrl } from '../utils/playback/resolvePlaybackUrl';
|
||||
import { resolveReplayGainDb } from '../utils/audio/resolveReplayGainDb';
|
||||
import { useAuthStore } from './authStore';
|
||||
@@ -173,6 +178,9 @@ export function runPlayTrack(
|
||||
setSeekFallbackVisualTarget(null);
|
||||
}
|
||||
const newQueue = queue ?? state.queue;
|
||||
if (shouldBindQueueServerForPlay(state.queue, newQueue, queue)) {
|
||||
bindQueueServerForPlayback();
|
||||
}
|
||||
// Prefer an explicit target index from the caller (next/previous/queue-row
|
||||
// click already know the exact slot). `findIndex` returns the *first*
|
||||
// matching id, which jumps backwards when the queue contains the same
|
||||
@@ -207,18 +215,19 @@ export function runPlayTrack(
|
||||
prevTrack
|
||||
&& sameQueueTrackId(prevTrack.id, track.id)
|
||||
&& authState.hotCacheEnabled
|
||||
&& authState.activeServerId,
|
||||
&& getPlaybackServerId(),
|
||||
);
|
||||
|
||||
const runPlayTrackBody = () => {
|
||||
const authStateNow = useAuthStore.getState();
|
||||
const url = resolvePlaybackUrl(track.id, authStateNow.activeServerId ?? '');
|
||||
const playbackSid = getPlaybackServerId();
|
||||
const url = resolvePlaybackUrl(track.id, playbackSid);
|
||||
recordEnginePlayUrl(track.id, url);
|
||||
const preloadedTrackId = get().enginePreloadedTrackId;
|
||||
const keepPreloadHint = preloadedTrackId === track.id;
|
||||
const playbackSourceHint = playbackSourceHintForResolvedUrl(
|
||||
track.id,
|
||||
authStateNow.activeServerId ?? '',
|
||||
playbackSid,
|
||||
url,
|
||||
);
|
||||
if (import.meta.env.DEV) {
|
||||
@@ -255,7 +264,7 @@ export function runPlayTrack(
|
||||
&& !sameQueueTrackId(prevTrack.id, track.id)
|
||||
&& authStateNow.hotCacheEnabled
|
||||
) {
|
||||
const prevPromoteSid = authStateNow.activeServerId;
|
||||
const prevPromoteSid = getPlaybackServerId();
|
||||
if (prevPromoteSid) {
|
||||
void promoteCompletedStreamToHotCache(
|
||||
prevTrack,
|
||||
@@ -326,7 +335,7 @@ export function runPlayTrack(
|
||||
|
||||
// Report Now Playing to Navidrome (for Live/getNowPlaying) + Last.fm
|
||||
const { nowPlayingEnabled: npEnabled, scrobblingEnabled: lfmEnabled, lastfmSessionKey: lfmKey } = useAuthStore.getState();
|
||||
if (npEnabled) reportNowPlaying(track.id);
|
||||
if (npEnabled) reportNowPlaying(track.id, getPlaybackServerId());
|
||||
if (lfmKey) {
|
||||
if (lfmEnabled) lastfmUpdateNowPlaying(track, lfmKey);
|
||||
lastfmGetTrackLoved(track.title, track.artist, lfmKey).then(loved => {
|
||||
@@ -338,10 +347,10 @@ export function runPlayTrack(
|
||||
});
|
||||
}
|
||||
syncQueueToServer(newQueue, track, initialTime);
|
||||
touchHotCacheOnPlayback(track.id, authStateNow.activeServerId ?? '');
|
||||
touchHotCacheOnPlayback(track.id, playbackSid);
|
||||
};
|
||||
|
||||
const hotPromoteSid = authState.activeServerId;
|
||||
const hotPromoteSid = getPlaybackServerId();
|
||||
if (needSameTrackHotPromote && hotPromoteSid) {
|
||||
void promoteCompletedStreamToHotCache(
|
||||
track,
|
||||
|
||||
@@ -44,6 +44,16 @@ vi.mock('@/api/subsonicScrobble', () => ({
|
||||
reportNowPlaying: vi.fn(async () => undefined),
|
||||
scrobbleSong: vi.fn(async () => undefined),
|
||||
}));
|
||||
vi.mock('@/utils/playback/playbackServer', () => ({
|
||||
getPlaybackServerId: () => 'srv-test',
|
||||
bindQueueServerForPlayback: vi.fn(),
|
||||
clearQueueServerForPlayback: vi.fn(),
|
||||
playbackServerDiffersFromActive: () => false,
|
||||
playbackCoverArtForId: (id: string, size: number) => ({
|
||||
src: `https://mock/cover/${id}?size=${size}`,
|
||||
cacheKey: `mock:cover:${id}:${size}`,
|
||||
}),
|
||||
}));
|
||||
vi.mock('@/api/subsonicStarRating', () => ({
|
||||
setRating: vi.fn(async () => undefined),
|
||||
probeEntityRatingSupport: vi.fn(async () => 'track_only'),
|
||||
@@ -116,6 +126,7 @@ describe('flushPlayQueuePosition', () => {
|
||||
[t1.id, t2.id, t3.id],
|
||||
t2.id,
|
||||
12345, // Math.floor(12.345 * 1000)
|
||||
'srv-test',
|
||||
);
|
||||
});
|
||||
|
||||
|
||||
@@ -36,6 +36,7 @@ export const usePlayerStore = create<PlayerState>()(
|
||||
currentPlaybackSource: null,
|
||||
enginePreloadedTrackId: null,
|
||||
queue: [],
|
||||
queueServerId: null,
|
||||
queueIndex: 0,
|
||||
isPlaying: false,
|
||||
progress: 0,
|
||||
@@ -81,6 +82,7 @@ export const usePlayerStore = create<PlayerState>()(
|
||||
repeatMode: state.repeatMode,
|
||||
currentTrack: state.currentTrack,
|
||||
queue: state.queue,
|
||||
queueServerId: state.queueServerId,
|
||||
queueIndex: state.queueIndex,
|
||||
isQueueVisible: state.isQueueVisible,
|
||||
// currentTime is intentionally NOT persisted here.
|
||||
|
||||
@@ -55,6 +55,8 @@ export interface PlayerState {
|
||||
*/
|
||||
enginePreloadedTrackId: string | null;
|
||||
queue: Track[];
|
||||
/** Saved server for stream/hot-cache/offline resolution while this queue plays. */
|
||||
queueServerId: string | null;
|
||||
queueIndex: number;
|
||||
isPlaying: boolean;
|
||||
progress: number; // 0–1
|
||||
@@ -171,8 +173,20 @@ export interface PlayerState {
|
||||
* list/grid to copy a `composer` link from the otherwise artist-typed
|
||||
* context menu, so paste lands on /composer/:id instead of /artist/:id. */
|
||||
shareKindOverride?: 'track' | 'album' | 'artist' | 'composer';
|
||||
/** Menu actions target {@link queueServerId} (set for queue-item and player-sourced album menus). */
|
||||
pinToPlaybackServer?: boolean;
|
||||
};
|
||||
openContextMenu: (x: number, y: number, item: any, type: 'song' | 'favorite-song' | 'album' | 'artist' | 'queue-item' | 'album-song' | 'playlist' | 'multi-album' | 'multi-artist' | 'multi-playlist', queueIndex?: number, playlistId?: string, playlistSongIndex?: number, shareKindOverride?: 'track' | 'album' | 'artist' | 'composer') => void;
|
||||
openContextMenu: (
|
||||
x: number,
|
||||
y: number,
|
||||
item: any,
|
||||
type: 'song' | 'favorite-song' | 'album' | 'artist' | 'queue-item' | 'album-song' | 'playlist' | 'multi-album' | 'multi-artist' | 'multi-playlist',
|
||||
queueIndex?: number,
|
||||
playlistId?: string,
|
||||
playlistSongIndex?: number,
|
||||
shareKindOverride?: 'track' | 'album' | 'artist' | 'composer',
|
||||
pinToPlaybackServer?: boolean,
|
||||
) => void;
|
||||
closeContextMenu: () => void;
|
||||
|
||||
songInfoModal: { isOpen: boolean; songId: string | null };
|
||||
|
||||
@@ -13,7 +13,10 @@ const { invokeMock, setEntryMock, buildStreamUrlMock } = vi.hoisted(() => ({
|
||||
}));
|
||||
|
||||
vi.mock('@tauri-apps/api/core', () => ({ invoke: invokeMock }));
|
||||
vi.mock('../api/subsonicStreamUrl', () => ({ buildStreamUrl: buildStreamUrlMock }));
|
||||
vi.mock('../api/subsonicStreamUrl', () => ({
|
||||
buildStreamUrl: buildStreamUrlMock,
|
||||
buildStreamUrlForServer: (_serverId: string, id: string) => buildStreamUrlMock(id),
|
||||
}));
|
||||
vi.mock('./hotCacheStore', () => ({
|
||||
useHotCacheStore: { getState: () => ({ setEntry: setEntryMock }) },
|
||||
}));
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { buildStreamUrl } from '../api/subsonicStreamUrl';
|
||||
import { buildStreamUrlForServer } from '../api/subsonicStreamUrl';
|
||||
import type { Track } from './playerStoreTypes';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { useHotCacheStore } from './hotCacheStore';
|
||||
@@ -25,7 +25,7 @@ export async function promoteCompletedStreamToHotCache(
|
||||
{
|
||||
trackId: track.id,
|
||||
serverId,
|
||||
url: buildStreamUrl(track.id),
|
||||
url: buildStreamUrlForServer(serverId, track.id),
|
||||
suffix: track.suffix || 'mp3',
|
||||
customDir,
|
||||
},
|
||||
|
||||
@@ -17,12 +17,21 @@ import {
|
||||
import { clearSeekDebounce } from './seekDebounce';
|
||||
import { clearSeekFallbackRetry } from './seekFallbackState';
|
||||
import { clearSeekTarget } from './seekTargetState';
|
||||
import i18n from '../i18n';
|
||||
import { playbackServerDiffersFromActive, clearQueueServerForPlayback } from '../utils/playback/playbackServer';
|
||||
import { showToast } from '../utils/ui/toast';
|
||||
|
||||
type SetState = (
|
||||
partial: Partial<PlayerState> | ((state: PlayerState) => Partial<PlayerState>),
|
||||
) => void;
|
||||
type GetState = () => PlayerState;
|
||||
|
||||
function blockCrossServerEnqueue(): boolean {
|
||||
if (!playbackServerDiffersFromActive()) return false;
|
||||
showToast(i18n.t('queue.crossServerEnqueueBlocked'), 4500, 'error');
|
||||
return true;
|
||||
}
|
||||
|
||||
/**
|
||||
* Eleven queue-mutation actions. Shared invariant: every action except
|
||||
* `setRadioArtistId` pushes a queue-undo snapshot and calls
|
||||
@@ -44,6 +53,7 @@ export function createQueueMutationActions(set: SetState, get: GetState): Pick<
|
||||
> {
|
||||
return {
|
||||
enqueue: (tracks, _orbitConfirmed = false) => {
|
||||
if (blockCrossServerEnqueue()) return;
|
||||
if (!_orbitConfirmed && tracks.length > 1) {
|
||||
void orbitBulkGuard(tracks.length).then(ok => {
|
||||
if (ok) get().enqueue(tracks, true);
|
||||
@@ -129,6 +139,7 @@ export function createQueueMutationActions(set: SetState, get: GetState): Pick<
|
||||
},
|
||||
|
||||
enqueueAt: (tracks, insertIndex, _orbitConfirmed = false) => {
|
||||
if (blockCrossServerEnqueue()) return;
|
||||
if (!_orbitConfirmed && tracks.length > 1) {
|
||||
void orbitBulkGuard(tracks.length).then(ok => {
|
||||
if (ok) get().enqueueAt(tracks, insertIndex, true);
|
||||
@@ -154,6 +165,7 @@ export function createQueueMutationActions(set: SetState, get: GetState): Pick<
|
||||
|
||||
playNext: (tracks) => {
|
||||
if (tracks.length === 0) return;
|
||||
if (blockCrossServerEnqueue()) return;
|
||||
const state = get();
|
||||
const tagged = tracks.map(t => ({ ...t, playNextAdded: true as const }));
|
||||
if (!state.currentTrack) {
|
||||
@@ -197,6 +209,7 @@ export function createQueueMutationActions(set: SetState, get: GetState): Pick<
|
||||
clearSeekDebounce(); clearSeekTarget();
|
||||
clearRadioSessionSeenIds();
|
||||
setCurrentRadioArtistId(null);
|
||||
clearQueueServerForPlayback();
|
||||
set({ queue: [], queueIndex: 0, currentTrack: null, isPlaying: false, progress: 0, buffered: 0, currentTime: 0 });
|
||||
syncQueueToServer([], null, 0);
|
||||
},
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
import type { Track } from './playerStoreTypes';
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
const { savePlayQueueMock, playerState, progressSnapshot } = vi.hoisted(() => ({
|
||||
savePlayQueueMock: vi.fn(async (_ids: string[], _currentId: string | undefined, _pos: number) => undefined),
|
||||
savePlayQueueMock: vi.fn(async (_ids: string[], _currentId: string | undefined, _pos: number, _serverId: string) => undefined),
|
||||
playerState: {
|
||||
queue: [] as Track[],
|
||||
currentTrack: null as Track | null,
|
||||
@@ -18,6 +18,9 @@ const { savePlayQueueMock, playerState, progressSnapshot } = vi.hoisted(() => ({
|
||||
}));
|
||||
|
||||
vi.mock('../api/subsonicPlayQueue', () => ({ savePlayQueue: savePlayQueueMock }));
|
||||
vi.mock('../utils/playback/playbackServer', () => ({
|
||||
getPlaybackServerId: () => 'srv-a',
|
||||
}));
|
||||
vi.mock('./playerStore', () => ({
|
||||
usePlayerStore: { getState: () => playerState },
|
||||
}));
|
||||
@@ -65,7 +68,7 @@ describe('syncQueueToServer (debounced)', () => {
|
||||
it('fires once after 5 s with id list + current id + position in ms', () => {
|
||||
syncQueueToServer(queue, queue[0], 30);
|
||||
vi.advanceTimersByTime(5000);
|
||||
expect(savePlayQueueMock).toHaveBeenCalledWith(['a', 'b'], 'a', 30000);
|
||||
expect(savePlayQueueMock).toHaveBeenCalledWith(['a', 'b'], 'a', 30000, 'srv-a');
|
||||
});
|
||||
|
||||
it('cancels the previous timer when called again before fire', () => {
|
||||
@@ -74,7 +77,7 @@ describe('syncQueueToServer (debounced)', () => {
|
||||
syncQueueToServer([...queue, track('c')], queue[0], 20);
|
||||
vi.advanceTimersByTime(5000);
|
||||
expect(savePlayQueueMock).toHaveBeenCalledTimes(1);
|
||||
expect(savePlayQueueMock).toHaveBeenCalledWith(['a', 'b', 'c'], 'a', 20000);
|
||||
expect(savePlayQueueMock).toHaveBeenCalledWith(['a', 'b', 'c'], 'a', 20000, 'srv-a');
|
||||
});
|
||||
|
||||
it('caps the queue at 1000 ids', () => {
|
||||
@@ -91,7 +94,7 @@ describe('syncQueueToServer (debounced)', () => {
|
||||
describe('flushQueueSyncToServer (immediate)', () => {
|
||||
it('fires synchronously with no debounce', async () => {
|
||||
await flushQueueSyncToServer([track('a')], track('a'), 12);
|
||||
expect(savePlayQueueMock).toHaveBeenCalledWith(['a'], 'a', 12000);
|
||||
expect(savePlayQueueMock).toHaveBeenCalledWith(['a'], 'a', 12000, 'srv-a');
|
||||
});
|
||||
|
||||
it('cancels a pending debounced sync first', async () => {
|
||||
@@ -126,7 +129,7 @@ describe('flushPlayQueuePosition', () => {
|
||||
playerState.currentTrack = playerState.queue[0];
|
||||
progressSnapshot.currentTime = 42;
|
||||
await flushPlayQueuePosition();
|
||||
expect(savePlayQueueMock).toHaveBeenCalledWith(['a', 'b'], 'a', 42000);
|
||||
expect(savePlayQueueMock).toHaveBeenCalledWith(['a', 'b'], 'a', 42000, 'srv-a');
|
||||
});
|
||||
|
||||
it('is a no-op when a radio session is active', async () => {
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { savePlayQueue } from '../api/subsonicPlayQueue';
|
||||
import type { Track } from './playerStoreTypes';
|
||||
import { getPlaybackServerId } from '../utils/playback/playbackServer';
|
||||
import { getPlaybackProgressSnapshot } from './playbackProgress';
|
||||
import { usePlayerStore } from './playerStore';
|
||||
/**
|
||||
@@ -31,7 +32,8 @@ export function syncQueueToServer(queue: Track[], currentTrack: Track | null, cu
|
||||
syncTimeout = null;
|
||||
const ids = queue.slice(0, QUEUE_ID_LIMIT).map(t => t.id);
|
||||
const pos = Math.floor(currentTime * 1000);
|
||||
savePlayQueue(ids, currentTrack?.id, pos).catch(err => {
|
||||
const serverId = getPlaybackServerId();
|
||||
savePlayQueue(ids, currentTrack?.id, pos, serverId).catch(err => {
|
||||
console.error('Failed to sync play queue to server', err);
|
||||
});
|
||||
}, SYNC_DEBOUNCE_MS);
|
||||
@@ -46,7 +48,8 @@ export function flushQueueSyncToServer(queue: Track[], currentTrack: Track | nul
|
||||
lastQueueHeartbeatAt = Date.now();
|
||||
const ids = queue.slice(0, QUEUE_ID_LIMIT).map(t => t.id);
|
||||
const pos = Math.floor(currentTime * 1000);
|
||||
return savePlayQueue(ids, currentTrack.id, pos).catch(err => {
|
||||
const serverId = getPlaybackServerId();
|
||||
return savePlayQueue(ids, currentTrack.id, pos, serverId).catch(err => {
|
||||
console.error('Failed to flush play queue to server', err);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import type { Track } from './playerStoreTypes';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { setDeferHotCachePrefetch } from '../utils/cache/hotCacheGate';
|
||||
import { getPlaybackServerId } from '../utils/playback/playbackServer';
|
||||
import { resolvePlaybackUrl } from '../utils/playback/resolvePlaybackUrl';
|
||||
import { resolveReplayGainDb } from '../utils/audio/resolveReplayGainDb';
|
||||
import { useAuthStore } from './authStore';
|
||||
@@ -38,10 +39,11 @@ export function queueUndoRestoreAudioEngine(opts: {
|
||||
isReplayGainActive(), authState.replayGainMode,
|
||||
);
|
||||
const replayGainPeak = isReplayGainActive() ? (track.replayGainPeak ?? null) : null;
|
||||
const url = resolvePlaybackUrl(track.id, authState.activeServerId ?? '');
|
||||
const playbackSid = getPlaybackServerId();
|
||||
const url = resolvePlaybackUrl(track.id, playbackSid);
|
||||
recordEnginePlayUrl(track.id, url);
|
||||
usePlayerStore.setState({
|
||||
currentPlaybackSource: playbackSourceHintForResolvedUrl(track.id, authState.activeServerId ?? '', url),
|
||||
currentPlaybackSource: playbackSourceHintForResolvedUrl(track.id, playbackSid, url),
|
||||
});
|
||||
const keepPreloadHint = usePlayerStore.getState().enginePreloadedTrackId === track.id;
|
||||
setDeferHotCachePrefetch(true);
|
||||
@@ -91,5 +93,5 @@ export function queueUndoRestoreAudioEngine(opts: {
|
||||
.finally(() => {
|
||||
setDeferHotCachePrefetch(false);
|
||||
});
|
||||
touchHotCacheOnPlayback(track.id, authState.activeServerId ?? '');
|
||||
touchHotCacheOnPlayback(track.id, getPlaybackServerId());
|
||||
}
|
||||
|
||||
@@ -2,6 +2,7 @@ import { getSong } from '../api/subsonicLibrary';
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { estimateLivePosition } from '../api/orbit';
|
||||
import { setDeferHotCachePrefetch } from '../utils/cache/hotCacheGate';
|
||||
import { getPlaybackServerId } from '../utils/playback/playbackServer';
|
||||
import { resolvePlaybackUrl } from '../utils/playback/resolvePlaybackUrl';
|
||||
import { resolveReplayGainDb } from '../utils/audio/resolveReplayGainDb';
|
||||
import { songToTrack } from '../utils/playback/songToTrack';
|
||||
@@ -117,7 +118,7 @@ export function runResume(set: SetState, get: GetState): void {
|
||||
invoke('audio_resume').catch(console.error);
|
||||
setIsAudioPaused(false);
|
||||
set({ isPlaying: true });
|
||||
touchHotCacheOnPlayback(currentTrack.id, useAuthStore.getState().activeServerId ?? '');
|
||||
touchHotCacheOnPlayback(currentTrack.id, getPlaybackServerId());
|
||||
} else {
|
||||
// Engine has no loaded paused stream (app relaunch, or track ended and user
|
||||
// hits play — `isAudioPaused` is false after `audio:ended`). Flush any
|
||||
@@ -128,7 +129,7 @@ export function runResume(set: SetState, get: GetState): void {
|
||||
|
||||
void (async () => {
|
||||
const authHot = useAuthStore.getState();
|
||||
const resumePromoteSid = authHot.activeServerId;
|
||||
const resumePromoteSid = getPlaybackServerId();
|
||||
if (authHot.hotCacheEnabled && resumePromoteSid) {
|
||||
await promoteCompletedStreamToHotCache(
|
||||
currentTrack,
|
||||
@@ -150,7 +151,7 @@ export function runResume(set: SetState, get: GetState): void {
|
||||
isReplayGainActive(), authStateCold.replayGainMode,
|
||||
);
|
||||
const replayGainPeakCold = isReplayGainActive() ? (trackToPlay.replayGainPeak ?? null) : null;
|
||||
const coldServerId = useAuthStore.getState().activeServerId ?? '';
|
||||
const coldServerId = getPlaybackServerId();
|
||||
setDeferHotCachePrefetch(true);
|
||||
const coldUrl = resolvePlaybackUrl(trackToPlay.id, coldServerId);
|
||||
set({ currentPlaybackSource: playbackSourceHintForResolvedUrl(trackToPlay.id, coldServerId, coldUrl) });
|
||||
@@ -189,7 +190,7 @@ export function runResume(set: SetState, get: GetState): void {
|
||||
isReplayGainActive(), authStateCold.replayGainMode,
|
||||
);
|
||||
const replayGainPeakCold = isReplayGainActive() ? (currentTrack.replayGainPeak ?? null) : null;
|
||||
const coldServerId = useAuthStore.getState().activeServerId ?? '';
|
||||
const coldServerId = getPlaybackServerId();
|
||||
setDeferHotCachePrefetch(true);
|
||||
const coldUrl = resolvePlaybackUrl(currentTrack.id, coldServerId);
|
||||
set({ currentPlaybackSource: playbackSourceHintForResolvedUrl(currentTrack.id, coldServerId, coldUrl) });
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { invoke } from '@tauri-apps/api/core';
|
||||
import { isRecoverableSeekError } from '../utils/audio/seekErrors';
|
||||
import { getPlaybackServerId } from '../utils/playback/playbackServer';
|
||||
import { useAuthStore } from './authStore';
|
||||
import { shouldRebindPlaybackToHotCache } from './playbackUrlRouting';
|
||||
import type { PlayerState } from './playerStoreTypes';
|
||||
@@ -47,8 +48,7 @@ export function runSeek(set: SetState, get: GetState, progress: number): void {
|
||||
armSeekDebounce(100, () => {
|
||||
const s0 = get();
|
||||
if (!s0.currentTrack) return;
|
||||
const authSeek = useAuthStore.getState();
|
||||
const sidSeek = authSeek.activeServerId ?? '';
|
||||
const sidSeek = getPlaybackServerId();
|
||||
if (shouldRebindPlaybackToHotCache(s0.currentTrack.id, sidSeek)) {
|
||||
setSeekFallbackVisualTarget({
|
||||
trackId: s0.currentTrack.id,
|
||||
|
||||
@@ -2,6 +2,10 @@ import {
|
||||
persistQueueVisibility,
|
||||
} from './queueVisibilityStorage';
|
||||
import type { PlayerState } from './playerStoreTypes';
|
||||
import {
|
||||
ensurePlaybackServerActive,
|
||||
playbackServerDiffersFromActive,
|
||||
} from '../utils/playback/playbackServer';
|
||||
|
||||
type SetState = (
|
||||
partial: Partial<PlayerState> | ((state: PlayerState) => Partial<PlayerState>),
|
||||
@@ -41,10 +45,31 @@ export function createUiStateActions(set: SetState): Pick<
|
||||
};
|
||||
}),
|
||||
|
||||
openContextMenu: (x, y, item, type, queueIndex, playlistId, playlistSongIndex, shareKindOverride) =>
|
||||
set({
|
||||
contextMenu: { isOpen: true, x, y, item, type, queueIndex, playlistId, playlistSongIndex, shareKindOverride },
|
||||
}),
|
||||
openContextMenu: (x, y, item, type, queueIndex, playlistId, playlistSongIndex, shareKindOverride, pinToPlaybackServer) => {
|
||||
const pin = pinToPlaybackServer ?? type === 'queue-item';
|
||||
const open = () =>
|
||||
set({
|
||||
contextMenu: {
|
||||
isOpen: true,
|
||||
x,
|
||||
y,
|
||||
item,
|
||||
type,
|
||||
queueIndex,
|
||||
playlistId,
|
||||
playlistSongIndex,
|
||||
shareKindOverride,
|
||||
pinToPlaybackServer: pin,
|
||||
},
|
||||
});
|
||||
if (pin && playbackServerDiffersFromActive()) {
|
||||
void ensurePlaybackServerActive().then(ok => {
|
||||
if (ok) open();
|
||||
});
|
||||
return;
|
||||
}
|
||||
open();
|
||||
},
|
||||
|
||||
closeContextMenu: () =>
|
||||
set(state => ({
|
||||
|
||||
@@ -58,6 +58,7 @@ export function initialSnapshot(): MiniSyncPayload {
|
||||
track: s.currentTrack ? toMini(s.currentTrack) : null,
|
||||
queue: (s.queue ?? []).map(toMini),
|
||||
queueIndex: s.queueIndex ?? 0,
|
||||
queueServerId: s.queueServerId ?? null,
|
||||
isPlaying: s.isPlaying,
|
||||
volume: s.volume ?? 1,
|
||||
gaplessEnabled: false,
|
||||
@@ -67,7 +68,7 @@ export function initialSnapshot(): MiniSyncPayload {
|
||||
};
|
||||
} catch {
|
||||
return {
|
||||
track: null, queue: [], queueIndex: 0, isPlaying: false,
|
||||
track: null, queue: [], queueIndex: 0, queueServerId: null, isPlaying: false,
|
||||
volume: 1, gaplessEnabled: false, crossfadeEnabled: false,
|
||||
infiniteQueueEnabled: false, isMobile: false,
|
||||
};
|
||||
|
||||
@@ -25,6 +25,7 @@ export interface MiniSyncPayload {
|
||||
track: MiniTrackInfo | null;
|
||||
queue: MiniTrackInfo[];
|
||||
queueIndex: number;
|
||||
queueServerId: string | null;
|
||||
isPlaying: boolean;
|
||||
volume: number;
|
||||
gaplessEnabled: boolean;
|
||||
@@ -62,6 +63,7 @@ function snapshot(): MiniSyncPayload {
|
||||
track: s.currentTrack ? toMini(s.currentTrack) : null,
|
||||
queue: (s.queue ?? []).map(toMini),
|
||||
queueIndex: s.queueIndex ?? 0,
|
||||
queueServerId: s.queueServerId ?? null,
|
||||
isPlaying: s.isPlaying,
|
||||
volume: s.volume,
|
||||
gaplessEnabled: !!a.gaplessEnabled,
|
||||
@@ -93,6 +95,7 @@ export function initMiniPlayerBridgeOnMain(): () => void {
|
||||
payload.track?.starred ?? '',
|
||||
(payload.track?.artists ?? []).map((a: SubsonicOpenArtistRef) => a.id ?? a.name).join('|'),
|
||||
payload.queueIndex,
|
||||
payload.queueServerId ?? '',
|
||||
payload.volume,
|
||||
payload.gaplessEnabled,
|
||||
payload.crossfadeEnabled,
|
||||
@@ -110,6 +113,7 @@ export function initMiniPlayerBridgeOnMain(): () => void {
|
||||
|| state.currentTrack?.starred !== prev.currentTrack?.starred
|
||||
|| state.queueIndex !== prev.queueIndex
|
||||
|| state.queue !== prev.queue
|
||||
|| state.queueServerId !== prev.queueServerId
|
||||
|| state.volume !== prev.volume) {
|
||||
push();
|
||||
}
|
||||
|
||||
@@ -0,0 +1,86 @@
|
||||
import { describe, expect, it, beforeEach } from 'vitest';
|
||||
import { useAuthStore } from '../../store/authStore';
|
||||
import { usePlayerStore } from '../../store/playerStore';
|
||||
import {
|
||||
bindQueueServerForPlayback,
|
||||
clearQueueServerForPlayback,
|
||||
ensurePlaybackServerActive,
|
||||
getPlaybackServerId,
|
||||
playbackCoverArtForId,
|
||||
playbackServerDiffersFromActive,
|
||||
shouldBindQueueServerForPlay,
|
||||
} from './playbackServer';
|
||||
import { vi } from 'vitest';
|
||||
|
||||
vi.mock('../server/switchActiveServer', () => ({
|
||||
switchActiveServer: vi.fn(async () => true),
|
||||
}));
|
||||
|
||||
describe('playbackServer', () => {
|
||||
beforeEach(() => {
|
||||
useAuthStore.setState({
|
||||
servers: [
|
||||
{ id: 'a', name: 'A', url: 'http://a.test', username: 'u', password: 'p' },
|
||||
{ id: 'b', name: 'B', url: 'http://b.test', username: 'u', password: 'p' },
|
||||
],
|
||||
activeServerId: 'a',
|
||||
isLoggedIn: true,
|
||||
});
|
||||
usePlayerStore.setState({
|
||||
queue: [{ id: 't1', title: 'T', artist: 'A', album: 'Al', albumId: 'al1', duration: 100 }],
|
||||
queueServerId: 'a',
|
||||
queueIndex: 0,
|
||||
});
|
||||
});
|
||||
|
||||
it('getPlaybackServerId returns queue server while queue is non-empty', () => {
|
||||
useAuthStore.setState({ activeServerId: 'b' });
|
||||
expect(getPlaybackServerId()).toBe('a');
|
||||
});
|
||||
|
||||
it('getPlaybackServerId falls back to active when queue is empty', () => {
|
||||
clearQueueServerForPlayback();
|
||||
usePlayerStore.setState({ queue: [] });
|
||||
useAuthStore.setState({ activeServerId: 'b' });
|
||||
expect(getPlaybackServerId()).toBe('b');
|
||||
});
|
||||
|
||||
it('bindQueueServerForPlayback pins active server', () => {
|
||||
useAuthStore.setState({ activeServerId: 'b' });
|
||||
bindQueueServerForPlayback();
|
||||
expect(usePlayerStore.getState().queueServerId).toBe('b');
|
||||
});
|
||||
|
||||
it('playbackServerDiffersFromActive when queue server != active', () => {
|
||||
useAuthStore.setState({ activeServerId: 'b' });
|
||||
expect(playbackServerDiffersFromActive()).toBe(true);
|
||||
usePlayerStore.setState({ queue: [] });
|
||||
expect(playbackServerDiffersFromActive()).toBe(false);
|
||||
});
|
||||
|
||||
it('ensurePlaybackServerActive calls switch when servers differ', async () => {
|
||||
const { switchActiveServer } = await import('../server/switchActiveServer');
|
||||
useAuthStore.setState({ activeServerId: 'b' });
|
||||
await ensurePlaybackServerActive();
|
||||
expect(switchActiveServer).toHaveBeenCalledWith(
|
||||
expect.objectContaining({ id: 'a' }),
|
||||
);
|
||||
});
|
||||
|
||||
it('playbackCoverArtForId uses queue server credentials when browsing another server', () => {
|
||||
useAuthStore.setState({ activeServerId: 'b' });
|
||||
const { src, cacheKey } = playbackCoverArtForId('cov1', 128);
|
||||
expect(src).toContain('a.test');
|
||||
expect(cacheKey).toBe('a:cover:cov1:128');
|
||||
});
|
||||
|
||||
it('shouldBindQueueServerForPlay detects queue replacement', () => {
|
||||
const prev = [{ id: 't1', title: 'T', artist: 'A', album: 'Al', albumId: 'al1', duration: 100 }];
|
||||
const next = [
|
||||
{ id: 't1', title: 'T', artist: 'A', album: 'Al', albumId: 'al1', duration: 100 },
|
||||
{ id: 't2', title: 'T2', artist: 'A', album: 'Al', albumId: 'al1', duration: 100 },
|
||||
];
|
||||
expect(shouldBindQueueServerForPlay(prev, next, next)).toBe(true);
|
||||
expect(shouldBindQueueServerForPlay(prev, prev, undefined)).toBe(false);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,75 @@
|
||||
import {
|
||||
buildCoverArtUrl,
|
||||
buildCoverArtUrlForServer,
|
||||
coverArtCacheKey,
|
||||
coverArtCacheKeyForServer,
|
||||
} from '../../api/subsonicStreamUrl';
|
||||
import { useAuthStore } from '../../store/authStore';
|
||||
import { usePlayerStore } from '../../store/playerStore';
|
||||
import { switchActiveServer } from '../server/switchActiveServer';
|
||||
import { sameQueueTrackId } from './queueIdentity';
|
||||
import type { Track } from '../../store/playerStoreTypes';
|
||||
|
||||
/** Server that owns the current queue / stream URLs (may differ from the browsed server). */
|
||||
export function getPlaybackServerId(): string {
|
||||
const { queueServerId, queue } = usePlayerStore.getState();
|
||||
if ((queue?.length ?? 0) > 0 && queueServerId) return queueServerId;
|
||||
return useAuthStore.getState().activeServerId ?? '';
|
||||
}
|
||||
|
||||
export function bindQueueServerForPlayback(): void {
|
||||
const sid = useAuthStore.getState().activeServerId;
|
||||
if (!sid) return;
|
||||
usePlayerStore.setState({ queueServerId: sid });
|
||||
}
|
||||
|
||||
export function clearQueueServerForPlayback(): void {
|
||||
usePlayerStore.setState({ queueServerId: null });
|
||||
}
|
||||
|
||||
export function playbackServerDiffersFromActive(): boolean {
|
||||
const { queueServerId, queue } = usePlayerStore.getState();
|
||||
if ((queue?.length ?? 0) === 0 || !queueServerId) return false;
|
||||
const activeSid = useAuthStore.getState().activeServerId;
|
||||
return !!activeSid && queueServerId !== activeSid;
|
||||
}
|
||||
|
||||
/** Switch the browsed server to the queue server when they differ (e.g. artist/album links). */
|
||||
export async function ensurePlaybackServerActive(): Promise<boolean> {
|
||||
if (!playbackServerDiffersFromActive()) return true;
|
||||
const playbackSid = getPlaybackServerId();
|
||||
const server = useAuthStore.getState().servers.find(s => s.id === playbackSid);
|
||||
if (!server) return false;
|
||||
return switchActiveServer(server);
|
||||
}
|
||||
|
||||
/** Cover URLs for queue / player UI when playback uses a non-active saved server. */
|
||||
export function playbackCoverArtForId(coverId: string, size: number): { src: string; cacheKey: string } {
|
||||
const playbackSid = getPlaybackServerId();
|
||||
const activeSid = useAuthStore.getState().activeServerId;
|
||||
if (playbackSid && activeSid && playbackSid !== activeSid) {
|
||||
const server = useAuthStore.getState().servers.find(s => s.id === playbackSid);
|
||||
if (server) {
|
||||
return {
|
||||
src: buildCoverArtUrlForServer(server.url, server.username, server.password, coverId, size),
|
||||
cacheKey: coverArtCacheKeyForServer(server.id, coverId, size),
|
||||
};
|
||||
}
|
||||
}
|
||||
return {
|
||||
src: buildCoverArtUrl(coverId, size),
|
||||
cacheKey: coverArtCacheKey(coverId, size),
|
||||
};
|
||||
}
|
||||
|
||||
export function shouldBindQueueServerForPlay(
|
||||
prevQueue: Track[],
|
||||
newQueue: Track[],
|
||||
explicitQueueArg: Track[] | undefined,
|
||||
): boolean {
|
||||
if (newQueue.length === 0) return false;
|
||||
if (prevQueue.length === 0) return true;
|
||||
if (explicitQueueArg === undefined) return false;
|
||||
if (explicitQueueArg.length !== prevQueue.length) return true;
|
||||
return !explicitQueueArg.every((t, i) => sameQueueTrackId(prevQueue[i]?.id, t.id));
|
||||
}
|
||||
@@ -1,6 +1,7 @@
|
||||
import { buildStreamUrl } from '../../api/subsonicStreamUrl';
|
||||
import { buildStreamUrlForServer } from '../../api/subsonicStreamUrl';
|
||||
import { useOfflineStore } from '../../store/offlineStore';
|
||||
import { useHotCacheStore } from '../../store/hotCacheStore';
|
||||
import { getPlaybackServerId } from './playbackServer';
|
||||
|
||||
/** Same resolution order as {@link resolvePlaybackUrl} — for UI hints only. */
|
||||
export type PlaybackSourceKind = 'offline' | 'hot' | 'stream';
|
||||
@@ -54,10 +55,11 @@ export function getPlaybackSourceKind(
|
||||
}
|
||||
|
||||
/** Offline library → hot playback cache → HTTP stream. */
|
||||
export function resolvePlaybackUrl(trackId: string, serverId: string): string {
|
||||
const offline = useOfflineStore.getState().getLocalUrl(trackId, serverId);
|
||||
export function resolvePlaybackUrl(trackId: string, serverId?: string): string {
|
||||
const sid = serverId && serverId.length > 0 ? serverId : getPlaybackServerId();
|
||||
const offline = useOfflineStore.getState().getLocalUrl(trackId, sid);
|
||||
if (offline) return offline;
|
||||
const hot = useHotCacheStore.getState().getLocalUrl(trackId, serverId);
|
||||
const hot = useHotCacheStore.getState().getLocalUrl(trackId, sid);
|
||||
if (hot) return hot;
|
||||
return buildStreamUrl(trackId);
|
||||
return buildStreamUrlForServer(sid, trackId);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user