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

Playlist: reduce show count to half in mobile.

Browse source 
This is for performance reasons on the horizontal view.
This commit is contained in:
infinite-persistence 2022-03-12 09:32:37 +08:00 committed by Thomas Zarebczan
parent 2e3f9f94ce
commit 59591c7695
1 changed files with 4 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
ui/component/collectionsListMine/view.jsx
View file

@ -23,7 +23,7 @@ type Props = {
const LIST_TYPE = Object.freeze({ ALL: 'All', PRIVATE: 'Private', PUBLIC: 'Public' }); const LIST_TYPE = Object.freeze({ ALL: 'All', PRIVATE: 'Private', PUBLIC: 'Public' });
const COLLECTION_FILTERS = [LIST_TYPE.ALL, LIST_TYPE.PRIVATE, LIST_TYPE.PUBLIC]; const COLLECTION_FILTERS = [LIST_TYPE.ALL, LIST_TYPE.PRIVATE, LIST_TYPE.PUBLIC];
const COLLECTION_SHOW_COUNT = 12; const PLAYLIST_SHOW_COUNT = Object.freeze({ DEFAULT: 12, MOBILE: 6 });
export default function CollectionsListMine(props: Props) { export default function CollectionsListMine(props: Props) {
const { const {
@ -41,6 +41,7 @@ export default function CollectionsListMine(props: Props) {
const [filterType, setFilterType] = React.useState(LIST_TYPE.ALL); const [filterType, setFilterType] = React.useState(LIST_TYPE.ALL);
const [searchText, setSearchText] = React.useState(''); const [searchText, setSearchText] = React.useState('');
const isMobileScreen = useIsMobile(); const isMobileScreen = useIsMobile();
const playlistShowCount = isMobileScreen ? PLAYLIST_SHOW_COUNT.MOBILE : PLAYLIST_SHOW_COUNT.DEFAULT;
const playlistPageUrl = `/$/${PAGES.PLAYLISTS}?type=${filterType}`; const playlistPageUrl = `/$/${PAGES.PLAYLISTS}?type=${filterType}`;
let collectionsToShow = []; let collectionsToShow = [];
@ -63,9 +64,9 @@ export default function CollectionsListMine(props: Props) {
publishedCollections[id].name.toLocaleLowerCase().includes(searchText.toLocaleLowerCase())) publishedCollections[id].name.toLocaleLowerCase().includes(searchText.toLocaleLowerCase()))
); );
}) })
.slice(0, COLLECTION_SHOW_COUNT); .slice(0, playlistShowCount);
} else { } else {
filteredCollections = collectionsToShow.slice(0, COLLECTION_SHOW_COUNT) || []; filteredCollections = collectionsToShow.slice(0, playlistShowCount) || [];
} }
const totalLength = collectionsToShow ? collectionsToShow.length : 0; const totalLength = collectionsToShow ? collectionsToShow.length : 0;