mirror of
https://github.com/kilyabin/psysonic.git
synced 2026-07-22 06:25:41 +00:00
feat(albums): combined browse filters, favorites reconcile, and session restore (#876)
* feat(albums): persist browse sort and genre filter for the session Keep Albums sort and genre selection in an in-memory Zustand store so navigating into album detail and back no longer resets browse context. Fixes #875 (partial). * feat(albums): restore browse filters only when returning from album detail Keep sort in the session store for the app lifetime. Stash genre, year, compilation, starred, and lossless filters when leaving Albums for an album page and restore them on POP (back). Clear the stash when opening Albums from elsewhere via sidebar navigation. * feat(albums): filter quick-clear chips; fix lossless A–Z sort Add inline × on active toolbar filters (genre, year, favorites, lossless, compilations) without opening the popover. Route lossless album browse through advanced search with album sort clauses on Albums and Lossless Albums; client-sort on the network fallback path. * fix(albums): apply year filter when only from or to is set Resolve open-ended year bounds with gte/lte on the local index and partial fromYear/toYear on Subsonic. Update the year filter chip label for single-bound ranges. * refactor(albums): combine browse filters in one query (genre + year + lossless) Replace mutually exclusive load/loadFiltered branches with fetchAlbumBrowsePage that ANDs server-side filters on the local index (genre OR union). Network fallback applies year bounds after genre fetch. Always show sort while a year filter is active. * fix(albums): load favorites filter server-side instead of scanning all albums Starred on Albums was client-only: each page was filtered locally and pendingClientFilterMatch kept paginating the full catalog. Query starred albums via the local index or getAlbumList(starred); apply overrides only for in-session star/unstar. * feat(library): local album/artist favorites via patch-on-use Mirror album- and artist-level stars into the library index (library_patch_album, library_patch_artist, migration 010). Albums and Artists favorites browse use entity starred_at only; normal album catalog stays track-derived so patch stubs do not hide the library. Keep album year on favorite cards via track COALESCE, patch metadata, and safer raw_json merge. * fix(library): reconcile album/artist stars from server, drop stubs Favorites browse uses getAlbumList/getStarred2 as source of truth. library_reconcile_*_stars clears local stars removed elsewhere; patch-on-use updates existing rows only (no stub INSERT). Reconcile on favorites load and after star/unstar in-app. * feat(albums): favorites reconcile, filter combos, and back-navigation fix Album browse keeps filter state when returning from album detail (POP stash read on mount, request-generation guard against stale loads). Favorites use getStarred2 as source of truth: reconcile album.starred_at in the local index (UPDATE only, no stub rows), with a small session cache for instant paint. Combine favorites with lossless or genre via restrictAlbumIds in advanced search. Remove album/artist patch-on-use and migration 010; artist favorites stay network-only. Track patch-on-use unchanged. * feat(albums): catalog year bounds and genre list narrowed by filters Year filter spinners use min/max years from the local track index (not 1900); "from" starts at oldest, "to" at newest, values clamp to catalog. When year, lossless, favorites, or compilation filters are active, the genre picker lists only genres present on matching albums (other filters applied, genre excluded). Adds library_get_catalog_year_bounds for the year UI. * feat(albums): debounce year filter and show genre album counts Debounce year range changes by 350ms before reloading browse. Genre picker lists album counts per genre (from getGenres or from albums matching other active filters) and sorts genres by count descending. * fix(albums): compilation filter detection and scan cap Recognize OpenSubsonic compilation flags (compilation, releaseTypes) so client-side comp filters work on local index rows. Cap background pagination at 500 albums when no matches are visible and show empty state instead of spinning through the whole catalog. * feat(albums): filter compilations via local library index Add `compilation` to advanced search (album entity): reads OpenSubsonic flags from album raw_json. Album browse passes compFilter into library_advanced_search when the index is ready; network-only path keeps client-side filtering with the existing scan cap. * fix(albums): apply compilation filter on track-grouped index browse Album browse uses track aggregation, so compilation clauses were skipped. Filter track raw_json (same SQL as album), merge album flags at sync, and always run the client-side compilation pass as a fallback. * refactor(albums): split browse modules and extract browse_support commands Move album browse fetch/filter logic into focused modules and useAlbumBrowseData; register reconcile/year-bounds Tauri commands from browse_support. Trim dead helpers and barrel exports; fix typecheck in compilation tests. * chore: note PR #876 in CHANGELOG and settings credits * fix(albums): show catalog min/max in partial year filter chip label When only from or to year is set, the active chip now reads e.g. 1990–2020 instead of 1990– or –2025, using indexed catalog bounds when available.
This commit is contained in:
cucadmuh
GitHub
@@ -206,6 +206,8 @@ export interface LibraryAdvancedSearchRequest {
|
||||
entityTypes: LibraryEntityType[];
|
||||
filters?: LibraryFilterClause[];
|
||||
starredOnly?: boolean | null;
|
||||
/** Server favorites ids ∩ local filters (lossless, genre, year). */
|
||||
restrictAlbumIds?: string[] | null;
|
||||
sort?: LibrarySortClause[];
|
||||
limit: number;
|
||||
offset?: number;
|
||||
@@ -599,6 +601,18 @@ export function libraryPatchTrack(args: {
|
||||
return invoke<void>('library_patch_track', { ...args, serverId: indexKey });
|
||||
}
|
||||
|
||||
/** Server favorites → `album.starred_at` (UPDATE only, no stub rows). */
|
||||
export function libraryReconcileAlbumStars(args: {
|
||||
serverId: string;
|
||||
starredAlbums: Array<{ id: string; starredAt: number }>;
|
||||
}): Promise<void> {
|
||||
const indexKey = serverIndexKeyForId(args.serverId);
|
||||
return invoke<void>('library_reconcile_album_stars', {
|
||||
serverId: indexKey,
|
||||
starredAlbums: args.starredAlbums.map(a => ({ id: a.id, starredAt: a.starredAt })),
|
||||
});
|
||||
}
|
||||
|
||||
export function libraryPutArtifact(args: {
|
||||
serverId: string;
|
||||
trackId: string;
|
||||
@@ -687,6 +701,18 @@ export type PlaySessionYearBounds = {
|
||||
maxYear: number | null;
|
||||
};
|
||||
|
||||
export type CatalogYearBounds = {
|
||||
minYear: number | null;
|
||||
maxYear: number | null;
|
||||
};
|
||||
|
||||
export function libraryGetCatalogYearBounds(args: { serverId: string }): Promise<CatalogYearBounds> {
|
||||
const indexKey = serverIndexKeyForId(args.serverId);
|
||||
return invoke<CatalogYearBounds>('library_get_catalog_year_bounds', {
|
||||
serverId: indexKey,
|
||||
});
|
||||
}
|
||||
|
||||
export type PlaySessionRecentDay = {
|
||||
date: string;
|
||||
totalListenedSec: number;
|
||||
|
||||
@@ -1,7 +1,12 @@
|
||||
import { api, libraryFilterParams } from './subsonicClient';
|
||||
import { invalidateEntityUserRatingCaches } from './subsonicRatings';
|
||||
import { useAuthStore } from '../store/authStore';
|
||||
import { patchLibraryTrackOnUse } from '../utils/library/patchOnUse';
|
||||
import { patchLibraryTrackOnUse, type StarPatchMeta } from '../utils/library/patchOnUse';
|
||||
import { useLibraryIndexStore } from '../store/libraryIndexStore';
|
||||
import {
|
||||
invalidateStarredAlbumBrowse,
|
||||
refreshStarredAlbumIndexFromServer,
|
||||
} from '../utils/library/starredAlbumIndexSync';
|
||||
import type {
|
||||
EntityRatingSupportLevel,
|
||||
StarredResults,
|
||||
@@ -22,25 +27,43 @@ export async function getStarred(): Promise<StarredResults> {
|
||||
return { artists: r.artist ?? [], albums: r.album ?? [], songs: r.song ?? [] };
|
||||
}
|
||||
|
||||
export async function star(id: string, type: 'song' | 'album' | 'artist' = 'album'): Promise<void> {
|
||||
export async function star(
|
||||
id: string,
|
||||
type: 'song' | 'album' | 'artist' = 'album',
|
||||
_meta?: StarPatchMeta,
|
||||
): Promise<void> {
|
||||
const params: Record<string, string> = {};
|
||||
if (type === 'song') params.id = id;
|
||||
if (type === 'album') params.albumId = id;
|
||||
if (type === 'artist') params.artistId = id;
|
||||
await api('star.view', params);
|
||||
const serverId = useAuthStore.getState().activeServerId;
|
||||
if (type === 'song') {
|
||||
patchLibraryTrackOnUse(useAuthStore.getState().activeServerId, id, { starredAt: Date.now() });
|
||||
patchLibraryTrackOnUse(serverId, id, { starredAt: Date.now() });
|
||||
} else if (type === 'album' && serverId) {
|
||||
invalidateStarredAlbumBrowse(serverId);
|
||||
const indexEnabled = useLibraryIndexStore.getState().isIndexEnabled(serverId);
|
||||
void refreshStarredAlbumIndexFromServer(serverId, indexEnabled).catch(() => {});
|
||||
}
|
||||
}
|
||||
|
||||
export async function unstar(id: string, type: 'song' | 'album' | 'artist' = 'album'): Promise<void> {
|
||||
export async function unstar(
|
||||
id: string,
|
||||
type: 'song' | 'album' | 'artist' = 'album',
|
||||
_meta?: StarPatchMeta,
|
||||
): Promise<void> {
|
||||
const params: Record<string, string> = {};
|
||||
if (type === 'song') params.id = id;
|
||||
if (type === 'album') params.albumId = id;
|
||||
if (type === 'artist') params.artistId = id;
|
||||
await api('unstar.view', params);
|
||||
const serverId = useAuthStore.getState().activeServerId;
|
||||
if (type === 'song') {
|
||||
patchLibraryTrackOnUse(useAuthStore.getState().activeServerId, id, { starredAt: null });
|
||||
patchLibraryTrackOnUse(serverId, id, { starredAt: null });
|
||||
} else if (type === 'album' && serverId) {
|
||||
invalidateStarredAlbumBrowse(serverId);
|
||||
const indexEnabled = useLibraryIndexStore.getState().isIndexEnabled(serverId);
|
||||
void refreshStarredAlbumIndexFromServer(serverId, indexEnabled).catch(() => {});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,34 @@
|
||||
import { X } from 'lucide-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
interface Props {
|
||||
onClear: () => void;
|
||||
/** Parent filter chip uses accent background (`btn-sort-active`). */
|
||||
onActiveChip?: boolean;
|
||||
}
|
||||
|
||||
/** Inline dismiss control on toolbar filter buttons (does not open the filter popover). */
|
||||
export default function FilterQuickClear({ onClear, onActiveChip = false }: Props) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const activate = (e: React.SyntheticEvent) => {
|
||||
e.stopPropagation();
|
||||
e.preventDefault();
|
||||
onClear();
|
||||
};
|
||||
|
||||
return (
|
||||
<span
|
||||
role="button"
|
||||
tabIndex={0}
|
||||
className={`filter-quick-clear${onActiveChip ? ' filter-quick-clear--on-active-chip' : ''}`}
|
||||
aria-label={t('common.filterClear')}
|
||||
onClick={activate}
|
||||
onKeyDown={e => {
|
||||
if (e.key === 'Enter' || e.key === ' ') activate(e);
|
||||
}}
|
||||
>
|
||||
<X size={12} strokeWidth={2.5} aria-hidden />
|
||||
</span>
|
||||
);
|
||||
}
|
||||
@@ -1,18 +1,45 @@
|
||||
import { getGenres } from '../api/subsonicGenres';
|
||||
import type { GenreFilterOption } from '../utils/library/albumBrowseLoad';
|
||||
import React, { useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
|
||||
import { createPortal } from 'react-dom';
|
||||
import { Check, Filter, X } from 'lucide-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import FilterQuickClear from './FilterQuickClear';
|
||||
|
||||
type GenreRow = GenreFilterOption;
|
||||
|
||||
function mergeGenreRows(
|
||||
catalogGenres: GenreFilterOption[],
|
||||
selected: string[],
|
||||
): GenreRow[] {
|
||||
const byGenre = new Map<string, number>();
|
||||
for (const { genre, count } of catalogGenres) byGenre.set(genre, count);
|
||||
for (const genre of selected) {
|
||||
if (!byGenre.has(genre)) byGenre.set(genre, 0);
|
||||
}
|
||||
return [...byGenre.entries()]
|
||||
.map(([genre, count]) => ({ genre, count }))
|
||||
.sort((a, b) => b.count - a.count || a.genre.localeCompare(b.genre));
|
||||
}
|
||||
|
||||
interface GenreFilterBarProps {
|
||||
selected: string[];
|
||||
onSelectionChange: (selected: string[]) => void;
|
||||
/**
|
||||
* When set, only these genres are listed (e.g. from the current non-genre filters).
|
||||
* `undefined` = full server genre list from `getGenres`.
|
||||
*/
|
||||
catalogGenres?: GenreFilterOption[] | null;
|
||||
}
|
||||
|
||||
export default function GenreFilterBar({ selected, onSelectionChange }: GenreFilterBarProps) {
|
||||
export default function GenreFilterBar({
|
||||
selected,
|
||||
onSelectionChange,
|
||||
catalogGenres,
|
||||
}: GenreFilterBarProps) {
|
||||
const { t } = useTranslation();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [genres, setGenres] = useState<string[]>([]);
|
||||
const [genreRows, setGenreRows] = useState<GenreRow[]>([]);
|
||||
const [search, setSearch] = useState('');
|
||||
const [popStyle, setPopStyle] = useState<React.CSSProperties>({});
|
||||
|
||||
@@ -21,30 +48,30 @@ export default function GenreFilterBar({ selected, onSelectionChange }: GenreFil
|
||||
const inputRef = useRef<HTMLInputElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
getGenres().then(data =>
|
||||
setGenres(data.map(g => g.value).sort((a, b) => a.localeCompare(b)))
|
||||
);
|
||||
}, []);
|
||||
if (catalogGenres != null) {
|
||||
setGenreRows(mergeGenreRows(catalogGenres, selected));
|
||||
return;
|
||||
}
|
||||
let cancelled = false;
|
||||
getGenres().then(data => {
|
||||
if (cancelled) return;
|
||||
const rows: GenreRow[] = data
|
||||
.map(g => ({ genre: g.value, count: g.albumCount ?? 0 }))
|
||||
.sort((a, b) => b.count - a.count || a.genre.localeCompare(b.genre));
|
||||
setGenreRows(mergeGenreRows(rows, selected));
|
||||
});
|
||||
return () => {
|
||||
cancelled = true;
|
||||
};
|
||||
}, [catalogGenres, selected]);
|
||||
|
||||
const selectedSet = useMemo(() => new Set(selected), [selected]);
|
||||
|
||||
// Selected on top, then alphabetical (stable for comfortable scanning).
|
||||
const sortedGenres = useMemo(() => {
|
||||
const arr = [...genres];
|
||||
arr.sort((a, b) => {
|
||||
const sa = selectedSet.has(a) ? 0 : 1;
|
||||
const sb = selectedSet.has(b) ? 0 : 1;
|
||||
if (sa !== sb) return sa - sb;
|
||||
return a.localeCompare(b);
|
||||
});
|
||||
return arr;
|
||||
}, [genres, selectedSet]);
|
||||
|
||||
const filteredGenres = useMemo(() => {
|
||||
const q = search.trim().toLowerCase();
|
||||
if (!q) return sortedGenres;
|
||||
return sortedGenres.filter(g => g.toLowerCase().includes(q));
|
||||
}, [sortedGenres, search]);
|
||||
if (!q) return genreRows;
|
||||
return genreRows.filter(({ genre }) => genre.toLowerCase().includes(q));
|
||||
}, [genreRows, search]);
|
||||
|
||||
const updatePopStyle = () => {
|
||||
if (!triggerRef.current) return;
|
||||
@@ -131,6 +158,7 @@ export default function GenreFilterBar({ selected, onSelectionChange }: GenreFil
|
||||
<Filter size={14} />
|
||||
{t('common.filterGenre')}
|
||||
{count > 0 && <span className="genre-filter-count">{count}</span>}
|
||||
{count > 0 && <FilterQuickClear onActiveChip onClear={clear} />}
|
||||
</button>
|
||||
|
||||
{open && createPortal(
|
||||
@@ -149,7 +177,7 @@ export default function GenreFilterBar({ selected, onSelectionChange }: GenreFil
|
||||
onChange={e => setSearch(e.target.value)}
|
||||
onKeyDown={e => {
|
||||
if (e.key === 'Enter' && filteredGenres.length > 0) {
|
||||
toggle(filteredGenres[0]);
|
||||
toggle(filteredGenres[0].genre);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
@@ -161,21 +189,24 @@ export default function GenreFilterBar({ selected, onSelectionChange }: GenreFil
|
||||
{t('common.filterNoGenres')}
|
||||
</div>
|
||||
) : (
|
||||
filteredGenres.map(g => {
|
||||
const isSel = selectedSet.has(g);
|
||||
filteredGenres.map(({ genre, count: albumCount }) => {
|
||||
const isSel = selectedSet.has(genre);
|
||||
return (
|
||||
<div
|
||||
key={g}
|
||||
key={genre}
|
||||
className={`genre-filter-popover__option${isSel ? ' genre-filter-popover__option--selected' : ''}`}
|
||||
onClick={() => toggle(g)}
|
||||
onClick={() => toggle(genre)}
|
||||
role="option"
|
||||
aria-selected={isSel}
|
||||
>
|
||||
<span className="genre-filter-popover__check">
|
||||
{isSel && <Check size={12} strokeWidth={3} />}
|
||||
</span>
|
||||
<span style={{ flex: 1, minWidth: 0, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
|
||||
{g}
|
||||
<span className="genre-filter-popover__label">
|
||||
{genre}
|
||||
</span>
|
||||
<span className="genre-filter-popover__album-count" aria-hidden>
|
||||
{albumCount}
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { Gem } from 'lucide-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import FilterQuickClear from './FilterQuickClear';
|
||||
|
||||
interface Props {
|
||||
active: boolean;
|
||||
@@ -25,6 +26,7 @@ export default function LosslessFilterButton({ active, onChange }: Props) {
|
||||
>
|
||||
<Gem size={14} />
|
||||
{t('albums.losslessLabel')}
|
||||
{active && <FilterQuickClear onActiveChip onClear={() => onChange(false)} />}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { Star } from 'lucide-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import FilterQuickClear from './FilterQuickClear';
|
||||
|
||||
interface Props {
|
||||
active: boolean;
|
||||
@@ -63,6 +64,7 @@ export default function StarFilterButton({ active, onChange, size = 'default' }:
|
||||
>
|
||||
<Star size={14} fill={active ? 'currentColor' : 'none'} />
|
||||
{t('common.favorites')}
|
||||
{active && <FilterQuickClear onActiveChip onClear={() => onChange(false)} />}
|
||||
</button>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -2,16 +2,33 @@ import React, { useEffect, useLayoutEffect, useRef, useState } from 'react';
|
||||
import { createPortal } from 'react-dom';
|
||||
import { CalendarRange, X } from 'lucide-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import FilterQuickClear from './FilterQuickClear';
|
||||
import {
|
||||
ALBUM_YEAR_MAX,
|
||||
ALBUM_YEAR_MIN,
|
||||
clampAlbumYearFieldInput,
|
||||
formatAlbumYearFilterLabel,
|
||||
normalizeAlbumYearToFieldChange,
|
||||
resolveAlbumYearBounds,
|
||||
stepAlbumYearField,
|
||||
} from '../utils/library/albumYearFilter';
|
||||
|
||||
interface Props {
|
||||
from: string;
|
||||
to: string;
|
||||
onChange: (from: string, to: string) => void;
|
||||
/** When set, spinners are limited to the indexed catalog (from `library_get_catalog_year_bounds`). */
|
||||
catalogMinYear?: number;
|
||||
catalogMaxYear?: number;
|
||||
}
|
||||
|
||||
const CURRENT_YEAR = new Date().getFullYear();
|
||||
|
||||
export default function YearFilterButton({ from, to, onChange }: Props) {
|
||||
export default function YearFilterButton({
|
||||
from,
|
||||
to,
|
||||
onChange,
|
||||
catalogMinYear,
|
||||
catalogMaxYear,
|
||||
}: Props) {
|
||||
const { t } = useTranslation();
|
||||
const [open, setOpen] = useState(false);
|
||||
const [popStyle, setPopStyle] = useState<React.CSSProperties>({});
|
||||
@@ -20,9 +37,11 @@ export default function YearFilterButton({ from, to, onChange }: Props) {
|
||||
const popRef = useRef<HTMLDivElement>(null);
|
||||
const fromRef = useRef<HTMLInputElement>(null);
|
||||
|
||||
const fromNum = parseInt(from, 10);
|
||||
const toNum = parseInt(to, 10);
|
||||
const active = !isNaN(fromNum) && !isNaN(toNum) && fromNum >= 1 && toNum >= 1;
|
||||
const yMin = catalogMinYear ?? ALBUM_YEAR_MIN;
|
||||
const yMax = catalogMaxYear ?? ALBUM_YEAR_MAX;
|
||||
|
||||
const { active, bounds } = resolveAlbumYearBounds(from, to);
|
||||
const activeLabel = formatAlbumYearFilterLabel(bounds, { min: yMin, max: yMax });
|
||||
|
||||
const updatePopStyle = () => {
|
||||
if (!triggerRef.current) return;
|
||||
@@ -87,6 +106,27 @@ export default function YearFilterButton({ from, to, onChange }: Props) {
|
||||
onChange('', '');
|
||||
};
|
||||
|
||||
const handleFromChange = (raw: string) => {
|
||||
onChange(clampAlbumYearFieldInput(raw, yMin, yMax), to);
|
||||
};
|
||||
|
||||
const handleToChange = (raw: string) => {
|
||||
onChange(from, normalizeAlbumYearToFieldChange(to, raw, yMin, yMax));
|
||||
};
|
||||
|
||||
const onYearWheel = (
|
||||
e: React.WheelEvent<HTMLInputElement>,
|
||||
field: 'from' | 'to',
|
||||
) => {
|
||||
e.preventDefault();
|
||||
const delta = e.deltaY < 0 ? 1 : -1;
|
||||
if (field === 'from') {
|
||||
onChange(stepAlbumYearField(from, delta, yMin, yMax, 'min'), to);
|
||||
} else {
|
||||
onChange(from, stepAlbumYearField(to, delta, yMin, yMax, 'max'));
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<button
|
||||
@@ -102,7 +142,8 @@ export default function YearFilterButton({ from, to, onChange }: Props) {
|
||||
}}
|
||||
>
|
||||
<CalendarRange size={14} />
|
||||
{active ? `${fromNum}–${toNum}` : t('albums.yearFilterLabel')}
|
||||
{active && activeLabel ? activeLabel : t('albums.yearFilterLabel')}
|
||||
{active && <FilterQuickClear onActiveChip onClear={clear} />}
|
||||
</button>
|
||||
|
||||
{open && createPortal(
|
||||
@@ -122,11 +163,12 @@ export default function YearFilterButton({ from, to, onChange }: Props) {
|
||||
ref={fromRef}
|
||||
className="input"
|
||||
type="number"
|
||||
min={1900}
|
||||
max={CURRENT_YEAR}
|
||||
placeholder="1970"
|
||||
min={yMin}
|
||||
max={yMax}
|
||||
placeholder={String(yMin)}
|
||||
value={from}
|
||||
onChange={e => onChange(e.target.value, to)}
|
||||
onChange={e => handleFromChange(e.target.value)}
|
||||
onWheel={e => onYearWheel(e, 'from')}
|
||||
/>
|
||||
</div>
|
||||
<span style={{ alignSelf: 'flex-end', paddingBottom: '0.4rem', color: 'var(--text-muted)' }}>–</span>
|
||||
@@ -137,11 +179,12 @@ export default function YearFilterButton({ from, to, onChange }: Props) {
|
||||
<input
|
||||
className="input"
|
||||
type="number"
|
||||
min={1900}
|
||||
max={CURRENT_YEAR}
|
||||
placeholder={String(CURRENT_YEAR)}
|
||||
min={yMin}
|
||||
max={yMax}
|
||||
placeholder={String(yMax)}
|
||||
value={to}
|
||||
onChange={e => onChange(from, e.target.value)}
|
||||
onChange={e => handleToChange(e.target.value)}
|
||||
onWheel={e => onYearWheel(e, 'to')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -60,7 +60,14 @@ export default function AlbumContextItems(props: ContextMenuItemsProps) {
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => {
|
||||
const starred = isStarred(album.id, album.starred);
|
||||
setStarredOverride(album.id, !starred);
|
||||
return starred ? unstar(album.id, 'album') : star(album.id, 'album');
|
||||
const meta = {
|
||||
name: album.name,
|
||||
artist: album.artist,
|
||||
artistId: album.artistId,
|
||||
coverArtId: album.coverArt,
|
||||
year: album.year,
|
||||
};
|
||||
return starred ? unstar(album.id, 'album', meta) : star(album.id, 'album', meta);
|
||||
})}>
|
||||
<Heart size={14} fill={isStarred(album.id, album.starred) ? 'currentColor' : 'none'} />
|
||||
{isStarred(album.id, album.starred) ? t('contextMenu.unfavoriteAlbum') : t('contextMenu.favoriteAlbum')}
|
||||
|
||||
@@ -54,7 +54,10 @@ export default function ArtistContextItems(props: ContextMenuItemsProps) {
|
||||
<div className="context-menu-item" onClick={() => handleAction(() => {
|
||||
const starred = isStarred(artist.id, artist.starred);
|
||||
setStarredOverride(artist.id, !starred);
|
||||
return starred ? unstar(artist.id, 'artist') : star(artist.id, 'artist');
|
||||
const meta = { name: artist.name, albumCount: artist.albumCount };
|
||||
return starred
|
||||
? unstar(artist.id, 'artist', meta)
|
||||
: star(artist.id, 'artist', meta);
|
||||
})}>
|
||||
<Heart size={14} fill={isStarred(artist.id, artist.starred) ? 'currentColor' : 'none'} />
|
||||
{isStarred(artist.id, artist.starred) ? t('contextMenu.unfavoriteArtist') : t('contextMenu.favoriteArtist')}
|
||||
|
||||
@@ -132,6 +132,7 @@ const CONTRIBUTOR_ENTRIES = [
|
||||
'Live Search: server-scoped local FTS, multi-server hit fix, and local vs search3 race merge (PR #868)',
|
||||
'Cover art pipeline: tier ladder, WebP disk cache, dense-grid prefetch, Settings cover cache budget (PR #869)',
|
||||
'Lossless: local index browse, Advanced Search and All Albums filters, artist/album drill-down mode, conserved sidebar page (PR #871)',
|
||||
'Albums: combined browse filters (genre/year/favorites/lossless/compilations), session restore from album detail, favorites reconcile via local index (PR #876)',
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
@@ -0,0 +1,215 @@
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
||||
import type { SubsonicAlbum } from '../api/subsonicTypes';
|
||||
import { dedupeById } from '../utils/dedupeById';
|
||||
import { albumBrowseCompScanComplete } from '../utils/library/albumCompilation';
|
||||
import type { AlbumCompFilter } from '../utils/library/albumCompilation';
|
||||
import {
|
||||
albumBrowseHasGenreFilter,
|
||||
albumBrowseHasServerFilters,
|
||||
fetchAlbumBrowseGenreOptions,
|
||||
fetchAlbumBrowsePage,
|
||||
filterAlbumsByCompilation,
|
||||
filterAlbumsByStarred,
|
||||
type AlbumBrowseQuery,
|
||||
type GenreFilterOption,
|
||||
} from '../utils/library/albumBrowseLoad';
|
||||
import {
|
||||
ALBUM_YEAR_FILTER_DEBOUNCE_MS,
|
||||
resolveAlbumYearBounds,
|
||||
} from '../utils/library/albumYearFilter';
|
||||
import { useDebouncedValue } from './useDebouncedValue';
|
||||
|
||||
const PAGE_SIZE = 30;
|
||||
|
||||
export type UseAlbumBrowseDataArgs = {
|
||||
serverId: string;
|
||||
indexEnabled: boolean;
|
||||
musicLibraryFilterVersion: number;
|
||||
sort: AlbumBrowseQuery['sort'];
|
||||
selectedGenres: string[];
|
||||
yearFrom: string;
|
||||
yearTo: string;
|
||||
losslessOnly: boolean;
|
||||
starredOnly: boolean;
|
||||
compFilter: AlbumCompFilter;
|
||||
starredOverrides: Record<string, boolean>;
|
||||
};
|
||||
|
||||
export function useAlbumBrowseData({
|
||||
serverId,
|
||||
indexEnabled,
|
||||
musicLibraryFilterVersion,
|
||||
sort,
|
||||
selectedGenres,
|
||||
yearFrom,
|
||||
yearTo,
|
||||
losslessOnly,
|
||||
starredOnly,
|
||||
compFilter,
|
||||
starredOverrides,
|
||||
}: UseAlbumBrowseDataArgs) {
|
||||
const [albums, setAlbums] = useState<SubsonicAlbum[]>([]);
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [page, setPage] = useState(0);
|
||||
const [hasMore, setHasMore] = useState(true);
|
||||
const [genreCatalogOptions, setGenreCatalogOptions] = useState<GenreFilterOption[] | null>(null);
|
||||
|
||||
const yearFields = useMemo(() => ({ from: yearFrom, to: yearTo }), [yearFrom, yearTo]);
|
||||
const debouncedYearFields = useDebouncedValue(yearFields, ALBUM_YEAR_FILTER_DEBOUNCE_MS);
|
||||
|
||||
const { active: yearFilterActive, bounds: yearFilterBounds } = useMemo(
|
||||
() => resolveAlbumYearBounds(debouncedYearFields.from, debouncedYearFields.to),
|
||||
[debouncedYearFields.from, debouncedYearFields.to],
|
||||
);
|
||||
|
||||
const browseQuery = useMemo<AlbumBrowseQuery>(() => ({
|
||||
sort,
|
||||
genres: selectedGenres,
|
||||
year: yearFilterActive ? yearFilterBounds : undefined,
|
||||
losslessOnly,
|
||||
starredOnly,
|
||||
compFilter,
|
||||
}), [sort, selectedGenres, yearFilterActive, yearFilterBounds, losslessOnly, starredOnly, compFilter]);
|
||||
|
||||
const browseQueryWithoutGenre = useMemo<AlbumBrowseQuery>(() => ({
|
||||
sort,
|
||||
genres: [],
|
||||
year: yearFilterActive ? yearFilterBounds : undefined,
|
||||
losslessOnly,
|
||||
starredOnly,
|
||||
compFilter,
|
||||
}), [sort, yearFilterActive, yearFilterBounds, losslessOnly, starredOnly, compFilter]);
|
||||
|
||||
const compFilterActive = compFilter !== 'all';
|
||||
const compFilterClientOnly = compFilterActive && !indexEnabled;
|
||||
|
||||
const visibleAlbums = useMemo(() => {
|
||||
let out = compFilterActive
|
||||
? filterAlbumsByCompilation(albums, compFilter)
|
||||
: albums;
|
||||
if (starredOnly) out = filterAlbumsByStarred(out, starredOverrides);
|
||||
return out;
|
||||
}, [albums, compFilter, compFilterActive, starredOnly, starredOverrides]);
|
||||
|
||||
const genreFiltered = albumBrowseHasGenreFilter(browseQuery);
|
||||
const serverFilterActive = albumBrowseHasServerFilters(browseQuery);
|
||||
const narrowGenreList = yearFilterActive || losslessOnly || starredOnly || compFilterActive;
|
||||
|
||||
const compScanExhausted = useMemo(
|
||||
() => compFilterClientOnly && !genreFiltered
|
||||
&& albumBrowseCompScanComplete(albums, compFilter, hasMore),
|
||||
[compFilterClientOnly, genreFiltered, albums, compFilter, hasMore],
|
||||
);
|
||||
|
||||
const pendingClientFilterMatch =
|
||||
compFilterClientOnly && visibleAlbums.length === 0 && hasMore && !genreFiltered && !compScanExhausted;
|
||||
|
||||
const loadGenerationRef = useRef(0);
|
||||
|
||||
const loadBrowse = useCallback(async (
|
||||
query: AlbumBrowseQuery,
|
||||
offset: number,
|
||||
append = false,
|
||||
) => {
|
||||
const generation = ++loadGenerationRef.current;
|
||||
setLoading(true);
|
||||
const applyPage = (page: { albums: SubsonicAlbum[]; hasMore: boolean }) => {
|
||||
if (generation !== loadGenerationRef.current) return;
|
||||
if (append) setAlbums(prev => dedupeById([...prev, ...page.albums]));
|
||||
else setAlbums(page.albums);
|
||||
setHasMore(page.hasMore);
|
||||
};
|
||||
try {
|
||||
const page = await fetchAlbumBrowsePage(
|
||||
serverId,
|
||||
indexEnabled,
|
||||
query,
|
||||
offset,
|
||||
PAGE_SIZE,
|
||||
{
|
||||
onPartial: partial => {
|
||||
if (generation !== loadGenerationRef.current) return;
|
||||
applyPage(partial);
|
||||
setLoading(false);
|
||||
},
|
||||
},
|
||||
);
|
||||
applyPage(page);
|
||||
} finally {
|
||||
if (generation === loadGenerationRef.current) setLoading(false);
|
||||
}
|
||||
}, [indexEnabled, serverId]);
|
||||
|
||||
useEffect(() => {
|
||||
setPage(0);
|
||||
loadBrowse(browseQuery, 0, false);
|
||||
}, [browseQuery, loadBrowse, musicLibraryFilterVersion]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!narrowGenreList) {
|
||||
setGenreCatalogOptions(null);
|
||||
return;
|
||||
}
|
||||
let cancelled = false;
|
||||
void fetchAlbumBrowseGenreOptions(serverId, indexEnabled, browseQueryWithoutGenre).then(options => {
|
||||
if (!cancelled) setGenreCatalogOptions(options);
|
||||
});
|
||||
return () => {
|
||||
cancelled = true;
|
||||
};
|
||||
}, [
|
||||
narrowGenreList,
|
||||
serverId,
|
||||
indexEnabled,
|
||||
browseQueryWithoutGenre,
|
||||
musicLibraryFilterVersion,
|
||||
]);
|
||||
|
||||
const loadMore = useCallback(() => {
|
||||
if (loading || !hasMore || genreFiltered) return;
|
||||
if (compFilterClientOnly && visibleAlbums.length === 0
|
||||
&& albumBrowseCompScanComplete(albums, compFilter, hasMore)) {
|
||||
return;
|
||||
}
|
||||
const next = page + 1;
|
||||
setPage(next);
|
||||
loadBrowse(browseQuery, next * PAGE_SIZE, true);
|
||||
}, [
|
||||
loading,
|
||||
hasMore,
|
||||
page,
|
||||
browseQuery,
|
||||
loadBrowse,
|
||||
genreFiltered,
|
||||
compFilterClientOnly,
|
||||
visibleAlbums.length,
|
||||
albums,
|
||||
compFilter,
|
||||
]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!pendingClientFilterMatch || loading) return;
|
||||
loadMore();
|
||||
}, [pendingClientFilterMatch, loading, loadMore]);
|
||||
|
||||
return {
|
||||
albums,
|
||||
loading,
|
||||
hasMore,
|
||||
PAGE_SIZE,
|
||||
browseQuery,
|
||||
browseQueryWithoutGenre,
|
||||
visibleAlbums,
|
||||
genreFiltered,
|
||||
serverFilterActive,
|
||||
narrowGenreList,
|
||||
genreCatalogOptions,
|
||||
yearFilterActive,
|
||||
debouncedYearFields,
|
||||
compFilterActive,
|
||||
compFilterClientOnly,
|
||||
compScanExhausted,
|
||||
pendingClientFilterMatch,
|
||||
loadMore,
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,114 @@
|
||||
import { useEffect, useRef, useState } from 'react';
|
||||
import { useNavigationType, type NavigationType } from 'react-router-dom';
|
||||
import {
|
||||
DEFAULT_ALBUM_BROWSE_RETURN_FILTERS,
|
||||
type AlbumBrowseCompFilter,
|
||||
type AlbumBrowseReturnFilters,
|
||||
albumBrowseSortForServer,
|
||||
isAlbumDetailPath,
|
||||
useAlbumBrowseSessionStore,
|
||||
} from '../store/albumBrowseSessionStore';
|
||||
import type { AlbumBrowseSort } from '../utils/library/browseTextSearch';
|
||||
|
||||
function returnFiltersForNavigation(
|
||||
serverId: string,
|
||||
navigationType: NavigationType,
|
||||
): AlbumBrowseReturnFilters {
|
||||
if (navigationType !== 'POP' || !serverId) return DEFAULT_ALBUM_BROWSE_RETURN_FILTERS;
|
||||
return (
|
||||
useAlbumBrowseSessionStore.getState().peekReturnStash(serverId)
|
||||
?? DEFAULT_ALBUM_BROWSE_RETURN_FILTERS
|
||||
);
|
||||
}
|
||||
|
||||
export function useAlbumBrowseFilters(serverId: string) {
|
||||
const navigationType = useNavigationType();
|
||||
const sort = useAlbumBrowseSessionStore(s => albumBrowseSortForServer(s.sortByServer, serverId));
|
||||
const setBrowseSort = useAlbumBrowseSessionStore(s => s.setSort);
|
||||
|
||||
const [selectedGenres, setSelectedGenres] = useState<string[]>(() =>
|
||||
returnFiltersForNavigation(serverId, navigationType).selectedGenres,
|
||||
);
|
||||
const [yearFrom, setYearFrom] = useState(() =>
|
||||
returnFiltersForNavigation(serverId, navigationType).yearFrom,
|
||||
);
|
||||
const [yearTo, setYearTo] = useState(() =>
|
||||
returnFiltersForNavigation(serverId, navigationType).yearTo,
|
||||
);
|
||||
const [compFilter, setCompFilter] = useState<AlbumBrowseCompFilter>(() =>
|
||||
returnFiltersForNavigation(serverId, navigationType).compFilter,
|
||||
);
|
||||
const [starredOnly, setStarredOnly] = useState(() =>
|
||||
returnFiltersForNavigation(serverId, navigationType).starredOnly,
|
||||
);
|
||||
const [losslessOnly, setLosslessOnly] = useState(() =>
|
||||
returnFiltersForNavigation(serverId, navigationType).losslessOnly,
|
||||
);
|
||||
|
||||
const filtersRef = useRef<AlbumBrowseReturnFilters>(DEFAULT_ALBUM_BROWSE_RETURN_FILTERS);
|
||||
filtersRef.current = {
|
||||
selectedGenres,
|
||||
yearFrom,
|
||||
yearTo,
|
||||
compFilter,
|
||||
starredOnly,
|
||||
losslessOnly,
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
if (!serverId) return;
|
||||
|
||||
if (navigationType === 'POP') {
|
||||
const restored = useAlbumBrowseSessionStore.getState().peekReturnStash(serverId);
|
||||
if (restored) {
|
||||
setSelectedGenres(restored.selectedGenres);
|
||||
setYearFrom(restored.yearFrom);
|
||||
setYearTo(restored.yearTo);
|
||||
setCompFilter(restored.compFilter);
|
||||
setStarredOnly(restored.starredOnly);
|
||||
setLosslessOnly(restored.losslessOnly);
|
||||
useAlbumBrowseSessionStore.getState().clearReturnStash(serverId);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
useAlbumBrowseSessionStore.getState().clearReturnStash(serverId);
|
||||
setSelectedGenres([]);
|
||||
setYearFrom('');
|
||||
setYearTo('');
|
||||
setCompFilter('all');
|
||||
setStarredOnly(false);
|
||||
setLosslessOnly(false);
|
||||
}, [serverId, navigationType]);
|
||||
|
||||
useEffect(() => {
|
||||
return () => {
|
||||
if (!serverId) return;
|
||||
const path = window.location.pathname;
|
||||
if (isAlbumDetailPath(path)) {
|
||||
useAlbumBrowseSessionStore.getState().stashReturnFilters(serverId, filtersRef.current);
|
||||
} else if (path !== '/albums') {
|
||||
useAlbumBrowseSessionStore.getState().clearReturnStash(serverId);
|
||||
}
|
||||
};
|
||||
}, [serverId]);
|
||||
|
||||
const onSortChange = (value: AlbumBrowseSort) => setBrowseSort(serverId, value);
|
||||
|
||||
return {
|
||||
sort,
|
||||
onSortChange,
|
||||
selectedGenres,
|
||||
setSelectedGenres,
|
||||
yearFrom,
|
||||
setYearFrom,
|
||||
yearTo,
|
||||
setYearTo,
|
||||
compFilter,
|
||||
setCompFilter,
|
||||
starredOnly,
|
||||
setStarredOnly,
|
||||
losslessOnly,
|
||||
setLosslessOnly,
|
||||
};
|
||||
}
|
||||
@@ -0,0 +1,29 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
import {
|
||||
ALBUM_YEAR_MAX,
|
||||
ALBUM_YEAR_MIN,
|
||||
type AlbumCatalogYearRange,
|
||||
} from '../utils/library/albumYearFilter';
|
||||
import { fetchAlbumCatalogYearBounds } from '../utils/library/albumCatalogYearBounds';
|
||||
|
||||
const DEFAULT: AlbumCatalogYearRange = { min: ALBUM_YEAR_MIN, max: ALBUM_YEAR_MAX };
|
||||
|
||||
export function useAlbumCatalogYearBounds(
|
||||
serverId: string,
|
||||
indexEnabled: boolean,
|
||||
libraryFilterVersion: number,
|
||||
): AlbumCatalogYearRange {
|
||||
const [bounds, setBounds] = useState(DEFAULT);
|
||||
|
||||
useEffect(() => {
|
||||
let cancelled = false;
|
||||
void fetchAlbumCatalogYearBounds(serverId, indexEnabled).then(next => {
|
||||
if (!cancelled) setBounds(next);
|
||||
});
|
||||
return () => {
|
||||
cancelled = true;
|
||||
};
|
||||
}, [serverId, indexEnabled, libraryFilterVersion]);
|
||||
|
||||
return bounds;
|
||||
}
|
||||
@@ -0,0 +1,29 @@
|
||||
import { describe, expect, it, vi, beforeEach, afterEach } from 'vitest';
|
||||
import { renderHook, act } from '@testing-library/react';
|
||||
import { useDebouncedValue } from './useDebouncedValue';
|
||||
|
||||
describe('useDebouncedValue', () => {
|
||||
beforeEach(() => {
|
||||
vi.useFakeTimers();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vi.useRealTimers();
|
||||
});
|
||||
|
||||
it('updates after delay when value changes', () => {
|
||||
const { result, rerender } = renderHook(
|
||||
({ value }) => useDebouncedValue(value, 1000),
|
||||
{ initialProps: { value: 'a' } },
|
||||
);
|
||||
|
||||
expect(result.current).toBe('a');
|
||||
rerender({ value: 'b' });
|
||||
expect(result.current).toBe('a');
|
||||
|
||||
act(() => {
|
||||
vi.advanceTimersByTime(1000);
|
||||
});
|
||||
expect(result.current).toBe('b');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,13 @@
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
/** Returns `value` after it stays unchanged for `delayMs`. */
|
||||
export function useDebouncedValue<T>(value: T, delayMs: number): T {
|
||||
const [debounced, setDebounced] = useState(value);
|
||||
|
||||
useEffect(() => {
|
||||
const id = setTimeout(() => setDebounced(value), delayMs);
|
||||
return () => clearTimeout(id);
|
||||
}, [value, delayMs]);
|
||||
|
||||
return debounced;
|
||||
}
|
||||
@@ -210,8 +210,15 @@ const handleShuffleAll = () => {
|
||||
const wasStarred = isStarred;
|
||||
setIsStarred(!wasStarred);
|
||||
try {
|
||||
if (wasStarred) await unstar(album.album.id);
|
||||
else await star(album.album.id);
|
||||
const meta = {
|
||||
name: album.album.name,
|
||||
artist: album.album.artist,
|
||||
artistId: album.album.artistId,
|
||||
coverArtId: album.album.coverArt,
|
||||
year: album.album.year,
|
||||
};
|
||||
if (wasStarred) await unstar(album.album.id, 'album', meta);
|
||||
else await star(album.album.id, 'album', meta);
|
||||
} catch (e) {
|
||||
console.error('Failed to toggle star', e);
|
||||
setIsStarred(wasStarred);
|
||||
|
||||
+78
-207
@@ -1,9 +1,6 @@
|
||||
import { buildDownloadUrl } from '../api/subsonicStreamUrl';
|
||||
import { getAlbumsByGenre } from '../api/subsonicGenres';
|
||||
import { getAlbumList, getAlbum } from '../api/subsonicLibrary';
|
||||
import type { SubsonicAlbum } from '../api/subsonicTypes';
|
||||
import { getAlbum } from '../api/subsonicLibrary';
|
||||
import { songToTrack } from '../utils/playback/songToTrack';
|
||||
import { dedupeById } from '../utils/dedupeById';
|
||||
import { useState, useEffect, useLayoutEffect, useRef, useCallback, useMemo } from 'react';
|
||||
import AlbumCard from '../components/AlbumCard';
|
||||
import { albumGridWarmCovers, coverDisplayCssPxForAlbumGrid } from '../cover/layoutSizes';
|
||||
@@ -26,6 +23,7 @@ import { join } from '@tauri-apps/api/path';
|
||||
import { showToast } from '../utils/ui/toast';
|
||||
import { useZipDownloadStore } from '../store/zipDownloadStore';
|
||||
import { CheckSquare2, Download, HardDriveDownload, Disc3, ListPlus } from 'lucide-react';
|
||||
import FilterQuickClear from '../components/FilterQuickClear';
|
||||
import { usePerfProbeFlags } from '../utils/perf/perfFlags';
|
||||
import { useRangeSelection } from '../hooks/useRangeSelection';
|
||||
import { useMainstageInpageHeaderTight } from '../hooks/useMainstageInpageHeaderTight';
|
||||
@@ -33,28 +31,18 @@ import { VirtualCardGrid } from '../components/VirtualCardGrid';
|
||||
import OverlayScrollArea from '../components/OverlayScrollArea';
|
||||
import { ALBUMS_INPAGE_SCROLL_VIEWPORT_ID } from '../constants/appScroll';
|
||||
import { useLibraryIndexStore } from '../store/libraryIndexStore';
|
||||
import {
|
||||
runLocalAlbumBrowsePage,
|
||||
runLocalAlbumsByGenres,
|
||||
runLocalLosslessAlbums,
|
||||
type AlbumBrowseSort,
|
||||
} from '../utils/library/browseTextSearch';
|
||||
import { useAlbumBrowseFilters } from '../hooks/useAlbumBrowseFilters';
|
||||
import { useAlbumBrowseData } from '../hooks/useAlbumBrowseData';
|
||||
import { useAlbumCatalogYearBounds } from '../hooks/useAlbumCatalogYearBounds';
|
||||
import type { AlbumBrowseSort } from '../utils/library/albumBrowseSort';
|
||||
import { LOSSLESS_MODE_QUERY } from '../utils/library/losslessMode';
|
||||
|
||||
type SortType = AlbumBrowseSort;
|
||||
type CompFilter = 'all' | 'only' | 'hide';
|
||||
|
||||
const PAGE_SIZE = 30;
|
||||
|
||||
function sanitizeFilename(name: string): string {
|
||||
return name.replace(/[<>:"/\\|?*\x00-\x1f]/g, '_').trim() || 'download';
|
||||
}
|
||||
|
||||
async function fetchByGenres(genres: string[]): Promise<SubsonicAlbum[]> {
|
||||
const results = await Promise.all(genres.map(g => getAlbumsByGenre(g, 500, 0)));
|
||||
return dedupeById(results.flat());
|
||||
}
|
||||
|
||||
export default function Albums() {
|
||||
const perfFlags = usePerfProbeFlags();
|
||||
const { t } = useTranslation();
|
||||
@@ -62,20 +50,56 @@ export default function Albums() {
|
||||
const auth = useAuthStore();
|
||||
const serverId = useAuthStore(s => s.activeServerId ?? '');
|
||||
const indexEnabled = useLibraryIndexStore(s => s.isIndexEnabled(serverId));
|
||||
const catalogYears = useAlbumCatalogYearBounds(serverId, indexEnabled, musicLibraryFilterVersion);
|
||||
const downloadAlbum = useOfflineStore(s => s.downloadAlbum);
|
||||
const requestDownloadFolder = useDownloadModalStore(s => s.requestFolder);
|
||||
|
||||
const [albums, setAlbums] = useState<SubsonicAlbum[]>([]);
|
||||
const [sort, setSort] = useState<SortType>('alphabeticalByName');
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [page, setPage] = useState(0);
|
||||
const [hasMore, setHasMore] = useState(true);
|
||||
const [selectedGenres, setSelectedGenres] = useState<string[]>([]);
|
||||
const [yearFrom, setYearFrom] = useState('');
|
||||
const [yearTo, setYearTo] = useState('');
|
||||
const [compFilter, setCompFilter] = useState<CompFilter>('all');
|
||||
const [starredOnly, setStarredOnly] = useState(false);
|
||||
const [losslessOnly, setLosslessOnly] = useState(false);
|
||||
const {
|
||||
sort,
|
||||
onSortChange,
|
||||
selectedGenres,
|
||||
setSelectedGenres,
|
||||
yearFrom,
|
||||
setYearFrom,
|
||||
yearTo,
|
||||
setYearTo,
|
||||
compFilter,
|
||||
setCompFilter,
|
||||
starredOnly,
|
||||
setStarredOnly,
|
||||
losslessOnly,
|
||||
setLosslessOnly,
|
||||
} = useAlbumBrowseFilters(serverId);
|
||||
|
||||
const starredOverrides = usePlayerStore(s => s.starredOverrides);
|
||||
const {
|
||||
albums,
|
||||
loading,
|
||||
hasMore,
|
||||
visibleAlbums,
|
||||
genreFiltered,
|
||||
serverFilterActive,
|
||||
narrowGenreList,
|
||||
genreCatalogOptions,
|
||||
yearFilterActive,
|
||||
debouncedYearFields,
|
||||
compFilterActive,
|
||||
pendingClientFilterMatch,
|
||||
loadMore,
|
||||
} = useAlbumBrowseData({
|
||||
serverId,
|
||||
indexEnabled,
|
||||
musicLibraryFilterVersion,
|
||||
sort,
|
||||
selectedGenres,
|
||||
yearFrom,
|
||||
yearTo,
|
||||
losslessOnly,
|
||||
starredOnly,
|
||||
compFilter,
|
||||
starredOverrides,
|
||||
});
|
||||
|
||||
const observerTarget = useRef<HTMLDivElement>(null);
|
||||
const gridMeasureRef = useRef<HTMLDivElement>(null);
|
||||
const maxGridCols = useAuthStore(s => clampLibraryGridMaxColumns(s.libraryGridMaxColumns));
|
||||
@@ -93,18 +117,6 @@ export default function Albums() {
|
||||
// `visibleAlbums` so Shift-click range expansion follows the visible order).
|
||||
const [selectionMode, setSelectionMode] = useState(false);
|
||||
|
||||
const starredOverrides = usePlayerStore(s => s.starredOverrides);
|
||||
const clientFilterActive = starredOnly || compFilter !== 'all';
|
||||
const visibleAlbums = useMemo(() => {
|
||||
let out = albums;
|
||||
if (compFilter === 'only') out = out.filter(a => a.isCompilation);
|
||||
else if (compFilter === 'hide') out = out.filter(a => !a.isCompilation);
|
||||
if (starredOnly) {
|
||||
out = out.filter(a => a.id in starredOverrides ? starredOverrides[a.id] : !!a.starred);
|
||||
}
|
||||
return out;
|
||||
}, [albums, compFilter, starredOnly, starredOverrides]);
|
||||
|
||||
const { selectedIds, toggleSelect, clearSelection: resetSelection } = useRangeSelection(visibleAlbums);
|
||||
|
||||
const toggleSelectionMode = () => {
|
||||
@@ -178,15 +190,6 @@ export default function Albums() {
|
||||
clearSelection();
|
||||
};
|
||||
|
||||
// ── Data loading ─────────────────────────────────────────────────────────
|
||||
const genreFiltered = selectedGenres.length > 0;
|
||||
const fromNum = parseInt(yearFrom, 10);
|
||||
const toNum = parseInt(yearTo, 10);
|
||||
const yearActive = !isNaN(fromNum) && !isNaN(toNum) && fromNum >= 1 && toNum >= 1;
|
||||
|
||||
const pendingClientFilterMatch =
|
||||
clientFilterActive && visibleAlbums.length === 0 && hasMore && !genreFiltered;
|
||||
|
||||
const visibleEmptyMessage = useMemo(() => {
|
||||
if (starredOnly) return t('albums.noFavorites');
|
||||
if (compFilter === 'only') return t('albums.noCompilations');
|
||||
@@ -219,9 +222,9 @@ export default function Albums() {
|
||||
const mainstageHeaderTight = useMainstageInpageHeaderTight(scrollBodyEl, [
|
||||
sort,
|
||||
genreFiltered,
|
||||
yearActive,
|
||||
yearFrom,
|
||||
yearTo,
|
||||
yearFilterActive,
|
||||
debouncedYearFields.from,
|
||||
debouncedYearFields.to,
|
||||
compFilter,
|
||||
starredOnly,
|
||||
losslessOnly,
|
||||
@@ -229,144 +232,6 @@ export default function Albums() {
|
||||
selectedGenres,
|
||||
]);
|
||||
|
||||
const load = useCallback(async (
|
||||
sortType: SortType,
|
||||
offset: number,
|
||||
append = false,
|
||||
yearFilter?: { from: number; to: number },
|
||||
lossless = false,
|
||||
) => {
|
||||
setLoading(true);
|
||||
try {
|
||||
if (lossless) {
|
||||
if (!indexEnabled || !serverId) {
|
||||
setAlbums([]);
|
||||
setHasMore(false);
|
||||
return;
|
||||
}
|
||||
if (!yearFilter) {
|
||||
const page = await runLocalLosslessAlbums(serverId, PAGE_SIZE, offset);
|
||||
if (!page) {
|
||||
setAlbums([]);
|
||||
setHasMore(false);
|
||||
return;
|
||||
}
|
||||
if (append) setAlbums(prev => dedupeById([...prev, ...page.albums]));
|
||||
else setAlbums(page.albums);
|
||||
setHasMore(page.hasMore);
|
||||
return;
|
||||
}
|
||||
const data = await runLocalAlbumBrowsePage(
|
||||
serverId,
|
||||
sortType,
|
||||
offset,
|
||||
PAGE_SIZE,
|
||||
yearFilter,
|
||||
true,
|
||||
);
|
||||
if (data == null) {
|
||||
setAlbums([]);
|
||||
setHasMore(false);
|
||||
return;
|
||||
}
|
||||
if (append) setAlbums(prev => [...prev, ...data]);
|
||||
else setAlbums(data);
|
||||
setHasMore(data.length === PAGE_SIZE);
|
||||
return;
|
||||
}
|
||||
|
||||
let data: SubsonicAlbum[] | null = null;
|
||||
if (indexEnabled && serverId) {
|
||||
data = await runLocalAlbumBrowsePage(
|
||||
serverId,
|
||||
sortType,
|
||||
offset,
|
||||
PAGE_SIZE,
|
||||
yearFilter,
|
||||
false,
|
||||
);
|
||||
}
|
||||
if (data == null) {
|
||||
const extra = yearFilter ? { fromYear: yearFilter.from, toYear: yearFilter.to } : {};
|
||||
const type = yearFilter ? 'byYear' : sortType;
|
||||
data = await getAlbumList(type, PAGE_SIZE, offset, extra);
|
||||
}
|
||||
if (append) setAlbums(prev => [...prev, ...data]);
|
||||
else setAlbums(data);
|
||||
setHasMore(data.length === PAGE_SIZE);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, [musicLibraryFilterVersion, indexEnabled, serverId]);
|
||||
|
||||
const loadFiltered = useCallback(async (
|
||||
genres: string[],
|
||||
sortType: SortType,
|
||||
lossless: boolean,
|
||||
) => {
|
||||
setLoading(true);
|
||||
try {
|
||||
if (lossless) {
|
||||
if (!indexEnabled || !serverId) {
|
||||
setAlbums([]);
|
||||
setHasMore(false);
|
||||
return;
|
||||
}
|
||||
const data = await runLocalAlbumsByGenres(serverId, genres, sortType, undefined, true);
|
||||
setAlbums(data ?? []);
|
||||
setHasMore(false);
|
||||
return;
|
||||
}
|
||||
|
||||
let data: SubsonicAlbum[] | null = null;
|
||||
if (indexEnabled && serverId) {
|
||||
data = await runLocalAlbumsByGenres(serverId, genres, sortType);
|
||||
}
|
||||
if (data == null) {
|
||||
data = await fetchByGenres(genres);
|
||||
data = [...data].sort((a, b) =>
|
||||
sortType === 'alphabeticalByArtist'
|
||||
? a.artist.localeCompare(b.artist)
|
||||
: a.name.localeCompare(b.name),
|
||||
);
|
||||
}
|
||||
setAlbums(data);
|
||||
setHasMore(false);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
}
|
||||
}, [musicLibraryFilterVersion, indexEnabled, serverId]);
|
||||
|
||||
useEffect(() => {
|
||||
setPage(0);
|
||||
if (genreFiltered) {
|
||||
loadFiltered(selectedGenres, sort, losslessOnly);
|
||||
} else if (yearActive) {
|
||||
load(sort, 0, false, { from: fromNum, to: toNum }, losslessOnly);
|
||||
} else {
|
||||
load(sort, 0, false, undefined, losslessOnly);
|
||||
}
|
||||
}, [sort, genreFiltered, selectedGenres, yearActive, fromNum, toNum, losslessOnly, load, loadFiltered]);
|
||||
|
||||
const loadMore = useCallback(() => {
|
||||
if (loading || !hasMore || genreFiltered) return;
|
||||
const next = page + 1;
|
||||
setPage(next);
|
||||
const yf = yearActive ? { from: fromNum, to: toNum } : undefined;
|
||||
load(sort, next * PAGE_SIZE, true, yf, losslessOnly);
|
||||
}, [
|
||||
loading,
|
||||
hasMore,
|
||||
page,
|
||||
sort,
|
||||
load,
|
||||
genreFiltered,
|
||||
yearActive,
|
||||
fromNum,
|
||||
toNum,
|
||||
losslessOnly,
|
||||
]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!indexEnabled && losslessOnly) setLosslessOnly(false);
|
||||
}, [indexEnabled, losslessOnly]);
|
||||
@@ -386,11 +251,6 @@ export default function Albums() {
|
||||
return () => observer.disconnect();
|
||||
}, [loadMore, scrollBodyEl]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!pendingClientFilterMatch || loading) return;
|
||||
loadMore();
|
||||
}, [pendingClientFilterMatch, loading, loadMore]);
|
||||
|
||||
const sortOptions: { value: SortType; label: string }[] = [
|
||||
{ value: 'alphabeticalByName', label: t('albums.sortByName') },
|
||||
{ value: 'alphabeticalByArtist', label: t('albums.sortByArtist') },
|
||||
@@ -424,21 +284,25 @@ export default function Albums() {
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
{!yearActive && (
|
||||
<SortDropdown
|
||||
value={sort}
|
||||
options={sortOptions}
|
||||
onChange={setSort}
|
||||
/>
|
||||
)}
|
||||
<SortDropdown
|
||||
value={sort}
|
||||
options={sortOptions}
|
||||
onChange={onSortChange}
|
||||
/>
|
||||
|
||||
<YearFilterButton
|
||||
from={yearFrom}
|
||||
to={yearTo}
|
||||
catalogMinYear={catalogYears.min}
|
||||
catalogMaxYear={catalogYears.max}
|
||||
onChange={(from, to) => { setYearFrom(from); setYearTo(to); }}
|
||||
/>
|
||||
|
||||
<GenreFilterBar selected={selectedGenres} onSelectionChange={setSelectedGenres} />
|
||||
<GenreFilterBar
|
||||
selected={selectedGenres}
|
||||
catalogGenres={narrowGenreList ? genreCatalogOptions : null}
|
||||
onSelectionChange={setSelectedGenres}
|
||||
/>
|
||||
|
||||
<StarFilterButton active={starredOnly} onChange={setStarredOnly} />
|
||||
|
||||
@@ -464,6 +328,9 @@ export default function Albums() {
|
||||
{compFilter === 'all' ? t('albums.compilationLabel')
|
||||
: compFilter === 'only' ? t('albums.compilationOnly')
|
||||
: t('albums.compilationHide')}
|
||||
{compFilter !== 'all' && (
|
||||
<FilterQuickClear onActiveChip onClear={() => setCompFilter('all')} />
|
||||
)}
|
||||
</button>
|
||||
</>
|
||||
)}
|
||||
@@ -500,11 +367,11 @@ export default function Albums() {
|
||||
perfFlags.disableMainstageVirtualLists,
|
||||
]}
|
||||
>
|
||||
{(loading && albums.length === 0) || pendingClientFilterMatch ? (
|
||||
{loading && albums.length === 0 ? (
|
||||
<div style={{ display: 'flex', justifyContent: 'center', padding: '3rem' }}>
|
||||
<div className="spinner" />
|
||||
</div>
|
||||
) : !loading && albums.length === 0 && !genreFiltered && !yearActive && !clientFilterActive && !losslessOnly ? (
|
||||
) : !loading && albums.length === 0 && !serverFilterActive && !compFilterActive ? (
|
||||
<div className="empty-state" style={{ padding: '3rem 1rem', textAlign: 'center' }}>
|
||||
{t('common.libraryEmpty')}
|
||||
</div>
|
||||
@@ -512,7 +379,11 @@ export default function Albums() {
|
||||
<div className="empty-state" style={{ padding: '3rem 1rem', textAlign: 'center' }}>
|
||||
{t('losslessAlbums.empty')}
|
||||
</div>
|
||||
) : !loading && visibleAlbums.length === 0 && clientFilterActive ? (
|
||||
) : !loading && visibleAlbums.length === 0 && pendingClientFilterMatch ? (
|
||||
<div style={{ display: 'flex', justifyContent: 'center', padding: '3rem' }}>
|
||||
<div className="spinner" />
|
||||
</div>
|
||||
) : !loading && visibleAlbums.length === 0 && (starredOnly || compFilterActive) ? (
|
||||
<div className="empty-state" style={{ padding: '3rem 1rem', textAlign: 'center' }}>
|
||||
{visibleEmptyMessage}
|
||||
</div>
|
||||
|
||||
+13
-11
@@ -27,7 +27,7 @@ import { useBrowseArtistTextSearch } from '../hooks/useBrowseArtistTextSearch';
|
||||
import { useMainstageInpageHeaderTight } from '../hooks/useMainstageInpageHeaderTight';
|
||||
import { useArtistsInfiniteScroll } from '../hooks/useArtistsInfiniteScroll';
|
||||
import { useLibraryIndexStore } from '../store/libraryIndexStore';
|
||||
import { runLocalBrowseAllArtists } from '../utils/library/browseTextSearch';
|
||||
import { fetchNetworkStarredArtists, runLocalBrowseAllArtists } from '../utils/library/browseTextSearch';
|
||||
import { ArtistsGridView } from '../components/artists/ArtistsGridView';
|
||||
import { ArtistsListView } from '../components/artists/ArtistsListView';
|
||||
|
||||
@@ -96,17 +96,19 @@ export default function Artists() {
|
||||
let cancelled = false;
|
||||
setLoading(true);
|
||||
void (async () => {
|
||||
if (indexEnabled && serverId) {
|
||||
const local = await runLocalBrowseAllArtists(serverId);
|
||||
if (!cancelled && local != null) {
|
||||
setCatalogArtists(local);
|
||||
setLoading(false);
|
||||
try {
|
||||
if (starredOnly) {
|
||||
if (!cancelled) setCatalogArtists(await fetchNetworkStarredArtists());
|
||||
return;
|
||||
}
|
||||
}
|
||||
try {
|
||||
const data = await getArtists();
|
||||
if (!cancelled) setCatalogArtists(data);
|
||||
if (indexEnabled && serverId) {
|
||||
const local = await runLocalBrowseAllArtists(serverId);
|
||||
if (!cancelled && local != null) {
|
||||
setCatalogArtists(local);
|
||||
return;
|
||||
}
|
||||
}
|
||||
if (!cancelled) setCatalogArtists(await getArtists());
|
||||
} catch {
|
||||
/* ignore */
|
||||
} finally {
|
||||
@@ -116,7 +118,7 @@ export default function Artists() {
|
||||
return () => {
|
||||
cancelled = true;
|
||||
};
|
||||
}, [musicLibraryFilterVersion, indexEnabled, serverId]);
|
||||
}, [musicLibraryFilterVersion, indexEnabled, serverId, starredOnly]);
|
||||
|
||||
const {
|
||||
filtered, visible, hasMore, groups, letters, artistListFlatRows,
|
||||
|
||||
@@ -99,8 +99,9 @@ export default function ComposerDetail() {
|
||||
setIsStarred(next);
|
||||
setStarredOverride(artist.id, next);
|
||||
try {
|
||||
if (next) await star(artist.id, 'artist');
|
||||
else await unstar(artist.id, 'artist');
|
||||
const meta = { name: artist.name, albumCount: artist.albumCount };
|
||||
if (next) await star(artist.id, 'artist', meta);
|
||||
else await unstar(artist.id, 'artist', meta);
|
||||
} catch (err) {
|
||||
console.warn('[psysonic] composer star failed:', err);
|
||||
setIsStarred(!next);
|
||||
|
||||
@@ -2,7 +2,7 @@ import { buildDownloadUrl } from '../api/subsonicStreamUrl';
|
||||
import { getAlbum } from '../api/subsonicLibrary';
|
||||
import type { SubsonicAlbum } from '../api/subsonicTypes';
|
||||
import { songToTrack } from '../utils/playback/songToTrack';
|
||||
import { useCallback, useEffect, useRef, useState } from 'react';
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
||||
import AlbumCard from '../components/AlbumCard';
|
||||
import { LOSSLESS_MODE_QUERY } from '../utils/library/losslessMode';
|
||||
import { ndListLosslessAlbumsPage } from '../api/navidromeBrowse';
|
||||
@@ -24,7 +24,16 @@ import { VirtualCardGrid } from '../components/VirtualCardGrid';
|
||||
import OverlayScrollArea from '../components/OverlayScrollArea';
|
||||
import { LOSSLESS_ALBUMS_INPAGE_SCROLL_VIEWPORT_ID } from '../constants/appScroll';
|
||||
import { useLibraryIndexStore } from '../store/libraryIndexStore';
|
||||
import { runLocalLosslessAlbums } from '../utils/library/browseTextSearch';
|
||||
import SortDropdown from '../components/SortDropdown';
|
||||
import {
|
||||
albumBrowseSortForServer,
|
||||
useAlbumBrowseSessionStore,
|
||||
} from '../store/albumBrowseSessionStore';
|
||||
import {
|
||||
runLocalAlbumBrowsePage,
|
||||
sortSubsonicAlbums,
|
||||
type AlbumBrowseSort,
|
||||
} from '../utils/library/browseTextSearch';
|
||||
|
||||
/** Local index page size — SQLite is cheap; larger pages than the network walk. */
|
||||
const LOCAL_PAGE_SIZE = 30;
|
||||
@@ -45,6 +54,8 @@ export default function LosslessAlbums() {
|
||||
const activeServerId = useAuthStore(s => s.activeServerId);
|
||||
const serverId = useAuthStore(s => s.activeServerId ?? '');
|
||||
const indexEnabled = useLibraryIndexStore(s => s.isIndexEnabled(serverId));
|
||||
const sort = useAlbumBrowseSessionStore(s => albumBrowseSortForServer(s.sortByServer, serverId));
|
||||
const setBrowseSort = useAlbumBrowseSessionStore(s => s.setSort);
|
||||
const downloadAlbum = useOfflineStore(s => s.downloadAlbum);
|
||||
const requestDownloadFolder = useDownloadModalStore(s => s.requestFolder);
|
||||
const enqueue = usePlayerStore(s => s.enqueue);
|
||||
@@ -57,8 +68,13 @@ export default function LosslessAlbums() {
|
||||
/** `true` = local SQLite; `false` = Navidrome song-stream walk; `null` until first fetch picks. */
|
||||
const [useLocalIndex, setUseLocalIndex] = useState<boolean | null>(null);
|
||||
|
||||
const { selectedIds, toggleSelect, clearSelection: resetSelection } = useRangeSelection(albums);
|
||||
const selectedAlbums = albums.filter(a => selectedIds.has(a.id));
|
||||
const displayAlbums = useMemo(() => {
|
||||
if (useLocalIndex === false) return sortSubsonicAlbums(albums, sort);
|
||||
return albums;
|
||||
}, [albums, sort, useLocalIndex]);
|
||||
|
||||
const { selectedIds, toggleSelect, clearSelection: resetSelection } = useRangeSelection(displayAlbums);
|
||||
const selectedAlbums = displayAlbums.filter(a => selectedIds.has(a.id));
|
||||
|
||||
const toggleSelectionMode = () => { setSelectionMode(v => !v); resetSelection(); };
|
||||
const clearSelection = () => { setSelectionMode(false); resetSelection(); };
|
||||
@@ -76,10 +92,16 @@ export default function LosslessAlbums() {
|
||||
setScrollBodyEl(el);
|
||||
}, []);
|
||||
|
||||
const sortOptions: { value: AlbumBrowseSort; label: string }[] = [
|
||||
{ value: 'alphabeticalByName', label: t('albums.sortByName') },
|
||||
{ value: 'alphabeticalByArtist', label: t('albums.sortByArtist') },
|
||||
];
|
||||
|
||||
const mainstageHeaderTight = useMainstageInpageHeaderTight(scrollBodyEl, [
|
||||
unsupported,
|
||||
selectionMode,
|
||||
activeServerId,
|
||||
sort,
|
||||
]);
|
||||
|
||||
const loadMoreNetwork = useCallback(async (onProgress?: (albums: SubsonicAlbum[]) => void) => {
|
||||
@@ -98,11 +120,18 @@ export default function LosslessAlbums() {
|
||||
}, []);
|
||||
|
||||
const loadMoreLocal = useCallback(async () => {
|
||||
const page = await runLocalLosslessAlbums(serverId, LOCAL_PAGE_SIZE, localOffset.current);
|
||||
if (!page) return null;
|
||||
localOffset.current += page.albums.length;
|
||||
return page;
|
||||
}, [serverId]);
|
||||
const data = await runLocalAlbumBrowsePage(
|
||||
serverId,
|
||||
sort,
|
||||
localOffset.current,
|
||||
LOCAL_PAGE_SIZE,
|
||||
undefined,
|
||||
true,
|
||||
);
|
||||
if (data == null) return null;
|
||||
localOffset.current += data.length;
|
||||
return { albums: data, hasMore: data.length === LOCAL_PAGE_SIZE };
|
||||
}, [serverId, sort]);
|
||||
|
||||
const loadMore = useCallback(async () => {
|
||||
if (inFlight.current || useLocalIndex === null) return;
|
||||
@@ -151,13 +180,20 @@ export default function LosslessAlbums() {
|
||||
inFlight.current = true;
|
||||
try {
|
||||
if (indexEnabled && serverId) {
|
||||
const local = await runLocalLosslessAlbums(serverId, LOCAL_PAGE_SIZE, 0);
|
||||
const data = await runLocalAlbumBrowsePage(
|
||||
serverId,
|
||||
sort,
|
||||
0,
|
||||
LOCAL_PAGE_SIZE,
|
||||
undefined,
|
||||
true,
|
||||
);
|
||||
if (cancelled) return;
|
||||
if (local) {
|
||||
if (data != null) {
|
||||
setUseLocalIndex(true);
|
||||
localOffset.current = local.albums.length;
|
||||
setAlbums(local.albums);
|
||||
setHasMore(local.hasMore);
|
||||
localOffset.current = data.length;
|
||||
setAlbums(data);
|
||||
setHasMore(data.length === LOCAL_PAGE_SIZE);
|
||||
return;
|
||||
}
|
||||
}
|
||||
@@ -182,7 +218,7 @@ export default function LosslessAlbums() {
|
||||
})();
|
||||
|
||||
return () => { cancelled = true; };
|
||||
}, [activeServerId, indexEnabled, loadMoreNetwork, serverId]);
|
||||
}, [activeServerId, indexEnabled, loadMoreNetwork, serverId, sort]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!hasMore || useLocalIndex === null) return;
|
||||
@@ -271,6 +307,13 @@ export default function LosslessAlbums() {
|
||||
)}
|
||||
</div>
|
||||
<div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', flexWrap: 'wrap' }}>
|
||||
{!(selectionMode && selectedIds.size > 0) && (
|
||||
<SortDropdown
|
||||
value={sort}
|
||||
options={sortOptions}
|
||||
onChange={value => setBrowseSort(serverId, value)}
|
||||
/>
|
||||
)}
|
||||
{selectionMode && selectedIds.size > 0 && (
|
||||
<>
|
||||
<button className="btn btn-surface albums-selection-action-btn" onClick={handleEnqueueSelected}>
|
||||
@@ -323,22 +366,22 @@ export default function LosslessAlbums() {
|
||||
<div style={{ padding: '3rem', textAlign: 'center', color: 'var(--text-secondary)' }}>
|
||||
{t('losslessAlbums.unsupported')}
|
||||
</div>
|
||||
) : loading && albums.length === 0 ? (
|
||||
) : loading && displayAlbums.length === 0 ? (
|
||||
<div style={{ display: 'flex', justifyContent: 'center', padding: '3rem' }}>
|
||||
<div className="spinner" />
|
||||
</div>
|
||||
) : albums.length === 0 ? (
|
||||
) : displayAlbums.length === 0 ? (
|
||||
<div style={{ padding: '3rem', textAlign: 'center', color: 'var(--text-secondary)' }}>
|
||||
{t('losslessAlbums.empty')}
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<VirtualCardGrid
|
||||
items={albums}
|
||||
items={displayAlbums}
|
||||
itemKey={(a, _i) => a.id}
|
||||
rowVariant="album"
|
||||
disableVirtualization={perfFlags.disableMainstageVirtualLists}
|
||||
layoutSignal={albums.length}
|
||||
layoutSignal={displayAlbums.length}
|
||||
scrollRootId={LOSSLESS_ALBUMS_INPAGE_SCROLL_VIEWPORT_ID}
|
||||
warmGridCovers={albumGridWarmCovers()}
|
||||
renderItem={a => (
|
||||
|
||||
@@ -0,0 +1,70 @@
|
||||
import { describe, expect, it, beforeEach } from 'vitest';
|
||||
import {
|
||||
DEFAULT_ALBUM_BROWSE_RETURN_FILTERS,
|
||||
DEFAULT_ALBUM_BROWSE_SORT,
|
||||
albumBrowseSortForServer,
|
||||
isAlbumDetailPath,
|
||||
useAlbumBrowseSessionStore,
|
||||
} from './albumBrowseSessionStore';
|
||||
|
||||
describe('albumBrowseSessionStore', () => {
|
||||
beforeEach(() => {
|
||||
useAlbumBrowseSessionStore.setState({ sortByServer: {}, returnStashByServer: {} });
|
||||
});
|
||||
|
||||
it('keeps sort per server for the session', () => {
|
||||
const { setSort } = useAlbumBrowseSessionStore.getState();
|
||||
setSort('srv-a', 'alphabeticalByArtist');
|
||||
setSort('srv-b', 'alphabeticalByName');
|
||||
|
||||
const { sortByServer } = useAlbumBrowseSessionStore.getState();
|
||||
expect(albumBrowseSortForServer(sortByServer, 'srv-a')).toBe('alphabeticalByArtist');
|
||||
expect(albumBrowseSortForServer(sortByServer, 'srv-b')).toBe('alphabeticalByName');
|
||||
});
|
||||
|
||||
it('stashes and peeks return filters', () => {
|
||||
const { stashReturnFilters, peekReturnStash } = useAlbumBrowseSessionStore.getState();
|
||||
stashReturnFilters('srv-a', {
|
||||
...DEFAULT_ALBUM_BROWSE_RETURN_FILTERS,
|
||||
selectedGenres: ['Rock'],
|
||||
yearFrom: '1990',
|
||||
yearTo: '2000',
|
||||
starredOnly: true,
|
||||
});
|
||||
|
||||
expect(peekReturnStash('srv-a')).toEqual({
|
||||
selectedGenres: ['Rock'],
|
||||
yearFrom: '1990',
|
||||
yearTo: '2000',
|
||||
compFilter: 'all',
|
||||
starredOnly: true,
|
||||
losslessOnly: false,
|
||||
});
|
||||
expect(peekReturnStash('srv-a')).not.toBeNull();
|
||||
});
|
||||
|
||||
it('clears return stash', () => {
|
||||
const { stashReturnFilters, clearReturnStash, peekReturnStash } = useAlbumBrowseSessionStore.getState();
|
||||
stashReturnFilters('srv-a', {
|
||||
...DEFAULT_ALBUM_BROWSE_RETURN_FILTERS,
|
||||
selectedGenres: ['Jazz'],
|
||||
});
|
||||
clearReturnStash('srv-a');
|
||||
expect(peekReturnStash('srv-a')).toBeNull();
|
||||
});
|
||||
|
||||
it('defaults sort when server has no entry', () => {
|
||||
const { sortByServer } = useAlbumBrowseSessionStore.getState();
|
||||
expect(albumBrowseSortForServer(sortByServer, 'unknown')).toBe(DEFAULT_ALBUM_BROWSE_SORT);
|
||||
});
|
||||
});
|
||||
|
||||
describe('isAlbumDetailPath', () => {
|
||||
it('matches album detail routes only', () => {
|
||||
expect(isAlbumDetailPath('/album/abc')).toBe(true);
|
||||
expect(isAlbumDetailPath('/album/abc/')).toBe(true);
|
||||
expect(isAlbumDetailPath('/albums')).toBe(false);
|
||||
expect(isAlbumDetailPath('/artist/abc')).toBe(false);
|
||||
expect(isAlbumDetailPath('/album/abc/tracks')).toBe(false);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,110 @@
|
||||
import { create } from 'zustand';
|
||||
import type { AlbumBrowseSort } from '../utils/library/browseTextSearch';
|
||||
|
||||
export const DEFAULT_ALBUM_BROWSE_SORT: AlbumBrowseSort = 'alphabeticalByName';
|
||||
|
||||
export type AlbumBrowseCompFilter = 'all' | 'only' | 'hide';
|
||||
|
||||
/** Filters restored only when returning to Albums via browser/app back from album detail. */
|
||||
export interface AlbumBrowseReturnFilters {
|
||||
selectedGenres: string[];
|
||||
yearFrom: string;
|
||||
yearTo: string;
|
||||
compFilter: AlbumBrowseCompFilter;
|
||||
starredOnly: boolean;
|
||||
losslessOnly: boolean;
|
||||
}
|
||||
|
||||
export const DEFAULT_ALBUM_BROWSE_RETURN_FILTERS: AlbumBrowseReturnFilters = {
|
||||
selectedGenres: [],
|
||||
yearFrom: '',
|
||||
yearTo: '',
|
||||
compFilter: 'all',
|
||||
starredOnly: false,
|
||||
losslessOnly: false,
|
||||
};
|
||||
|
||||
interface ServerAlbumBrowseSession {
|
||||
sort: AlbumBrowseSort;
|
||||
}
|
||||
|
||||
interface AlbumBrowseSessionStore {
|
||||
/** Session-lifetime sort per server (sidebar ↔ album detail). */
|
||||
sortByServer: Record<string, AlbumBrowseSort>;
|
||||
/** Stashed when leaving Albums → album detail; consumed on POP back. */
|
||||
returnStashByServer: Record<string, AlbumBrowseReturnFilters>;
|
||||
setSort: (serverId: string, sort: AlbumBrowseSort) => void;
|
||||
stashReturnFilters: (serverId: string, filters: AlbumBrowseReturnFilters) => void;
|
||||
clearReturnStash: (serverId: string) => void;
|
||||
peekReturnStash: (serverId: string) => AlbumBrowseReturnFilters | null;
|
||||
}
|
||||
|
||||
function sortEntryFor(
|
||||
sortByServer: Record<string, AlbumBrowseSort>,
|
||||
serverId: string,
|
||||
): AlbumBrowseSort {
|
||||
return sortByServer[serverId] ?? DEFAULT_ALBUM_BROWSE_SORT;
|
||||
}
|
||||
|
||||
export const useAlbumBrowseSessionStore = create<AlbumBrowseSessionStore>((set, get) => ({
|
||||
sortByServer: {},
|
||||
returnStashByServer: {},
|
||||
|
||||
setSort: (serverId, sort) => {
|
||||
if (!serverId) return;
|
||||
set((s) => ({
|
||||
sortByServer: { ...s.sortByServer, [serverId]: sort },
|
||||
}));
|
||||
},
|
||||
|
||||
stashReturnFilters: (serverId, filters) => {
|
||||
if (!serverId) return;
|
||||
set((s) => ({
|
||||
returnStashByServer: {
|
||||
...s.returnStashByServer,
|
||||
[serverId]: {
|
||||
selectedGenres: [...filters.selectedGenres],
|
||||
yearFrom: filters.yearFrom,
|
||||
yearTo: filters.yearTo,
|
||||
compFilter: filters.compFilter,
|
||||
starredOnly: filters.starredOnly,
|
||||
losslessOnly: filters.losslessOnly,
|
||||
},
|
||||
},
|
||||
}));
|
||||
},
|
||||
|
||||
clearReturnStash: (serverId) => {
|
||||
if (!serverId) return;
|
||||
const next = { ...get().returnStashByServer };
|
||||
delete next[serverId];
|
||||
set({ returnStashByServer: next });
|
||||
},
|
||||
|
||||
peekReturnStash: (serverId) => {
|
||||
if (!serverId) return null;
|
||||
const stash = get().returnStashByServer[serverId];
|
||||
if (!stash) return null;
|
||||
return {
|
||||
selectedGenres: [...stash.selectedGenres],
|
||||
yearFrom: stash.yearFrom,
|
||||
yearTo: stash.yearTo,
|
||||
compFilter: stash.compFilter,
|
||||
starredOnly: stash.starredOnly,
|
||||
losslessOnly: stash.losslessOnly,
|
||||
};
|
||||
},
|
||||
}));
|
||||
|
||||
export function albumBrowseSortForServer(
|
||||
sortByServer: Record<string, AlbumBrowseSort>,
|
||||
serverId: string,
|
||||
): AlbumBrowseSort {
|
||||
if (!serverId) return DEFAULT_ALBUM_BROWSE_SORT;
|
||||
return sortEntryFor(sortByServer, serverId);
|
||||
}
|
||||
|
||||
/** True when pathname is a single album detail route (`/album/:id`). */
|
||||
export function isAlbumDetailPath(pathname: string): boolean {
|
||||
return /^\/album\/[^/]+\/?$/.test(pathname);
|
||||
}
|
||||
@@ -0,0 +1,26 @@
|
||||
.filter-quick-clear {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-shrink: 0;
|
||||
margin-left: 0.1rem;
|
||||
padding: 0.12rem;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
opacity: 0.88;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.filter-quick-clear:hover {
|
||||
opacity: 1;
|
||||
background: color-mix(in srgb, currentColor 14%, transparent);
|
||||
}
|
||||
|
||||
.filter-quick-clear--on-active-chip:hover {
|
||||
background: color-mix(in srgb, var(--ctp-crust) 22%, transparent);
|
||||
}
|
||||
|
||||
.filter-quick-clear:focus-visible {
|
||||
outline: 2px solid var(--accent);
|
||||
outline-offset: 1px;
|
||||
}
|
||||
@@ -64,6 +64,23 @@
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.genre-filter-popover__label {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.genre-filter-popover__album-count {
|
||||
flex-shrink: 0;
|
||||
min-width: 1.5rem;
|
||||
text-align: right;
|
||||
font-size: 0.78rem;
|
||||
color: var(--text-muted);
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
|
||||
.genre-filter-popover__option:hover {
|
||||
background: var(--bg-hover);
|
||||
}
|
||||
|
||||
@@ -44,6 +44,7 @@
|
||||
@import './custom-select.css';
|
||||
@import './changelog.css';
|
||||
@import './genre-filter-bar.css';
|
||||
@import './filter-quick-clear.css';
|
||||
@import './genre-tag-cloud.css';
|
||||
@import './random-landing.css';
|
||||
@import './playlists-overview-header.css';
|
||||
|
||||
@@ -55,8 +55,9 @@ export async function runArtistToggleStar(deps: RunArtistToggleStarDeps): Promis
|
||||
const currentlyStarred = isStarred;
|
||||
setIsStarred(!currentlyStarred);
|
||||
try {
|
||||
if (currentlyStarred) await unstar(artist.id, 'artist');
|
||||
else await star(artist.id, 'artist');
|
||||
const meta = { name: artist.name, albumCount: artist.albumCount };
|
||||
if (currentlyStarred) await unstar(artist.id, 'artist', meta);
|
||||
else await star(artist.id, 'artist', meta);
|
||||
} catch (e) {
|
||||
console.error('Failed to toggle star', e);
|
||||
setIsStarred(currentlyStarred);
|
||||
|
||||
@@ -26,6 +26,7 @@ import { libraryScopeForServer } from '../../api/subsonicClient';
|
||||
import { libraryIsReady } from './libraryReady';
|
||||
import { logLibrarySearch, timed } from './libraryDevLog';
|
||||
import { isLosslessSuffix } from './losslessFormats';
|
||||
import { albumIsCompilation } from './albumCompilation';
|
||||
import { OXIMEDIA_MOOD_SEARCH_ENABLED } from './trackEnrichment';
|
||||
|
||||
export type AdvancedResultType = 'all' | 'artists' | 'albums' | 'songs';
|
||||
@@ -191,6 +192,15 @@ export function trackToSong(t: LibraryTrackDto): SubsonicSong {
|
||||
return merged;
|
||||
}
|
||||
|
||||
/** Merge `raw_json` without nullish Subsonic fields wiping hot columns (e.g. year). */
|
||||
function mergeAlbumRawJson(base: SubsonicAlbum, raw: Partial<SubsonicAlbum>): SubsonicAlbum {
|
||||
const merged = { ...base } as SubsonicAlbum & Record<string, unknown>;
|
||||
for (const [key, value] of Object.entries(raw)) {
|
||||
if (value != null && value !== '') merged[key] = value;
|
||||
}
|
||||
return merged;
|
||||
}
|
||||
|
||||
export function albumToAlbum(a: LibraryAlbumDto): SubsonicAlbum {
|
||||
const raw = isObject(a.rawJson) ? a.rawJson : {};
|
||||
const base: SubsonicAlbum = {
|
||||
@@ -205,7 +215,9 @@ export function albumToAlbum(a: LibraryAlbumDto): SubsonicAlbum {
|
||||
coverArt: a.coverArtId ?? a.id,
|
||||
starred: a.starredAt != null ? new Date(a.starredAt).toISOString() : undefined,
|
||||
};
|
||||
return { ...base, ...(raw as Partial<SubsonicAlbum>) };
|
||||
const merged = mergeAlbumRawJson(base, raw as Partial<SubsonicAlbum>);
|
||||
if (albumIsCompilation(merged)) merged.isCompilation = true;
|
||||
return merged;
|
||||
}
|
||||
|
||||
export function artistToArtist(ar: LibraryArtistDto): SubsonicArtist {
|
||||
|
||||
@@ -0,0 +1,95 @@
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import type { LibraryFilterClause } from '../../api/library';
|
||||
import { albumIsCompilation, type AlbumCompFilter } from './albumCompilation';
|
||||
import { albumYearFilterClauses, type AlbumYearBounds } from './albumYearFilter';
|
||||
import type { AlbumBrowseQuery, GenreFilterOption } from './albumBrowseTypes';
|
||||
|
||||
export function albumBrowseHasGenreFilter(query: AlbumBrowseQuery): boolean {
|
||||
return query.genres.length > 0;
|
||||
}
|
||||
|
||||
export function albumBrowseHasServerFilters(query: AlbumBrowseQuery): boolean {
|
||||
return (
|
||||
albumBrowseHasGenreFilter(query)
|
||||
|| query.year != null
|
||||
|| query.losslessOnly
|
||||
|| query.starredOnly
|
||||
);
|
||||
}
|
||||
|
||||
/** Favorites need the local index when combined with lossless or genre (AND). */
|
||||
export function albumBrowseStarredNeedsLocalIntersect(
|
||||
query: AlbumBrowseQuery,
|
||||
indexEnabled: boolean,
|
||||
serverId: string | null | undefined,
|
||||
): boolean {
|
||||
return !!(
|
||||
query.starredOnly
|
||||
&& indexEnabled
|
||||
&& serverId
|
||||
&& (query.losslessOnly || query.genres.length > 0)
|
||||
);
|
||||
}
|
||||
|
||||
export function compilationFilterClauses(compFilter: AlbumCompFilter): LibraryFilterClause[] {
|
||||
if (compFilter === 'only') return [{ field: 'compilation', op: 'is_true' }];
|
||||
if (compFilter === 'hide') return [{ field: 'compilation', op: 'eq', value: false }];
|
||||
return [];
|
||||
}
|
||||
|
||||
export function sharedServerFilters(
|
||||
query: AlbumBrowseQuery,
|
||||
useServerStarredIds: boolean,
|
||||
): LibraryFilterClause[] {
|
||||
const filters: LibraryFilterClause[] = [];
|
||||
if (query.year) filters.push(...albumYearFilterClauses(query.year));
|
||||
if (query.losslessOnly) filters.push({ field: 'lossless', op: 'is_true' });
|
||||
filters.push(...compilationFilterClauses(query.compFilter));
|
||||
if (query.starredOnly && !useServerStarredIds) {
|
||||
filters.push({ field: 'starred', op: 'is_true' });
|
||||
}
|
||||
return filters;
|
||||
}
|
||||
|
||||
export function filterAlbumsByStarred(
|
||||
albums: SubsonicAlbum[],
|
||||
starredOverrides: Record<string, boolean>,
|
||||
): SubsonicAlbum[] {
|
||||
return albums.filter(a => {
|
||||
if (a.id in starredOverrides) return starredOverrides[a.id];
|
||||
return !!a.starred;
|
||||
});
|
||||
}
|
||||
|
||||
export function filterAlbumsByYearBounds(
|
||||
albums: SubsonicAlbum[],
|
||||
bounds: AlbumYearBounds,
|
||||
): SubsonicAlbum[] {
|
||||
return albums.filter(a => {
|
||||
if (a.year == null) return false;
|
||||
if (bounds.from != null && a.year < bounds.from) return false;
|
||||
if (bounds.to != null && a.year > bounds.to) return false;
|
||||
return true;
|
||||
});
|
||||
}
|
||||
|
||||
export function filterAlbumsByCompilation(
|
||||
albums: SubsonicAlbum[],
|
||||
compFilter: AlbumCompFilter,
|
||||
): SubsonicAlbum[] {
|
||||
if (compFilter === 'only') return albums.filter(albumIsCompilation);
|
||||
if (compFilter === 'hide') return albums.filter(a => !albumIsCompilation(a));
|
||||
return albums;
|
||||
}
|
||||
|
||||
export function countGenresFromAlbums(albums: SubsonicAlbum[]): GenreFilterOption[] {
|
||||
const counts = new Map<string, number>();
|
||||
for (const a of albums) {
|
||||
const g = (a.genre ?? '').trim();
|
||||
if (!g) continue;
|
||||
counts.set(g, (counts.get(g) ?? 0) + 1);
|
||||
}
|
||||
return [...counts.entries()]
|
||||
.map(([genre, count]) => ({ genre, count }))
|
||||
.sort((a, b) => b.count - a.count || a.genre.localeCompare(b.genre));
|
||||
}
|
||||
@@ -0,0 +1,135 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import {
|
||||
albumBrowseHasGenreFilter,
|
||||
albumBrowseHasServerFilters,
|
||||
albumBrowseStarredNeedsLocalIntersect,
|
||||
compilationFilterClauses,
|
||||
countGenresFromAlbums,
|
||||
filterAlbumsByStarred,
|
||||
filterAlbumsByYearBounds,
|
||||
} from './albumBrowseFilters';
|
||||
import type { AlbumBrowseQuery } from './albumBrowseTypes';
|
||||
|
||||
describe('albumBrowseLoad', () => {
|
||||
const base: AlbumBrowseQuery = {
|
||||
sort: 'alphabeticalByName',
|
||||
genres: [],
|
||||
losslessOnly: false,
|
||||
starredOnly: false,
|
||||
compFilter: 'all',
|
||||
};
|
||||
|
||||
it('detects combined server filters', () => {
|
||||
expect(albumBrowseHasServerFilters(base)).toBe(false);
|
||||
expect(albumBrowseHasServerFilters({ ...base, genres: ['Rock'] })).toBe(true);
|
||||
expect(albumBrowseHasServerFilters({ ...base, year: { from: 1990 } })).toBe(true);
|
||||
expect(albumBrowseHasServerFilters({ ...base, losslessOnly: true })).toBe(true);
|
||||
expect(albumBrowseHasServerFilters({ ...base, starredOnly: true })).toBe(true);
|
||||
expect(
|
||||
albumBrowseHasServerFilters({
|
||||
...base,
|
||||
genres: ['Jazz'],
|
||||
year: { to: 2000 },
|
||||
losslessOnly: true,
|
||||
}),
|
||||
).toBe(true);
|
||||
});
|
||||
|
||||
it('genre filter disables pagination path', () => {
|
||||
expect(albumBrowseHasGenreFilter({ ...base, genres: ['Rock'] })).toBe(true);
|
||||
});
|
||||
|
||||
it('starred + lossless uses local intersect when index is on', () => {
|
||||
expect(albumBrowseStarredNeedsLocalIntersect({ ...base, starredOnly: true }, true, 's1')).toBe(
|
||||
false,
|
||||
);
|
||||
expect(
|
||||
albumBrowseStarredNeedsLocalIntersect(
|
||||
{ ...base, starredOnly: true, losslessOnly: true },
|
||||
true,
|
||||
's1',
|
||||
),
|
||||
).toBe(true);
|
||||
expect(
|
||||
albumBrowseStarredNeedsLocalIntersect(
|
||||
{ ...base, starredOnly: true, genres: ['Rock'] },
|
||||
true,
|
||||
's1',
|
||||
),
|
||||
).toBe(true);
|
||||
expect(
|
||||
albumBrowseStarredNeedsLocalIntersect(
|
||||
{ ...base, starredOnly: true, losslessOnly: true },
|
||||
false,
|
||||
's1',
|
||||
),
|
||||
).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('filterAlbumsByStarred', () => {
|
||||
const album: SubsonicAlbum = {
|
||||
id: 'a1',
|
||||
name: 'A',
|
||||
artist: 'X',
|
||||
artistId: 'x',
|
||||
songCount: 1,
|
||||
duration: 1,
|
||||
};
|
||||
|
||||
it('requires starred flag or a positive override', () => {
|
||||
expect(filterAlbumsByStarred([album], {})).toHaveLength(0);
|
||||
expect(filterAlbumsByStarred([{ ...album, starred: '2020-01-01' }], {})).toHaveLength(1);
|
||||
expect(filterAlbumsByStarred([album], { a1: true })).toHaveLength(1);
|
||||
expect(filterAlbumsByStarred([{ ...album, starred: '2020-01-01' }], { a1: false })).toHaveLength(0);
|
||||
});
|
||||
});
|
||||
|
||||
describe('compilationFilterClauses', () => {
|
||||
it('maps only/hide to local index filters', () => {
|
||||
expect(compilationFilterClauses('only')).toEqual([{ field: 'compilation', op: 'is_true' }]);
|
||||
expect(compilationFilterClauses('hide')).toEqual([{ field: 'compilation', op: 'eq', value: false }]);
|
||||
expect(compilationFilterClauses('all')).toEqual([]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('countGenresFromAlbums', () => {
|
||||
const album = (id: string, genre?: string): SubsonicAlbum => ({
|
||||
id,
|
||||
name: 'A',
|
||||
artist: 'X',
|
||||
artistId: 'a',
|
||||
songCount: 1,
|
||||
duration: 1,
|
||||
genre,
|
||||
});
|
||||
|
||||
it('returns genres sorted by album count descending', () => {
|
||||
expect(countGenresFromAlbums([
|
||||
album('1', 'Rock'),
|
||||
album('2', 'Jazz'),
|
||||
album('3', 'Rock'),
|
||||
album('4'),
|
||||
])).toEqual([
|
||||
{ genre: 'Rock', count: 2 },
|
||||
{ genre: 'Jazz', count: 1 },
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('filterAlbumsByYearBounds', () => {
|
||||
const albums: SubsonicAlbum[] = [
|
||||
{ id: '1', name: 'A', artist: 'X', artistId: 'a', songCount: 1, duration: 1, year: 1985 },
|
||||
{ id: '2', name: 'B', artist: 'Y', artistId: 'b', songCount: 1, duration: 1, year: 1995 },
|
||||
{ id: '3', name: 'C', artist: 'Z', artistId: 'c', songCount: 1, duration: 1, year: 2005 },
|
||||
];
|
||||
|
||||
it('filters with only from bound', () => {
|
||||
expect(filterAlbumsByYearBounds(albums, { from: 1990 }).map(a => a.id)).toEqual(['2', '3']);
|
||||
});
|
||||
|
||||
it('filters with only to bound', () => {
|
||||
expect(filterAlbumsByYearBounds(albums, { to: 1995 }).map(a => a.id)).toEqual(['1', '2']);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,71 @@
|
||||
/**
|
||||
* Albums browse: local index + Subsonic network paths.
|
||||
* Filters and types live in sibling modules; this file is the fetch entry point.
|
||||
*/
|
||||
export type { AlbumCompFilter } from './albumCompilation';
|
||||
export type {
|
||||
AlbumBrowseFetchCallbacks,
|
||||
AlbumBrowsePageResult,
|
||||
AlbumBrowseQuery,
|
||||
GenreFilterOption,
|
||||
} from './albumBrowseTypes';
|
||||
export {
|
||||
albumBrowseHasGenreFilter,
|
||||
albumBrowseHasServerFilters,
|
||||
filterAlbumsByCompilation,
|
||||
filterAlbumsByStarred,
|
||||
} from './albumBrowseFilters';
|
||||
export { runLocalAlbumBrowse } from './albumBrowseLocal';
|
||||
|
||||
import { countGenresFromAlbums, filterAlbumsByCompilation } from './albumBrowseFilters';
|
||||
import { runLocalAlbumBrowse } from './albumBrowseLocal';
|
||||
import { fetchAlbumBrowseNetwork } from './albumBrowseNetwork';
|
||||
import { fetchStarredAlbumBrowse } from './albumBrowseStarredFetch';
|
||||
import type {
|
||||
AlbumBrowseFetchCallbacks,
|
||||
AlbumBrowsePageResult,
|
||||
AlbumBrowseQuery,
|
||||
GenreFilterOption,
|
||||
} from './albumBrowseTypes';
|
||||
import { GENRE_ALBUM_FETCH_LIMIT } from './albumBrowseTypes';
|
||||
|
||||
/** Genres in albums matching all filters except genre (for combined-filter UI). */
|
||||
export async function fetchAlbumBrowseGenreOptions(
|
||||
serverId: string,
|
||||
indexEnabled: boolean,
|
||||
query: AlbumBrowseQuery,
|
||||
): Promise<GenreFilterOption[]> {
|
||||
const withoutGenre: AlbumBrowseQuery = { ...query, genres: [] };
|
||||
const page = await fetchAlbumBrowsePage(
|
||||
serverId,
|
||||
indexEnabled,
|
||||
withoutGenre,
|
||||
0,
|
||||
GENRE_ALBUM_FETCH_LIMIT,
|
||||
);
|
||||
return countGenresFromAlbums(filterAlbumsByCompilation(page.albums, query.compFilter));
|
||||
}
|
||||
|
||||
export async function fetchAlbumBrowsePage(
|
||||
serverId: string,
|
||||
indexEnabled: boolean,
|
||||
query: AlbumBrowseQuery,
|
||||
offset: number,
|
||||
pageSize: number,
|
||||
callbacks?: AlbumBrowseFetchCallbacks,
|
||||
): Promise<AlbumBrowsePageResult> {
|
||||
if (query.losslessOnly && (!indexEnabled || !serverId)) {
|
||||
return { albums: [], hasMore: false };
|
||||
}
|
||||
|
||||
if (query.starredOnly) {
|
||||
return fetchStarredAlbumBrowse(serverId, indexEnabled, query, offset, pageSize, callbacks);
|
||||
}
|
||||
|
||||
if (indexEnabled && serverId) {
|
||||
const local = await runLocalAlbumBrowse(serverId, query, offset, pageSize);
|
||||
if (local != null) return local;
|
||||
}
|
||||
|
||||
return fetchAlbumBrowseNetwork(query, offset, pageSize);
|
||||
}
|
||||
@@ -0,0 +1,82 @@
|
||||
import { libraryAdvancedSearch } from '../../api/library';
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import { libraryScopeForServer } from '../../api/subsonicClient';
|
||||
import { dedupeById } from '../dedupeById';
|
||||
import { albumToAlbum } from './advancedSearchLocal';
|
||||
import { sharedServerFilters } from './albumBrowseFilters';
|
||||
import { albumSortClauses, sortSubsonicAlbums } from './albumBrowseSort';
|
||||
import { libraryIsReady } from './libraryReady';
|
||||
import type { AlbumBrowsePageResult, AlbumBrowseQuery } from './albumBrowseTypes';
|
||||
import { GENRE_ALBUM_FETCH_LIMIT } from './albumBrowseTypes';
|
||||
|
||||
function markServerStarredAlbums(albums: SubsonicAlbum[]) {
|
||||
return albums.map(a => ({ ...a, starred: a.starred ?? 'true' }));
|
||||
}
|
||||
|
||||
/** Local index: combined genre + year + lossless filters (AND), genres OR union. */
|
||||
export async function runLocalAlbumBrowse(
|
||||
serverId: string,
|
||||
query: AlbumBrowseQuery,
|
||||
offset: number,
|
||||
pageSize: number,
|
||||
restrictAlbumIds?: string[],
|
||||
): Promise<AlbumBrowsePageResult | null> {
|
||||
if (!serverId || !(await libraryIsReady(serverId))) return null;
|
||||
|
||||
const scope = libraryScopeForServer(serverId) ?? undefined;
|
||||
const useServerStarredIds = restrictAlbumIds != null;
|
||||
const shared = sharedServerFilters(query, useServerStarredIds);
|
||||
const starredOnly = useServerStarredIds ? undefined : (query.starredOnly || undefined);
|
||||
|
||||
if (query.genres.length > 0) {
|
||||
if (offset > 0) return { albums: [], hasMore: false };
|
||||
try {
|
||||
const pages = await Promise.all(
|
||||
query.genres.map(genre =>
|
||||
libraryAdvancedSearch({
|
||||
serverId,
|
||||
libraryScope: scope,
|
||||
entityTypes: ['album'],
|
||||
filters: [{ field: 'genre', op: 'eq', value: genre }, ...shared],
|
||||
starredOnly,
|
||||
restrictAlbumIds: useServerStarredIds ? restrictAlbumIds : undefined,
|
||||
sort: albumSortClauses(query.sort),
|
||||
limit: GENRE_ALBUM_FETCH_LIMIT,
|
||||
offset: 0,
|
||||
skipTotals: true,
|
||||
}),
|
||||
),
|
||||
);
|
||||
if (pages.some(p => p.source !== 'local')) return null;
|
||||
let merged = dedupeById(pages.flatMap(p => p.albums.map(albumToAlbum)));
|
||||
if (useServerStarredIds) merged = markServerStarredAlbums(merged);
|
||||
return {
|
||||
albums: sortSubsonicAlbums(merged, query.sort),
|
||||
hasMore: false,
|
||||
};
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
const resp = await libraryAdvancedSearch({
|
||||
serverId,
|
||||
libraryScope: scope,
|
||||
entityTypes: ['album'],
|
||||
filters: shared,
|
||||
starredOnly,
|
||||
restrictAlbumIds: useServerStarredIds ? restrictAlbumIds : undefined,
|
||||
sort: albumSortClauses(query.sort),
|
||||
limit: pageSize,
|
||||
offset,
|
||||
skipTotals: true,
|
||||
});
|
||||
if (resp.source !== 'local') return null;
|
||||
let albums = resp.albums.map(albumToAlbum);
|
||||
if (useServerStarredIds) albums = markServerStarredAlbums(albums);
|
||||
return { albums, hasMore: albums.length === pageSize };
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,65 @@
|
||||
import { getAlbumList } from '../../api/subsonicLibrary';
|
||||
import { getAlbumsByGenre } from '../../api/subsonicGenres';
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import { dedupeById } from '../dedupeById';
|
||||
import {
|
||||
filterAlbumsByCompilation,
|
||||
filterAlbumsByYearBounds,
|
||||
} from './albumBrowseFilters';
|
||||
import { albumYearSubsonicParams } from './albumYearFilter';
|
||||
import { sortSubsonicAlbums } from './albumBrowseSort';
|
||||
import type { AlbumBrowsePageResult, AlbumBrowseQuery } from './albumBrowseTypes';
|
||||
import { GENRE_ALBUM_FETCH_LIMIT } from './albumBrowseTypes';
|
||||
|
||||
async function fetchByGenres(genres: string[]) {
|
||||
const results = await Promise.all(genres.map(g => getAlbumsByGenre(g, GENRE_ALBUM_FETCH_LIMIT, 0)));
|
||||
return dedupeById(results.flat());
|
||||
}
|
||||
|
||||
function applyNetworkPostFilters(albums: SubsonicAlbum[], query: AlbumBrowseQuery) {
|
||||
let out = albums;
|
||||
if (query.year) out = filterAlbumsByYearBounds(out, query.year);
|
||||
out = filterAlbumsByCompilation(out, query.compFilter);
|
||||
if (query.starredOnly) out = out.filter(a => !!a.starred);
|
||||
return sortSubsonicAlbums(out, query.sort);
|
||||
}
|
||||
|
||||
export async function fetchAlbumBrowseNetwork(
|
||||
query: AlbumBrowseQuery,
|
||||
offset: number,
|
||||
pageSize: number,
|
||||
): Promise<AlbumBrowsePageResult> {
|
||||
if (query.genres.length > 0) {
|
||||
if (offset > 0) return { albums: [], hasMore: false };
|
||||
const data = applyNetworkPostFilters(await fetchByGenres(query.genres), query);
|
||||
return { albums: data, hasMore: false };
|
||||
}
|
||||
|
||||
if (query.starredOnly) {
|
||||
const extra = query.year ? albumYearSubsonicParams(query.year) : {};
|
||||
const data = applyNetworkPostFilters(
|
||||
await getAlbumList('starred', pageSize, offset, extra),
|
||||
query,
|
||||
);
|
||||
return { albums: data, hasMore: data.length === pageSize };
|
||||
}
|
||||
|
||||
if (query.year) {
|
||||
const data = applyNetworkPostFilters(
|
||||
await getAlbumList(
|
||||
'byYear',
|
||||
pageSize,
|
||||
offset,
|
||||
albumYearSubsonicParams(query.year),
|
||||
),
|
||||
query,
|
||||
);
|
||||
return { albums: data, hasMore: data.length === pageSize };
|
||||
}
|
||||
|
||||
const data = applyNetworkPostFilters(
|
||||
await getAlbumList(query.sort, pageSize, offset, {}),
|
||||
query,
|
||||
);
|
||||
return { albums: data, hasMore: data.length === pageSize };
|
||||
}
|
||||
@@ -0,0 +1,21 @@
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import type { LibrarySortClause } from '../../api/library';
|
||||
|
||||
export type AlbumBrowseSort = 'alphabeticalByName' | 'alphabeticalByArtist';
|
||||
|
||||
export function albumSortClauses(sort: AlbumBrowseSort): LibrarySortClause[] {
|
||||
if (sort === 'alphabeticalByArtist') {
|
||||
return [{ field: 'artist', dir: 'asc' }];
|
||||
}
|
||||
return [{ field: 'name', dir: 'asc' }];
|
||||
}
|
||||
|
||||
export function sortSubsonicAlbums(albums: SubsonicAlbum[], sort: AlbumBrowseSort): SubsonicAlbum[] {
|
||||
const out = [...albums];
|
||||
out.sort((a, b) =>
|
||||
sort === 'alphabeticalByArtist'
|
||||
? a.artist.localeCompare(b.artist) || a.name.localeCompare(b.name)
|
||||
: a.name.localeCompare(b.name) || a.artist.localeCompare(b.artist),
|
||||
);
|
||||
return out;
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
|
||||
type StarredCacheEntry = {
|
||||
albums: SubsonicAlbum[];
|
||||
fetchedAt: number;
|
||||
};
|
||||
|
||||
const starredAlbumsByServer = new Map<string, StarredCacheEntry>();
|
||||
|
||||
/** Drop cached favorites for a server (after star/unstar or server switch). */
|
||||
export function invalidateStarredAlbumBrowseCache(serverId: string | null | undefined): void {
|
||||
if (!serverId) return;
|
||||
starredAlbumsByServer.delete(serverId);
|
||||
}
|
||||
|
||||
export function peekStarredAlbumBrowseCache(serverId: string): SubsonicAlbum[] | null {
|
||||
const entry = starredAlbumsByServer.get(serverId);
|
||||
return entry?.albums ?? null;
|
||||
}
|
||||
|
||||
export function setStarredAlbumBrowseCache(serverId: string, albums: SubsonicAlbum[]): void {
|
||||
starredAlbumsByServer.set(serverId, { albums, fetchedAt: Date.now() });
|
||||
}
|
||||
@@ -0,0 +1,85 @@
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import { peekStarredAlbumBrowseCache } from './albumBrowseStarredCache';
|
||||
import { refreshStarredAlbumIndexFromServer } from './starredAlbumIndexSync';
|
||||
import {
|
||||
albumBrowseStarredNeedsLocalIntersect,
|
||||
filterAlbumsByCompilation,
|
||||
filterAlbumsByYearBounds,
|
||||
} from './albumBrowseFilters';
|
||||
import { runLocalAlbumBrowse } from './albumBrowseLocal';
|
||||
import { sortSubsonicAlbums } from './albumBrowseSort';
|
||||
import type {
|
||||
AlbumBrowseFetchCallbacks,
|
||||
AlbumBrowsePageResult,
|
||||
AlbumBrowseQuery,
|
||||
} from './albumBrowseTypes';
|
||||
|
||||
function markServerStarredAlbums(albums: SubsonicAlbum[]): SubsonicAlbum[] {
|
||||
return albums.map(a => ({ ...a, starred: a.starred ?? 'true' }));
|
||||
}
|
||||
|
||||
function applyStarredNetworkPostFilters(
|
||||
albums: SubsonicAlbum[],
|
||||
query: AlbumBrowseQuery,
|
||||
): SubsonicAlbum[] {
|
||||
let out = albums;
|
||||
if (query.year) out = filterAlbumsByYearBounds(out, query.year);
|
||||
out = filterAlbumsByCompilation(out, query.compFilter);
|
||||
if (query.starredOnly) out = out.filter(a => !!a.starred);
|
||||
return sortSubsonicAlbums(out, query.sort);
|
||||
}
|
||||
|
||||
function paginateStarredAlbums(
|
||||
all: SubsonicAlbum[],
|
||||
query: AlbumBrowseQuery,
|
||||
offset: number,
|
||||
pageSize: number,
|
||||
): AlbumBrowsePageResult {
|
||||
const filtered = applyStarredNetworkPostFilters(all, query);
|
||||
const page = filtered.slice(offset, offset + pageSize);
|
||||
return { albums: page, hasMore: offset + pageSize < filtered.length };
|
||||
}
|
||||
|
||||
export async function fetchStarredAlbumBrowse(
|
||||
serverId: string,
|
||||
indexEnabled: boolean,
|
||||
query: AlbumBrowseQuery,
|
||||
offset: number,
|
||||
pageSize: number,
|
||||
callbacks?: AlbumBrowseFetchCallbacks,
|
||||
): Promise<AlbumBrowsePageResult> {
|
||||
const emitPartial = (page: AlbumBrowsePageResult | null) => {
|
||||
if (page && offset === 0 && page.albums.length > 0) {
|
||||
callbacks?.onPartial?.(page);
|
||||
}
|
||||
};
|
||||
|
||||
if (offset === 0) {
|
||||
const cached = peekStarredAlbumBrowseCache(serverId);
|
||||
if (cached?.length) {
|
||||
if (albumBrowseStarredNeedsLocalIntersect(query, indexEnabled, serverId)) {
|
||||
const fromCache = await runLocalAlbumBrowse(
|
||||
serverId,
|
||||
query,
|
||||
0,
|
||||
pageSize,
|
||||
cached.map(a => a.id),
|
||||
);
|
||||
emitPartial(fromCache);
|
||||
} else {
|
||||
emitPartial(paginateStarredAlbums(cached, query, 0, pageSize));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const serverAlbums = await refreshStarredAlbumIndexFromServer(serverId, indexEnabled);
|
||||
|
||||
if (albumBrowseStarredNeedsLocalIntersect(query, indexEnabled, serverId)) {
|
||||
const serverIds = serverAlbums.map(a => a.id);
|
||||
const authoritative = await runLocalAlbumBrowse(serverId, query, offset, pageSize, serverIds);
|
||||
if (authoritative != null) return authoritative;
|
||||
if (query.losslessOnly) return { albums: [], hasMore: false };
|
||||
}
|
||||
|
||||
return paginateStarredAlbums(serverAlbums, query, offset, pageSize);
|
||||
}
|
||||
@@ -0,0 +1,30 @@
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import type { AlbumYearBounds } from './albumYearFilter';
|
||||
import type { AlbumCompFilter } from './albumCompilation';
|
||||
import type { AlbumBrowseSort } from './albumBrowseSort';
|
||||
|
||||
export const GENRE_ALBUM_FETCH_LIMIT = 500;
|
||||
|
||||
export type AlbumBrowseQuery = {
|
||||
sort: AlbumBrowseSort;
|
||||
genres: string[];
|
||||
year?: AlbumYearBounds;
|
||||
losslessOnly: boolean;
|
||||
starredOnly: boolean;
|
||||
compFilter: AlbumCompFilter;
|
||||
};
|
||||
|
||||
export type AlbumBrowsePageResult = {
|
||||
albums: SubsonicAlbum[];
|
||||
hasMore: boolean;
|
||||
};
|
||||
|
||||
export type AlbumBrowseFetchCallbacks = {
|
||||
/** Earlier page (cache / local index) before server favorites refresh finishes. */
|
||||
onPartial?: (page: AlbumBrowsePageResult) => void;
|
||||
};
|
||||
|
||||
export type GenreFilterOption = {
|
||||
genre: string;
|
||||
count: number;
|
||||
};
|
||||
@@ -0,0 +1,24 @@
|
||||
import { libraryGetCatalogYearBounds } from '../../api/library';
|
||||
import { ALBUM_YEAR_MAX, ALBUM_YEAR_MIN, type AlbumCatalogYearRange } from './albumYearFilter';
|
||||
import { libraryIsReady } from './libraryReady';
|
||||
|
||||
const FALLBACK: AlbumCatalogYearRange = { min: ALBUM_YEAR_MIN, max: ALBUM_YEAR_MAX };
|
||||
|
||||
/** Indexed track years for Albums filter spinners (falls back when index is off). */
|
||||
export async function fetchAlbumCatalogYearBounds(
|
||||
serverId: string,
|
||||
indexEnabled: boolean,
|
||||
): Promise<AlbumCatalogYearRange> {
|
||||
if (!serverId || !indexEnabled || !(await libraryIsReady(serverId))) {
|
||||
return FALLBACK;
|
||||
}
|
||||
try {
|
||||
const b = await libraryGetCatalogYearBounds({ serverId });
|
||||
if (b.minYear != null && b.maxYear != null && b.minYear <= b.maxYear) {
|
||||
return { min: b.minYear, max: b.maxYear };
|
||||
}
|
||||
} catch {
|
||||
/* ignore */
|
||||
}
|
||||
return FALLBACK;
|
||||
}
|
||||
@@ -0,0 +1,58 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import {
|
||||
albumBrowseCompScanComplete,
|
||||
albumIsCompilation,
|
||||
ALBUM_COMP_FILTER_MAX_SCAN_ALBUMS,
|
||||
} from './albumCompilation';
|
||||
import { filterAlbumsByCompilation } from './albumBrowseFilters';
|
||||
|
||||
const album = (
|
||||
overrides: Partial<SubsonicAlbum> & { compilation?: boolean } = {},
|
||||
): SubsonicAlbum => ({
|
||||
id: '1',
|
||||
name: 'A',
|
||||
artist: 'X',
|
||||
artistId: 'a',
|
||||
songCount: 1,
|
||||
duration: 1,
|
||||
...overrides,
|
||||
});
|
||||
|
||||
describe('albumIsCompilation', () => {
|
||||
it('reads isCompilation, compilation, releaseTypes, and VA artist', () => {
|
||||
expect(albumIsCompilation(album({ isCompilation: true }))).toBe(true);
|
||||
expect(albumIsCompilation(album({ compilation: true }))).toBe(true);
|
||||
expect(albumIsCompilation(album({ releaseTypes: ['Live', 'Compilation'] }))).toBe(true);
|
||||
expect(albumIsCompilation(album({ artist: 'Various Artists' }))).toBe(true);
|
||||
expect(albumIsCompilation(album())).toBe(false);
|
||||
});
|
||||
});
|
||||
|
||||
describe('filterAlbumsByCompilation', () => {
|
||||
const albums = [
|
||||
album({ id: 'c', isCompilation: true }),
|
||||
album({ id: 'n' }),
|
||||
];
|
||||
|
||||
it('keeps only compilations', () => {
|
||||
expect(filterAlbumsByCompilation(albums, 'only').map(a => a.id)).toEqual(['c']);
|
||||
});
|
||||
|
||||
it('hides compilations', () => {
|
||||
expect(filterAlbumsByCompilation(albums, 'hide').map(a => a.id)).toEqual(['n']);
|
||||
});
|
||||
});
|
||||
|
||||
describe('albumBrowseCompScanComplete', () => {
|
||||
it('stops after scan budget when more pages exist', () => {
|
||||
const loaded = Array.from({ length: ALBUM_COMP_FILTER_MAX_SCAN_ALBUMS }, (_, i) =>
|
||||
album({ id: String(i) }),
|
||||
);
|
||||
expect(albumBrowseCompScanComplete(loaded, 'only', true)).toBe(true);
|
||||
});
|
||||
|
||||
it('continues while under budget', () => {
|
||||
expect(albumBrowseCompScanComplete([album()], 'only', true)).toBe(false);
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,31 @@
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
|
||||
export type AlbumCompFilter = 'all' | 'only' | 'hide';
|
||||
|
||||
/** Max albums to scan client-side for compilation filter before showing empty. */
|
||||
export const ALBUM_COMP_FILTER_MAX_SCAN_ALBUMS = 500;
|
||||
|
||||
const VARIOUS_ARTISTS = /\bvarious artists\b/i;
|
||||
|
||||
/** OpenSubsonic / Navidrome: `compilation`, `isCompilation`, `releaseTypes`, or VA artist. */
|
||||
export function albumIsCompilation(a: SubsonicAlbum): boolean {
|
||||
if (a.isCompilation === true) return true;
|
||||
const loose = a as SubsonicAlbum & { compilation?: boolean };
|
||||
if (loose.compilation === true) return true;
|
||||
if (a.releaseTypes?.some(t => /^compilation$/i.test(t.trim()))) return true;
|
||||
const artist = (a.artist ?? '').trim();
|
||||
const displayArtist = (a.displayArtist ?? '').trim();
|
||||
return VARIOUS_ARTISTS.test(artist) || VARIOUS_ARTISTS.test(displayArtist);
|
||||
}
|
||||
|
||||
/** Stop paginating when the catalog tail is reached or the scan budget is spent. */
|
||||
export function albumBrowseCompScanComplete(
|
||||
loadedAlbums: SubsonicAlbum[],
|
||||
compFilter: AlbumCompFilter,
|
||||
hasMore: boolean,
|
||||
): boolean {
|
||||
if (compFilter === 'all') return true;
|
||||
if (!hasMore) return true;
|
||||
if (loadedAlbums.length >= ALBUM_COMP_FILTER_MAX_SCAN_ALBUMS) return true;
|
||||
return false;
|
||||
}
|
||||
@@ -0,0 +1,98 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import {
|
||||
albumYearFilterClauses,
|
||||
albumYearSubsonicParams,
|
||||
clampAlbumYearFieldInput,
|
||||
formatAlbumYearFilterLabel,
|
||||
normalizeAlbumYearToFieldChange,
|
||||
resolveAlbumYearBounds,
|
||||
stepAlbumYearField,
|
||||
} from './albumYearFilter';
|
||||
|
||||
describe('resolveAlbumYearBounds', () => {
|
||||
it('is inactive when both fields are empty', () => {
|
||||
expect(resolveAlbumYearBounds('', '')).toEqual({ active: false, bounds: {} });
|
||||
});
|
||||
|
||||
it('is active with only from', () => {
|
||||
expect(resolveAlbumYearBounds('1990', '')).toEqual({
|
||||
active: true,
|
||||
bounds: { from: 1990 },
|
||||
});
|
||||
});
|
||||
|
||||
it('is active with only to', () => {
|
||||
expect(resolveAlbumYearBounds('', '2005')).toEqual({
|
||||
active: true,
|
||||
bounds: { to: 2005 },
|
||||
});
|
||||
});
|
||||
|
||||
it('is active with both bounds', () => {
|
||||
expect(resolveAlbumYearBounds('1980', '1999')).toEqual({
|
||||
active: true,
|
||||
bounds: { from: 1980, to: 1999 },
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe('albumYearFilterClauses', () => {
|
||||
it('uses gte for open-ended from', () => {
|
||||
expect(albumYearFilterClauses({ from: 2000 })).toEqual([
|
||||
{ field: 'year', op: 'gte', value: 2000 },
|
||||
]);
|
||||
});
|
||||
|
||||
it('uses lte for open-ended to', () => {
|
||||
expect(albumYearFilterClauses({ to: 2010 })).toEqual([
|
||||
{ field: 'year', op: 'lte', value: 2010 },
|
||||
]);
|
||||
});
|
||||
});
|
||||
|
||||
describe('formatAlbumYearFilterLabel', () => {
|
||||
const catalog = { min: 1975, max: 2020 };
|
||||
|
||||
it('formats partial ranges using catalog edges', () => {
|
||||
expect(formatAlbumYearFilterLabel({ from: 1990 }, catalog)).toBe('1990–2020');
|
||||
expect(formatAlbumYearFilterLabel({ to: 2000 }, catalog)).toBe('1975–2000');
|
||||
expect(formatAlbumYearFilterLabel({ from: 2000, to: 2010 }, catalog)).toBe('2000–2010');
|
||||
});
|
||||
|
||||
it('collapses when the only bound equals the implied catalog edge', () => {
|
||||
expect(formatAlbumYearFilterLabel({ from: 2020 }, catalog)).toBe('2020');
|
||||
expect(formatAlbumYearFilterLabel({ to: 1975 }, catalog)).toBe('1975');
|
||||
});
|
||||
});
|
||||
|
||||
describe('albumYearSubsonicParams', () => {
|
||||
it('omits unset bounds', () => {
|
||||
expect(albumYearSubsonicParams({ from: 1995 })).toEqual({ fromYear: 1995 });
|
||||
expect(albumYearSubsonicParams({ to: 2010 })).toEqual({ toYear: 2010 });
|
||||
});
|
||||
});
|
||||
|
||||
describe('album year spinner helpers', () => {
|
||||
const min = 1975;
|
||||
const max = 2020;
|
||||
|
||||
it('steps from field from catalog min when empty', () => {
|
||||
expect(stepAlbumYearField('', 1, min, max, 'min')).toBe('1976');
|
||||
expect(stepAlbumYearField('', 0, min, max, 'min')).toBe('1975');
|
||||
});
|
||||
|
||||
it('steps to field from catalog max when empty', () => {
|
||||
expect(stepAlbumYearField('', -1, min, max, 'max')).toBe('2019');
|
||||
expect(stepAlbumYearField('', 0, min, max, 'max')).toBe('2020');
|
||||
});
|
||||
|
||||
it('clamps typed values to catalog bounds', () => {
|
||||
expect(clampAlbumYearFieldInput('1960', min, max)).toBe('1975');
|
||||
expect(clampAlbumYearFieldInput('2030', min, max)).toBe('2020');
|
||||
});
|
||||
|
||||
it('maps first native spinner tick on empty to field to max', () => {
|
||||
expect(normalizeAlbumYearToFieldChange('', '1975', min, max)).toBe('2020');
|
||||
expect(normalizeAlbumYearToFieldChange('2010', '1975', min, max)).toBe('1975');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,121 @@
|
||||
import type { LibraryFilterClause } from '../../api/library';
|
||||
|
||||
export const ALBUM_YEAR_MIN = 1900;
|
||||
export const ALBUM_YEAR_MAX = new Date().getFullYear();
|
||||
/** Delay before year filter triggers album browse reload. */
|
||||
export const ALBUM_YEAR_FILTER_DEBOUNCE_MS = 350;
|
||||
|
||||
export type AlbumCatalogYearRange = { min: number; max: number };
|
||||
|
||||
export function clampAlbumYear(n: number, min: number, max: number): number {
|
||||
return Math.min(max, Math.max(min, n));
|
||||
}
|
||||
|
||||
/** Spinner / wheel step; empty field starts at `startEdge` of the catalog range. */
|
||||
export function stepAlbumYearField(
|
||||
raw: string,
|
||||
delta: number,
|
||||
min: number,
|
||||
max: number,
|
||||
startEdge: 'min' | 'max',
|
||||
): string {
|
||||
const start = startEdge === 'min' ? min : max;
|
||||
const current = raw.trim() ? (parseAlbumYearField(raw) ?? start) : start;
|
||||
return String(clampAlbumYear(current + delta, min, max));
|
||||
}
|
||||
|
||||
export function clampAlbumYearFieldInput(
|
||||
raw: string,
|
||||
min: number,
|
||||
max: number,
|
||||
): string {
|
||||
if (!raw.trim()) return '';
|
||||
const n = parseAlbumYearField(raw);
|
||||
if (n == null) return '';
|
||||
return String(clampAlbumYear(n, min, max));
|
||||
}
|
||||
|
||||
/** Native number spinners jump to `min` from empty — map the "to" field to catalog max. */
|
||||
export function normalizeAlbumYearToFieldChange(
|
||||
prevTo: string,
|
||||
nextRaw: string,
|
||||
catalogMin: number,
|
||||
catalogMax: number,
|
||||
): string {
|
||||
if (!prevTo.trim() && nextRaw === String(catalogMin) && catalogMin !== catalogMax) {
|
||||
return String(catalogMax);
|
||||
}
|
||||
return clampAlbumYearFieldInput(nextRaw, catalogMin, catalogMax);
|
||||
}
|
||||
|
||||
export type AlbumYearBounds = { from?: number; to?: number };
|
||||
|
||||
export function parseAlbumYearField(raw: string): number | null {
|
||||
const n = parseInt(raw.trim(), 10);
|
||||
if (Number.isNaN(n) || n < 1) return null;
|
||||
return n;
|
||||
}
|
||||
|
||||
export function resolveAlbumYearBounds(from: string, to: string): {
|
||||
active: boolean;
|
||||
bounds: AlbumYearBounds;
|
||||
} {
|
||||
const fromN = parseAlbumYearField(from);
|
||||
const toN = parseAlbumYearField(to);
|
||||
if (fromN == null && toN == null) {
|
||||
return { active: false, bounds: {} };
|
||||
}
|
||||
return {
|
||||
active: true,
|
||||
bounds: {
|
||||
...(fromN != null ? { from: fromN } : {}),
|
||||
...(toN != null ? { to: toN } : {}),
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
/** Chip label; open-ended bounds show catalog (or default) min/max on the missing side. */
|
||||
export function formatAlbumYearFilterLabel(
|
||||
bounds: AlbumYearBounds,
|
||||
catalog?: AlbumCatalogYearRange,
|
||||
): string | null {
|
||||
const catalogMin = catalog?.min ?? ALBUM_YEAR_MIN;
|
||||
const catalogMax = catalog?.max ?? ALBUM_YEAR_MAX;
|
||||
|
||||
if (bounds.from != null && bounds.to != null) {
|
||||
const lo = Math.min(bounds.from, bounds.to);
|
||||
const hi = Math.max(bounds.from, bounds.to);
|
||||
return lo === hi ? String(lo) : `${lo}–${hi}`;
|
||||
}
|
||||
if (bounds.from != null) {
|
||||
const hi = catalogMax;
|
||||
return bounds.from === hi ? String(bounds.from) : `${bounds.from}–${hi}`;
|
||||
}
|
||||
if (bounds.to != null) {
|
||||
const lo = catalogMin;
|
||||
return bounds.to === lo ? String(bounds.to) : `${lo}–${bounds.to}`;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
||||
export function albumYearFilterClauses(bounds: AlbumYearBounds): LibraryFilterClause[] {
|
||||
const clauses: LibraryFilterClause[] = [];
|
||||
if (bounds.from != null && bounds.to != null) {
|
||||
const lo = Math.min(bounds.from, bounds.to);
|
||||
const hi = Math.max(bounds.from, bounds.to);
|
||||
clauses.push({ field: 'year', op: 'between', value: lo, valueTo: hi });
|
||||
} else if (bounds.from != null) {
|
||||
clauses.push({ field: 'year', op: 'gte', value: bounds.from });
|
||||
} else if (bounds.to != null) {
|
||||
clauses.push({ field: 'year', op: 'lte', value: bounds.to });
|
||||
}
|
||||
return clauses;
|
||||
}
|
||||
|
||||
/** Params for Subsonic `getAlbumList2` `byYear` when the local index is unavailable. */
|
||||
export function albumYearSubsonicParams(bounds: AlbumYearBounds): Record<string, number> {
|
||||
const out: Record<string, number> = {};
|
||||
if (bounds.from != null) out.fromYear = bounds.from;
|
||||
if (bounds.to != null) out.toYear = bounds.to;
|
||||
return out;
|
||||
}
|
||||
@@ -1,6 +1,7 @@
|
||||
/**
|
||||
* Browse-page text search — local index vs network race (LiveSearch / AdvancedSearch pattern).
|
||||
*/
|
||||
import { getStarred } from '../../api/subsonicStarRating';
|
||||
import { search, searchSongsPaged } from '../../api/subsonicSearch';
|
||||
import type { SearchResults, SubsonicAlbum, SubsonicArtist, SubsonicSong } from '../../api/subsonicTypes';
|
||||
import { libraryAdvancedSearch, libraryGetArtistLosslessBrowse, libraryListLosslessAlbums } from '../../api/library';
|
||||
@@ -9,7 +10,7 @@ import {
|
||||
LIVE_SEARCH_DEBOUNCE_NETWORK_MS,
|
||||
LIVE_SEARCH_DEBOUNCE_RACE_MS,
|
||||
} from './liveSearchLocal';
|
||||
import type { LibraryFilterClause, LibrarySortClause } from '../../api/library';
|
||||
import type { LibrarySortClause } from '../../api/library';
|
||||
import { dedupeById } from '../dedupeById';
|
||||
import {
|
||||
albumToAlbum,
|
||||
@@ -20,6 +21,7 @@ import {
|
||||
trackToSong,
|
||||
type LocalSearchOpts,
|
||||
} from './advancedSearchLocal';
|
||||
import type { AlbumYearBounds } from './albumYearFilter';
|
||||
import {
|
||||
logLibrarySearch,
|
||||
timed,
|
||||
@@ -329,14 +331,11 @@ export async function loadMoreLocalBrowseSongs(
|
||||
return loadMoreLocalSongs(serverId, songBrowseOpts(query), offset, pageSize);
|
||||
}
|
||||
|
||||
export type AlbumBrowseSort = 'alphabeticalByName' | 'alphabeticalByArtist';
|
||||
|
||||
function albumSortClauses(sort: AlbumBrowseSort): LibrarySortClause[] {
|
||||
if (sort === 'alphabeticalByArtist') {
|
||||
return [{ field: 'artist', dir: 'asc' }];
|
||||
}
|
||||
return [{ field: 'name', dir: 'asc' }];
|
||||
}
|
||||
export type { AlbumBrowseSort } from './albumBrowseSort';
|
||||
export { albumSortClauses, sortSubsonicAlbums } from './albumBrowseSort';
|
||||
import { albumSortClauses, type AlbumBrowseSort } from './albumBrowseSort';
|
||||
import { runLocalAlbumBrowse, type AlbumBrowseQuery } from './albumBrowseLoad';
|
||||
import { GENRE_ALBUM_FETCH_LIMIT } from './albumBrowseTypes';
|
||||
|
||||
/**
|
||||
* Random track sample from the local `track` table — SQLite `ORDER BY RANDOM() LIMIT N`.
|
||||
@@ -442,44 +441,22 @@ export async function runLocalAlbumBrowsePage(
|
||||
sort: AlbumBrowseSort,
|
||||
offset: number,
|
||||
pageSize: number,
|
||||
yearFilter?: { from: number; to: number },
|
||||
yearFilter?: AlbumYearBounds,
|
||||
losslessOnly?: boolean,
|
||||
): Promise<SubsonicAlbum[] | null> {
|
||||
if (!serverId || !(await libraryIsReady(serverId))) return null;
|
||||
const filters: LibraryFilterClause[] = [];
|
||||
if (yearFilter) {
|
||||
filters.push({
|
||||
field: 'year',
|
||||
op: 'between',
|
||||
value: yearFilter.from,
|
||||
valueTo: yearFilter.to,
|
||||
});
|
||||
}
|
||||
if (losslessOnly) {
|
||||
filters.push({ field: 'lossless', op: 'is_true' });
|
||||
}
|
||||
try {
|
||||
const resp = await libraryAdvancedSearch({
|
||||
serverId,
|
||||
libraryScope: libraryScopeForServer(serverId) ?? undefined,
|
||||
entityTypes: ['album'],
|
||||
filters,
|
||||
sort: yearFilter
|
||||
? [{ field: 'year', dir: 'desc' }, { field: 'name', dir: 'asc' }]
|
||||
: albumSortClauses(sort),
|
||||
limit: pageSize,
|
||||
offset,
|
||||
skipTotals: true,
|
||||
});
|
||||
if (resp.source !== 'local') return null;
|
||||
return resp.albums.map(albumToAlbum);
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
if (!serverId) return null;
|
||||
const query: AlbumBrowseQuery = {
|
||||
sort,
|
||||
genres: [],
|
||||
year: yearFilter,
|
||||
losslessOnly: !!losslessOnly,
|
||||
starredOnly: false,
|
||||
compFilter: 'all',
|
||||
};
|
||||
const page = await runLocalAlbumBrowse(serverId, query, offset, pageSize);
|
||||
return page?.albums ?? null;
|
||||
}
|
||||
|
||||
const GENRE_ALBUM_FETCH_LIMIT = 500;
|
||||
|
||||
/** Genre-filtered album union for All Albums / Random Albums genre bar. */
|
||||
export async function runLocalAlbumsByGenres(
|
||||
serverId: string | null | undefined,
|
||||
@@ -488,34 +465,16 @@ export async function runLocalAlbumsByGenres(
|
||||
limitPerGenre = GENRE_ALBUM_FETCH_LIMIT,
|
||||
losslessOnly?: boolean,
|
||||
): Promise<SubsonicAlbum[] | null> {
|
||||
if (!serverId || !(await libraryIsReady(serverId)) || genres.length === 0) return null;
|
||||
try {
|
||||
const pages = await Promise.all(
|
||||
genres.map(genre => {
|
||||
const filters: LibraryFilterClause[] = [{ field: 'genre', op: 'eq', value: genre }];
|
||||
if (losslessOnly) filters.push({ field: 'lossless', op: 'is_true' });
|
||||
return libraryAdvancedSearch({
|
||||
serverId,
|
||||
libraryScope: libraryScopeForServer(serverId) ?? undefined,
|
||||
entityTypes: ['album'],
|
||||
filters,
|
||||
sort: albumSortClauses(sort),
|
||||
limit: limitPerGenre,
|
||||
offset: 0,
|
||||
skipTotals: true,
|
||||
});
|
||||
}),
|
||||
);
|
||||
if (pages.some(p => p.source !== 'local')) return null;
|
||||
const merged = dedupeById(pages.flatMap(p => p.albums.map(albumToAlbum)));
|
||||
return merged.sort((a, b) =>
|
||||
sort === 'alphabeticalByArtist'
|
||||
? a.artist.localeCompare(b.artist) || a.name.localeCompare(b.name)
|
||||
: a.name.localeCompare(b.name) || a.artist.localeCompare(b.artist),
|
||||
);
|
||||
} catch {
|
||||
return null;
|
||||
}
|
||||
if (!serverId || genres.length === 0) return null;
|
||||
const query: AlbumBrowseQuery = {
|
||||
sort,
|
||||
genres,
|
||||
losslessOnly: !!losslessOnly,
|
||||
starredOnly: false,
|
||||
compFilter: 'all',
|
||||
};
|
||||
const page = await runLocalAlbumBrowse(serverId, query, 0, limitPerGenre);
|
||||
return page?.albums ?? null;
|
||||
}
|
||||
|
||||
/** Local artist table browse-all when the index is ready (optional fast path). */
|
||||
@@ -539,3 +498,9 @@ export async function runLocalBrowseAllArtists(
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
/** Starred artists from `getStarred2` (artist-level only; server is source of truth). */
|
||||
export async function fetchNetworkStarredArtists(): Promise<SubsonicArtist[]> {
|
||||
const { artists } = await getStarred();
|
||||
return artists.map(a => ({ ...a, starred: a.starred ?? 'true' }));
|
||||
}
|
||||
|
||||
@@ -10,13 +10,22 @@ type TrackPatch = {
|
||||
playedAt?: number | null;
|
||||
};
|
||||
|
||||
/** Optional metadata on star/unstar (album/artist); not mirrored into the local index. */
|
||||
export type StarPatchMeta = {
|
||||
name?: string;
|
||||
artist?: string;
|
||||
artistId?: string;
|
||||
coverArtId?: string;
|
||||
year?: number;
|
||||
albumCount?: number;
|
||||
};
|
||||
|
||||
/**
|
||||
* Patch-on-use (spec §6.5 / F3): after a successful star / rating / scrobble,
|
||||
* mirror the change into the local library index so its reads (browse F1,
|
||||
* advanced search F2) reflect the action immediately — no stale list after a
|
||||
* rate, no full resync. Skipped when the index is off for the server; the Rust
|
||||
* command additionally no-ops when no row exists / the id is not a track.
|
||||
* Fire-and-forget: never throws, never blocks the originating network action.
|
||||
* Patch-on-use (spec §6.5 / F3): after a successful star / rating / scrobble on a
|
||||
* **track**, mirror the change into the local library index. Skipped when the index
|
||||
* is off; Rust no-ops when no row exists. Fire-and-forget.
|
||||
*
|
||||
* Album/artist stars are server-only on browse (no stub rows, no `artist.starred_at`).
|
||||
*/
|
||||
export function patchLibraryTrackOnUse(
|
||||
serverId: string | null | undefined,
|
||||
|
||||
@@ -0,0 +1,44 @@
|
||||
import { libraryReconcileAlbumStars } from '../../api/library';
|
||||
import { getStarred } from '../../api/subsonicStarRating';
|
||||
import type { SubsonicAlbum } from '../../api/subsonicTypes';
|
||||
import {
|
||||
invalidateStarredAlbumBrowseCache,
|
||||
setStarredAlbumBrowseCache,
|
||||
} from './albumBrowseStarredCache';
|
||||
|
||||
function parseAlbumStarredAtMs(album: SubsonicAlbum): number {
|
||||
if (!album.starred) return Date.now();
|
||||
const parsed = Date.parse(album.starred);
|
||||
return Number.isFinite(parsed) ? parsed : Date.now();
|
||||
}
|
||||
|
||||
function markServerStarredAlbums(albums: SubsonicAlbum[]): SubsonicAlbum[] {
|
||||
return albums.map(a => ({ ...a, starred: a.starred ?? 'true' }));
|
||||
}
|
||||
|
||||
/**
|
||||
* `getStarred2` → `album.starred_at` in the local index (UPDATE only).
|
||||
* Updates the in-memory favorites cache used for instant Albums browse.
|
||||
*/
|
||||
export async function refreshStarredAlbumIndexFromServer(
|
||||
serverId: string,
|
||||
indexEnabled: boolean,
|
||||
): Promise<SubsonicAlbum[]> {
|
||||
const { albums } = await getStarred();
|
||||
const mapped = markServerStarredAlbums(albums);
|
||||
if (indexEnabled) {
|
||||
await libraryReconcileAlbumStars({
|
||||
serverId,
|
||||
starredAlbums: mapped.map(a => ({
|
||||
id: a.id,
|
||||
starredAt: parseAlbumStarredAtMs(a),
|
||||
})),
|
||||
});
|
||||
}
|
||||
setStarredAlbumBrowseCache(serverId, mapped);
|
||||
return mapped;
|
||||
}
|
||||
|
||||
export function invalidateStarredAlbumBrowse(serverId: string | null | undefined): void {
|
||||
invalidateStarredAlbumBrowseCache(serverId);
|
||||
}
|
||||
Reference in New Issue
Block a user