Creepso/stremio-web
1
0
Fork 0
mirror of https://github.com/Stremio/stremio-web.git synced 2026-03-30 10:49:48 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

handle NotificationsList cases

Browse source
This commit is contained in:
svetlagasheva 2019-10-16 10:31:55 +03:00
parent 73a001cc1f
commit fb082df699
1 changed files with 56 additions and 35 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

91
src/common/NavBar/NotificationsMenu/NotificationsList/NotificationsList.js
View file

@ -3,46 +3,67 @@ const PropTypes = require('prop-types');
const classnames = require('classnames');
const Icon = require('stremio-icons/dom');
const Notification = require('./Notification');
const useMetaItems = require('./useMetaItems');
const NotificationPlaceholder = require('./NotificationPlaceholder');
const styles = require('./styles');
const NotificationsList = ({ className, metaItems }) => {
const notifications = useMetaItems(metaItems);
return (
<div className={classnames(className, styles['notifications-list-scroll-container'])}>
{
notifications.length > 0 ?
notifications.map((notification) => (
notification.videos.length === 1 ?
<Notification
{...notification}
key={notification.id}
posterThumbnail={true}
poster={notification.videos[0].poster}
season={notification.videos[0].season}
episode={notification.videos[0].episode}
released={notification.videos[0].released}
className={styles['notification']}
/>
:
<Notification
{...notification}
key={notification.id}
posterThumbnail={false}
name={notification.videos.length + ' new videos for ' + notification.name}
released={notification.videos[notification.videos.length - 1].released}
className={styles['notification']}
/>
))
:
<React.Fragment>
<div className={styles['no-notifications-container']}>
<Icon className={styles['icon']} icon={'ic_bell'} />
<div className={styles['label']}>
No new notifications
</div>
</div>
</React.Fragment>
metaItems.map(({ req, content }, index) => {
switch (content.type) {
case 'Ready':
return (
content.content.length > 0 ?
content.content.map((notification) => {
//notifications videos are not available in useCatalogs, but in useNotifications hook
notification.videos = notification.videos || [{
thumbnail: 'https://www.stremio.com/website/home-testimonials.jpg',
season: 1,
episode: 1,
released: new Date()
}];
return (
notification.videos.length === 1 ?
<Notification
{...notification}
key={`${index}${req.base}${content.type}${notification.id}`}
className={styles['notification']}
posterThumbnail={true}
thumbnail={notification.videos[0].thumbnail}
season={notification.videos[0].season}
episode={notification.videos[0].episode}
released={notification.videos[0].released}
/>
:
<Notification
{...notification}
key={`${index}${req.base}${content.type}${notification.id}`}
className={styles['notification']}
posterThumbnail={false}
name={notification.videos.length + ' new videos for ' + notification.name}
released={notification.videos[notification.videos.length - 1].released}
/>
);
})
:
<React.Fragment>
<div className={styles['no-notifications-container']}>
<Icon className={styles['icon']} icon={'ic_bell'} />
<div className={styles['label']}>No new notifications</div>
</div>
</React.Fragment>
);
case 'Loading':
return (
<NotificationPlaceholder
key={`${index}${req.base}${content.type}`}
className={styles['notification']}
/>
);
}
})
}
</div>
);
@ -50,7 +71,7 @@ const NotificationsList = ({ className, metaItems }) => {
NotificationsList.propTypes = {
className: PropTypes.string,
metaItems: PropTypes.object
metaItems: PropTypes.arrayOf(PropTypes.object)
};
module.exports = NotificationsList;