import { UseSuspenseQueryOptions } from '@tanstack/react-query'; import { forwardRef } from 'react'; import { api } from '/@/renderer/api'; import { useItemListInfiniteLoader } from '/@/renderer/components/item-list/helpers/item-list-infinite-loader'; import { useItemListScrollPersist } from '/@/renderer/components/item-list/helpers/use-item-list-scroll-persist'; import { ItemGridList } from '/@/renderer/components/item-list/item-grid-list/item-grid-list'; import { ItemListGridComponentProps } from '/@/renderer/components/item-list/types'; import { artistsQueries } from '/@/renderer/features/artists/api/artists-api'; import { AlbumArtistListQuery, AlbumArtistListSort, LibraryItem, SortOrder, } from '/@/shared/types/domain-types'; import { ItemListKey } from '/@/shared/types/types'; interface AlbumArtistListInfiniteGridProps extends ItemListGridComponentProps {} export const AlbumArtistListInfiniteGrid = forwardRef( ( { gap = 'md', itemsPerPage = 100, itemsPerRow, query = { sortBy: AlbumArtistListSort.NAME, sortOrder: SortOrder.ASC, }, saveScrollOffset = true, serverId, }, ref, ) => { const listCountQuery = artistsQueries.albumArtistListCount({ query: { ...query }, serverId: serverId, }) as UseSuspenseQueryOptions; const listQueryFn = api.controller.getAlbumArtistList; const { data, onRangeChanged } = useItemListInfiniteLoader({ eventKey: ItemListKey.ALBUM_ARTIST, itemsPerPage, itemType: LibraryItem.ALBUM_ARTIST, listCountQuery, listQueryFn, query, serverId, }); const { handleOnScrollEnd, scrollOffset } = useItemListScrollPersist({ enabled: saveScrollOffset, }); return ( ); }, );