Fix playlist pagination

This commit is contained in:
jeffvli 2023-03-05 19:31:28 -08:00
parent f7740407c3
commit 828cca9c19
4 changed files with 13 additions and 10 deletions

View file

@ -161,7 +161,7 @@ export const PlaylistDetailSongListHeaderFilters = ({
tableRef.current?.api.ensureIndexVisible(0, 'top'); tableRef.current?.api.ensureIndexVisible(0, 'top');
if (page.display === ListDisplayType.TABLE_PAGINATED) { if (page.display === ListDisplayType.TABLE_PAGINATED) {
setPagination({ currentPage: 0 }); setPagination({ data: { currentPage: 0 } });
} }
}, },
[tableRef, page.display, server, playlistId, queryClient, setPagination], [tableRef, page.display, server, playlistId, queryClient, setPagination],

View file

@ -116,9 +116,11 @@ export const PlaylistListContent = ({ tableRef, itemCount }: PlaylistListContent
} }
setPagination({ setPagination({
itemsPerPage: event.api.paginationGetPageSize(), data: {
totalItems: event.api.paginationGetRowCount(), itemsPerPage: event.api.paginationGetPageSize(),
totalPages: event.api.paginationGetTotalPages() + 1, totalItems: event.api.paginationGetRowCount(),
totalPages: event.api.paginationGetTotalPages() + 1,
},
}); });
}, },
[isPaginationEnabled, pagination.currentPage, pagination.itemsPerPage, setPagination], [isPaginationEnabled, pagination.currentPage, pagination.itemsPerPage, setPagination],
@ -217,6 +219,7 @@ export const PlaylistListContent = ({ tableRef, itemCount }: PlaylistListContent
> >
{page.display === ListDisplayType.TABLE_PAGINATED && ( {page.display === ListDisplayType.TABLE_PAGINATED && (
<TablePagination <TablePagination
pageKey=""
pagination={pagination} pagination={pagination}
setPagination={setPagination} setPagination={setPagination}
tableRef={tableRef} tableRef={tableRef}

View file

@ -110,7 +110,7 @@ export const PlaylistListHeaderFilters = ({ tableRef }: PlaylistListHeaderFilter
tableRef.current?.api.setDatasource(dataSource); tableRef.current?.api.setDatasource(dataSource);
tableRef.current?.api.purgeInfiniteCache(); tableRef.current?.api.purgeInfiniteCache();
tableRef.current?.api.ensureIndexVisible(0, 'top'); tableRef.current?.api.ensureIndexVisible(0, 'top');
setPagination({ currentPage: 0 }); setPagination({ data: { currentPage: 0 } });
}, },
[page.filter, queryClient, server, setPagination, tableRef], [page.filter, queryClient, server, setPagination, tableRef],
); );
@ -147,9 +147,9 @@ export const PlaylistListHeaderFilters = ({ tableRef }: PlaylistListHeaderFilter
if (display === ListDisplayType.TABLE) { if (display === ListDisplayType.TABLE) {
tableRef.current?.api.paginationSetPageSize(tableRef.current.props.infiniteInitialRowCount); tableRef.current?.api.paginationSetPageSize(tableRef.current.props.infiniteInitialRowCount);
setPagination({ currentPage: 0 }); setPagination({ data: { currentPage: 0 } });
} else if (display === ListDisplayType.TABLE_PAGINATED) { } else if (display === ListDisplayType.TABLE_PAGINATED) {
setPagination({ currentPage: 0 }); setPagination({ data: { currentPage: 0 } });
} }
}, },
[page, setPage, setPagination, tableRef], [page, setPage, setPagination, tableRef],

View file

@ -48,7 +48,7 @@ export interface PlaylistSlice extends PlaylistState {
setFilters: (data: Partial<PlaylistListFilter>) => PlaylistListFilter; setFilters: (data: Partial<PlaylistListFilter>) => PlaylistListFilter;
setStore: (data: Partial<PlaylistSlice>) => void; setStore: (data: Partial<PlaylistSlice>) => void;
setTable: (data: Partial<TableProps>) => void; setTable: (data: Partial<TableProps>) => void;
setTablePagination: (data: Partial<TableProps['pagination']>) => void; setTablePagination: (args: { data: Partial<TablePagination> }) => void;
}; };
} }
@ -98,9 +98,9 @@ export const usePlaylistStore = create<PlaylistSlice>()(
state.list.table = { ...state.list.table, ...data }; state.list.table = { ...state.list.table, ...data };
}); });
}, },
setTablePagination: (data) => { setTablePagination: (args) => {
set((state) => { set((state) => {
state.list.table.pagination = { ...state.list.table.pagination, ...data }; state.list.table.pagination = { ...state.list.table.pagination, ...args.data };
}); });
}, },
}, },