LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

fix pagination, reset page on filter button

Browse source
This commit is contained in:
zeppi 2021-11-05 13:50:39 -04:00 • committed by jessopb
parent 5df736dc6b
commit 32988bb7ca
2 changed files with 13 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ui/component/playlistsMine/index.js
View file

@ -14,7 +14,7 @@ const select = (state, props) => {
const { search } = props.location;
const urlParams = new URLSearchParams(search);
const page = Number(urlParams.get(PAGE_PARAM)) || '1';
const pageSize = urlParams.get(PAGE_SIZE_PARAM) || String(COLLECTIONS_PAGE_SIZE);
const pageSize = Number(urlParams.get(PAGE_SIZE_PARAM)) || COLLECTIONS_PAGE_SIZE;
return {
page,

15
ui/component/playlistsMine/view.jsx
View file

@ -10,6 +10,7 @@ import Paginate from 'component/common/paginate';
import Yrbl from 'component/yrbl';
import classnames from 'classnames';
import { FormField, Form } from 'component/common/form';
import { PAGE_PARAM } from 'constants/claim';
type Props = {
publishedCollections: CollectionGroup,
@ -18,6 +19,7 @@ type Props = {
fetchingCollections: boolean,
page: number,
pageSize: number,
history: { replace: (string) => void },
};
const ALL = 'All';
@ -33,6 +35,7 @@ export default function PlaylistsMine(props: Props) {
fetchingCollections,
page = 0,
pageSize,
history,
} = props;
const unpublishedCollectionsList = (Object.keys(unpublishedCollections || {}): any);
@ -65,8 +68,9 @@ export default function PlaylistsMine(props: Props) {
}
const shouldPaginate = filteredCollections.length > pageSize;
const paginateStart = shouldPaginate ? (page - 1) * pageSize : 0;
const paginatedCollections = filteredCollections.slice(paginateStart, paginateStart + pageSize);
const paginateStartIndex = shouldPaginate ? (page - 1) * pageSize : 0;
const paginateEndIndex = paginateStartIndex + pageSize;
const paginatedCollections = filteredCollections.slice(paginateStartIndex, paginateEndIndex);
function escapeListener(e: SyntheticKeyboardEvent<*>) {
if (e.keyCode === KEYCODES.ESCAPE) {
@ -83,6 +87,11 @@ export default function PlaylistsMine(props: Props) {
window.removeEventListener('keydown', escapeListener);
}
function handleFilterType(val) {
setFilterType(val);
history.replace(`?${PAGE_PARAM}=1`);
}
return (
<>
<div className="claim-grid__wrapper">
@ -105,7 +114,7 @@ export default function PlaylistsMine(props: Props) {
label={__(value)}
key={value}
button="alt"
onClick={() => setFilterType(value)}
onClick={() => handleFilterType(value)}
className={classnames('button-toggle', {
'button-toggle--active': filterType === value,
})}