add unreadnotificationscount

This commit is contained in:
Connor Turland 2018-03-08 07:25:54 -05:00
parent 2971b81463
commit c1dbfc9f72
4 changed files with 55 additions and 59 deletions

View file

@ -81,67 +81,63 @@ $unread_notifications_dot_size: 8px;
}
}
.controller-notifications {
.notificationPage,
.notificationsPage {
font-family: 'din-regular', Sans-Serif;
.notificationPage,
.notificationsPage {
font-family: 'din-regular', Sans-Serif;
& a:hover {
text-decoration: none;
& a:hover {
text-decoration: none;
}
& > .notification-title {
border-bottom: 1px solid #eee;
padding-bottom: 0.25em;
margin-bottom: 0.5em;
}
.back {
margin-top: 1em;
}
}
.notificationsPage {
header {
margin-bottom: 0;
}
.emptyInbox {
padding-top: 15px;
}
}
.notificationPage {
.thirty-two-avatar {
display: inline-block;
width: 32px;
height: 32px;
border-radius: 16px;
vertical-align: middle;
}
.button {
line-height: 32px;
img {
margin-top: 8px;
}
& > .notification-title {
border-bottom: 1px solid #eee;
padding-bottom: 0.25em;
margin-bottom: 0.5em;
}
.back {
margin-top: 1em;
&.decline {
background: #DB5D5D;
&:hover {
background: #DC4B4B;
}
}
}
.notificationsPage {
header {
margin-bottom: 0;
}
.emptyInbox {
padding-top: 15px;
}
}
.notificationPage {
.thirty-two-avatar {
display: inline-block;
width: 32px;
height: 32px;
border-radius: 16px;
vertical-align: middle;
}
.button {
line-height: 32px;
img {
margin-top: 8px;
}
&.decline {
background: #DB5D5D;
&:hover {
background: #DC4B4B;
}
}
}
.notification-body {
p, div {
margin: 1em auto;
line-height: 20px;
}
.notification-body {
p, div {
margin: 1em auto;
line-height: 20px;
}
}
}

View file

@ -7,7 +7,7 @@ const Notifications = {
notificationsLoading: false,
unreadNotificationsCount: 0,
init: serverData => {
Notifications.unreadNotificationsCount = serverData.unreadNotificationsCount
Notifications.unreadNotificationsCount = serverData.ActiveMapper.unread_notifications_count
},
fetchNotifications: render => {
Notifications.notificationsLoading = true

View file

@ -61,11 +61,11 @@ class NotificationBox extends Component {
}
render = () => {
const { loading } = this.props
const { notifications, loading } = this.props
return <div className='notificationsBox'>
<div className='notificationsBoxTriangle' />
<ul className='notifications'>
{loading ? this.showLoading() : this.showNotifications()}
{notifications.length === 0 && loading ? this.showLoading() : this.showNotifications()}
</ul>
</div>
}

View file

@ -27,7 +27,7 @@ class Notifications extends Component {
render = () => {
const { notificationsLoading, markAsRead, markAsUnread } = this.props
const notifications = (this.props.notifications || []).filter(n => !(BLACKLIST.indexOf(n.type) > -1 && (!n.data.object || !n.data.map)))
if (notificationsLoading) {
if (notifications.length === 0 && notificationsLoading) {
return (
<div>
<LoadingPage />