NotificationsList implemented

This commit is contained in:
svetlagasheva 2019-10-09 16:21:26 +03:00
parent 4f9f9fd928
commit 481264cb87
3 changed files with 65 additions and 0 deletions

View file

@ -0,0 +1,52 @@
const React = require('react');
const PropTypes = require('prop-types');
const classnames = require('classnames');
const Notification = require('./Notification');
const useMetaItems = require('./useMetaItems');
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-label']}>
No new notifications.
</div>
</React.Fragment>
}
</div>
);
}
NotificationsList.propTypes = {
className: PropTypes.string,
metaItems: PropTypes.object
};
module.exports = NotificationsList;

View file

@ -0,0 +1,3 @@
const NotificationsList = require('./NotificationsList');
module.exports = NotificationsList;

View file

@ -0,0 +1,10 @@
.notifications-list-scroll-container {
flex: 1;
align-self: stretch;
height: 30rem;
overflow-y: auto;
.notification {
width: var(--item-size);
}
}