Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-01-11 22:40:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

MetaDetails wrapped with core suspender

Browse source
This commit is contained in:
nklhrstv 2022-07-11 13:55:38 +03:00
parent 9f6ee43c71
commit f6bc7e61d5
2 changed files with 23 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
src/routes/MetaDetails/MetaDetails.js
View file

@ -2,8 +2,9 @@
const React = require('react');
const PropTypes = require('prop-types');
const classnames = require('classnames');
const { useServices } = require('stremio/services');
const { VerticalNavBar, HorizontalNavBar, MetaPreview, ModalDialog, Image } = require('stremio/common');
const { VerticalNavBar, HorizontalNavBar, MetaPreview, ModalDialog, Image, DelayedRenderer, withCoreSuspender } = require('stremio/common');
const StreamsList = require('./StreamsList');
const VideosList = require('./VideosList');
const useMetaDetails = require('./useMetaDetails');
@ -86,10 +87,12 @@ const MetaDetails = ({ urlParams, queryParams }) => {
}
{
metaPath === null ?
<div className={styles['meta-message-container']}>
<Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
<div className={styles['message-label']}>No meta was selected!</div>
</div>
<DelayedRenderer delay={500}>
<div className={styles['meta-message-container']}>
<Image className={styles['image']} src={require('/images/empty.png')} alt={' '} />
<div className={styles['message-label']}>No meta was selected!</div>
</div>
</DelayedRenderer>
:
metaDetails.metaItem === null ?
<div className={styles['meta-message-container']}>
@ -122,7 +125,7 @@ const MetaDetails = ({ urlParams, queryParams }) => {
null
}
<MetaPreview
className={styles['meta-preview']}
className={classnames(styles['meta-preview'], 'animation-fade-in')}
name={metaDetails.metaItem.content.content.name}
logo={metaDetails.metaItem.content.content.logo}
runtime={metaDetails.metaItem.content.content.runtime}
@ -188,4 +191,16 @@ MetaDetails.propTypes = {
queryParams: PropTypes.instanceOf(URLSearchParams)
};
module.exports = MetaDetails;
const MetaDetailsFallback = () => (
<div className={styles['metadetails-container']}>
<HorizontalNavBar
className={styles['nav-bar']}
backButton={true}
addonsButton={true}
fullscreenButton={true}
navMenu={true}
/>
</div>
);
module.exports = withCoreSuspender(MetaDetails, MetaDetailsFallback);

2
src/routes/MetaDetails/useMetaDetails.js
View file

@ -66,7 +66,7 @@ const useMetaDetails = (urlParams) => {
};
}
}, [urlParams]);
return useModelState({ model: 'meta_details', action, map });
return useModelState({ model: 'meta_details', action, map, deps: ['ctx'] });
};
module.exports = useMetaDetails;