fix override query behavior on list pages

This commit is contained in:
jeffvli
2025-11-28 14:34:15 -08:00
parent 60d8d18a0f
commit 3f8a3a5e03
6 changed files with 74 additions and 20 deletions
@@ -70,6 +70,7 @@ export const AlbumListView = ({
} }
return { return {
...query,
...overrideQuery, ...overrideQuery,
sortBy: overrideQuery.sortBy || query.sortBy, sortBy: overrideQuery.sortBy || query.sortBy,
sortOrder: overrideQuery.sortOrder || query.sortOrder, sortOrder: overrideQuery.sortOrder || query.sortOrder,
@@ -1,4 +1,4 @@
import { lazy, Suspense } from 'react'; import { lazy, Suspense, useMemo } from 'react';
import { useAlbumArtistListFilters } from '/@/renderer/features/artists/hooks/use-album-artist-list-filters'; import { useAlbumArtistListFilters } from '/@/renderer/features/artists/hooks/use-album-artist-list-filters';
import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store'; import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store';
@@ -70,6 +70,19 @@ export const AlbumArtistListView = ({
const { query } = useAlbumArtistListFilters(); const { query } = useAlbumArtistListFilters();
const mergedQuery = useMemo(() => {
if (!overrideQuery) {
return query;
}
return {
...query,
...overrideQuery,
sortBy: overrideQuery.sortBy || query.sortBy,
sortOrder: overrideQuery.sortOrder || query.sortOrder,
};
}, [query, overrideQuery]);
switch (display) { switch (display) {
case ListDisplayType.GRID: { case ListDisplayType.GRID: {
switch (pagination) { switch (pagination) {
@@ -79,7 +92,7 @@ export const AlbumArtistListView = ({
gap={grid.itemGap} gap={grid.itemGap}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined} itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
/> />
); );
@@ -90,7 +103,7 @@ export const AlbumArtistListView = ({
gap={grid.itemGap} gap={grid.itemGap}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined} itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
/> />
); );
@@ -111,7 +124,7 @@ export const AlbumArtistListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight} enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders} enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
size={table.size} size={table.size}
/> />
@@ -127,7 +140,7 @@ export const AlbumArtistListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight} enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders} enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
size={table.size} size={table.size}
/> />
@@ -1,4 +1,4 @@
import { lazy, Suspense } from 'react'; import { lazy, Suspense, useMemo } from 'react';
import { useArtistListFilters } from '/@/renderer/features/artists/hooks/use-artist-list-filters'; import { useArtistListFilters } from '/@/renderer/features/artists/hooks/use-artist-list-filters';
import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store'; import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store';
@@ -62,6 +62,19 @@ export const ArtistListView = ({
const { query } = useArtistListFilters(); const { query } = useArtistListFilters();
const mergedQuery = useMemo(() => {
if (!overrideQuery) {
return query;
}
return {
...query,
...overrideQuery,
sortBy: overrideQuery.sortBy || query.sortBy,
sortOrder: overrideQuery.sortOrder || query.sortOrder,
};
}, [query, overrideQuery]);
switch (display) { switch (display) {
case ListDisplayType.GRID: { case ListDisplayType.GRID: {
switch (pagination) { switch (pagination) {
@@ -71,7 +84,7 @@ export const ArtistListView = ({
gap={grid.itemGap} gap={grid.itemGap}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined} itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
/> />
); );
@@ -82,7 +95,7 @@ export const ArtistListView = ({
gap={grid.itemGap} gap={grid.itemGap}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined} itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
/> />
); );
@@ -103,7 +116,7 @@ export const ArtistListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight} enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders} enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
size={table.size} size={table.size}
/> />
@@ -119,7 +132,7 @@ export const ArtistListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight} enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders} enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
size={table.size} size={table.size}
/> />
@@ -1,4 +1,4 @@
import { lazy, Suspense } from 'react'; import { lazy, Suspense, useMemo } from 'react';
import { useGenreListFilters } from '/@/renderer/features/genres/hooks/use-genre-list-filters'; import { useGenreListFilters } from '/@/renderer/features/genres/hooks/use-genre-list-filters';
import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store'; import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store';
@@ -58,6 +58,19 @@ export const GenreListView = ({
const { query } = useGenreListFilters(); const { query } = useGenreListFilters();
const mergedQuery = useMemo(() => {
if (!overrideQuery) {
return query;
}
return {
...query,
...overrideQuery,
sortBy: overrideQuery.sortBy || query.sortBy,
sortOrder: overrideQuery.sortOrder || query.sortOrder,
};
}, [query, overrideQuery]);
switch (display) { switch (display) {
case ListDisplayType.GRID: { case ListDisplayType.GRID: {
switch (pagination) { switch (pagination) {
@@ -67,7 +80,7 @@ export const GenreListView = ({
gap={grid.itemGap} gap={grid.itemGap}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined} itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
/> />
); );
@@ -78,7 +91,7 @@ export const GenreListView = ({
gap={grid.itemGap} gap={grid.itemGap}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined} itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
/> />
); );
@@ -99,7 +112,7 @@ export const GenreListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight} enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders} enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
size={table.size} size={table.size}
/> />
@@ -115,7 +128,7 @@ export const GenreListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight} enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders} enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
size={table.size} size={table.size}
/> />
@@ -1,4 +1,4 @@
import { lazy, Suspense } from 'react'; import { lazy, Suspense, useMemo } from 'react';
import { usePlaylistListFilters } from '/@/renderer/features/playlists/hooks/use-playlist-list-filters'; import { usePlaylistListFilters } from '/@/renderer/features/playlists/hooks/use-playlist-list-filters';
import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store'; import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store';
@@ -68,6 +68,19 @@ export const PlaylistListView = ({
const { query } = usePlaylistListFilters(); const { query } = usePlaylistListFilters();
const mergedQuery = useMemo(() => {
if (!overrideQuery) {
return query;
}
return {
...query,
...overrideQuery,
sortBy: overrideQuery.sortBy || query.sortBy,
sortOrder: overrideQuery.sortOrder || query.sortOrder,
};
}, [query, overrideQuery]);
switch (display) { switch (display) {
case ListDisplayType.GRID: { case ListDisplayType.GRID: {
switch (pagination) { switch (pagination) {
@@ -77,7 +90,7 @@ export const PlaylistListView = ({
gap={grid.itemGap} gap={grid.itemGap}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined} itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
/> />
); );
@@ -88,7 +101,7 @@ export const PlaylistListView = ({
gap={grid.itemGap} gap={grid.itemGap}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined} itemsPerRow={grid.itemsPerRowEnabled ? grid.itemsPerRow : undefined}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
/> />
); );
@@ -109,7 +122,7 @@ export const PlaylistListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight} enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders} enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
size={table.size} size={table.size}
/> />
@@ -125,7 +138,7 @@ export const PlaylistListView = ({
enableRowHoverHighlight={table.enableRowHoverHighlight} enableRowHoverHighlight={table.enableRowHoverHighlight}
enableVerticalBorders={table.enableVerticalBorders} enableVerticalBorders={table.enableVerticalBorders}
itemsPerPage={itemsPerPage} itemsPerPage={itemsPerPage}
query={overrideQuery ?? query} query={mergedQuery}
serverId={server.id} serverId={server.id}
size={table.size} size={table.size}
/> />
@@ -67,6 +67,7 @@ export const SongListView = ({
} }
return { return {
...query,
...overrideQuery, ...overrideQuery,
sortBy: overrideQuery.sortBy || query.sortBy, sortBy: overrideQuery.sortBy || query.sortBy,
sortOrder: overrideQuery.sortOrder || query.sortOrder, sortOrder: overrideQuery.sortOrder || query.sortOrder,