Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-04-21 15:52:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Library wrapped with model suspender

Browse source
This commit is contained in:
nklhrstv 2022-07-10 12:38:13 +03:00
parent 659a6f7531
commit 22ac3b68f7
1 changed files with 19 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/routes/Library/Library.js
View file

@ -5,7 +5,7 @@ const PropTypes = require('prop-types');
const classnames = require('classnames'); const classnames = require('classnames');
const Icon = require('@stremio/stremio-icons/dom'); const Icon = require('@stremio/stremio-icons/dom');
const NotFound = require('stremio/routes/NotFound'); const NotFound = require('stremio/routes/NotFound');
const { Button, Multiselect, MainNavBars, LibItem, Image, ModalDialog, PaginationInput, useProfile, routesRegexp, useBinaryState } = require('stremio/common'); const { Button, DelayedRenderer, Multiselect, MainNavBars, LibItem, Image, ModalDialog, PaginationInput, useProfile, routesRegexp, useBinaryState, withModelSuspender } = require('stremio/common');
const useLibrary = require('./useLibrary'); const useLibrary = require('./useLibrary');
const useSelectableInputs = require('./useSelectableInputs'); const useSelectableInputs = require('./useSelectableInputs');
const styles = require('./styles'); const styles = require('./styles');
@ -85,14 +85,16 @@ const Library = ({ model, urlParams, queryParams }) => {
</div> </div>
: :
library.selected === null ? library.selected === null ?
<div className={styles['message-container']}> <DelayedRenderer delay={500}>
<Image <div className={styles['message-container']}>
className={styles['image']} <Image
src={require('/images/empty.png')} className={styles['image']}
alt={' '} src={require('/images/empty.png')}
/> alt={' '}
<div className={styles['message-label']}>{model === 'library' ? 'Library' : 'Continue Watching'} not loaded!</div> />
</div> <div className={styles['message-label']}>{model === 'library' ? 'Library' : 'Continue Watching'} not loaded!</div>
</div>
</DelayedRenderer>
: :
library.catalog.length === 0 ? library.catalog.length === 0 ?
<div className={styles['message-container']}> <div className={styles['message-container']}>
@ -104,7 +106,7 @@ const Library = ({ model, urlParams, queryParams }) => {
<div className={styles['message-label']}>Empty {model === 'library' ? 'Library' : 'Continue Watching'}</div> <div className={styles['message-label']}>Empty {model === 'library' ? 'Library' : 'Continue Watching'}</div>
</div> </div>
: :
<div className={styles['meta-items-container']}> <div className={classnames(styles['meta-items-container'], 'animation-fade-in')}>
{library.catalog.map((libItem, index) => ( {library.catalog.map((libItem, index) => (
<LibItem {...libItem} removable={model === 'library'} key={index} /> <LibItem {...libItem} removable={model === 'library'} key={index} />
))} ))}
@ -132,4 +134,10 @@ Library.propTypes = {
queryParams: PropTypes.instanceOf(URLSearchParams) queryParams: PropTypes.instanceOf(URLSearchParams)
}; };
module.exports = withModel(Library); const LibraryFallback = ({ model }) => (
<MainNavBars className={styles['library-container']} route={model} />
);
LibraryFallback.propTypes = Library.propTypes;
module.exports = withModel(withModelSuspender(Library, LibraryFallback));