diff --git a/src/renderer/components/item-list/helpers/item-list-infinite-loader.ts b/src/renderer/components/item-list/helpers/item-list-infinite-loader.ts index 595165cc3..7995a2058 100644 --- a/src/renderer/components/item-list/helpers/item-list-infinite-loader.ts +++ b/src/renderer/components/item-list/helpers/item-list-infinite-loader.ts @@ -8,6 +8,7 @@ import throttle from 'lodash/throttle'; import { useCallback, useEffect, useMemo, useRef } from 'react'; import { queryKeys } from '/@/renderer/api/query-keys'; +import { useListContext } from '/@/renderer/context/list-context'; import { eventEmitter } from '/@/renderer/events/event-emitter'; import { UserFavoriteEventPayload, UserRatingEventPayload } from '/@/renderer/events/events'; import { getServerById } from '/@/renderer/store'; @@ -45,6 +46,16 @@ export const useItemListInfiniteLoader = ({ const { data: totalItemCount } = useSuspenseQuery(listCountQuery); + const { setItemCount } = useListContext(); + + useEffect(() => { + if (!totalItemCount || !setItemCount) { + return; + } + + setItemCount(totalItemCount); + }, [setItemCount, totalItemCount]); + const pagesLoaded = useRef>({}); // Reset the loaded pages when the query changes diff --git a/src/renderer/components/item-list/helpers/item-list-paginated-loader.ts b/src/renderer/components/item-list/helpers/item-list-paginated-loader.ts index b3185c3e8..d89752978 100644 --- a/src/renderer/components/item-list/helpers/item-list-paginated-loader.ts +++ b/src/renderer/components/item-list/helpers/item-list-paginated-loader.ts @@ -7,6 +7,7 @@ import { import { useCallback, useEffect, useMemo } from 'react'; import { queryKeys } from '/@/renderer/api/query-keys'; +import { useListContext } from '/@/renderer/context/list-context'; import { eventEmitter } from '/@/renderer/events/event-emitter'; import { UserFavoriteEventPayload, UserRatingEventPayload } from '/@/renderer/events/events'; import { getServerById } from '/@/renderer/store'; @@ -37,6 +38,16 @@ export const useItemListPaginatedLoader = ({ const queryClient = useQueryClient(); const { data: totalItemCount } = useSuspenseQuery(listCountQuery); + const { setItemCount } = useListContext(); + + useEffect(() => { + if (!totalItemCount || !setItemCount) { + return; + } + + setItemCount(totalItemCount); + }, [setItemCount, totalItemCount]); + const pageCount = Math.ceil(totalItemCount / itemsPerPage); const fetchRange = getFetchRange(currentPage, itemsPerPage); diff --git a/src/renderer/context/list-context.tsx b/src/renderer/context/list-context.tsx index 446dd8b78..e50e4a8ba 100644 --- a/src/renderer/context/list-context.tsx +++ b/src/renderer/context/list-context.tsx @@ -1,13 +1,13 @@ import { createContext, useContext } from 'react'; import { ListKey } from '/@/renderer/store'; -import { Play } from '/@/shared/types/types'; interface ListContextProps { customFilters?: Record; - handlePlay?: (args: { initialSongId?: string; playType: Play }) => void; id?: string; + itemCount?: number; pageKey: ListKey; + setItemCount?: (itemCount: number) => void; } export const ListContext = createContext({