ascribe/onion
1
0
Fork 0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 09:23:13 +01:00
Code Issues Releases Wiki Activity

Merge pull request #71 from ascribe/AD-1387-improve-redundancy-of-notifications

Browse Source 
AD-1387 Improve robustness of notifications
This commit is contained in:
Brett Sun 2016-05-27 11:33:47 +02:00
commit 53ef5248ca
5 changed files with 47 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
js/actions/notification_actions.js
View File

@ -12,8 +12,8 @@ class NotificationActions {
'flushPieceListNotifications',
'updateEditionListNotifications',
'flushEditionListNotifications',
'updateEditionNotifications',
'updatePieceNotifications',
'updateEditionNotifications',
'updateContractAgreementListNotifications',
'flushContractAgreementListNotifications'
);

4
js/components/header.js
View File

@ -19,7 +19,7 @@ import EventActions from '../actions/event_actions';
import PieceListStore from '../stores/piece_list_store';
import AclProxy from './acl_proxy';
import HeaderNotifications from './header_notification';
import HeaderNotifications from './header_notifications';
import HeaderNotificationDebug from './header_notification_debug';
import NavRoutesLinks from './nav_routes_links';
@ -218,7 +218,7 @@ let Header = React.createClass({
{account}
{signup}
</Nav>
<HeaderNotifications />
<HeaderNotifications currentUser={currentUser} />
{navRoutesLinks}
</CollapsibleNav>
</Navbar>

79
js/components/header_notification.js → js/components/header_notifications.js
View File

@ -15,14 +15,26 @@ import { getLangText } from '../utils/lang_utils';
let HeaderNotifications = React.createClass({
propTypes: {
currentUser: React.PropTypes.object.isRequired
},
getInitialState() {
return NotificationStore.getState();
},
componentDidMount() {
NotificationStore.listen(this.onChange);
NotificationActions.fetchPieceListNotifications();
NotificationActions.fetchEditionListNotifications();
if (this.props.currentUser.email) {
this.refreshNotifications();
}
},
componentWillReceiveProps(nextProps) {
if (nextProps.currentUser && nextProps.currentUser.email !== this.props.currentUser.email) {
this.refreshNotifications();
}
},
componentWillUnmount() {
@ -58,66 +70,47 @@ let HeaderNotifications = React.createClass({
this.refs.dropdownbutton.setDropdownState(false);
},
getPieceNotifications() {
if (this.state.pieceListNotifications && this.state.pieceListNotifications.length > 0) {
return (
<div>
<div className="notification-header">
Artworks ({this.state.pieceListNotifications.length})
</div>
{this.state.pieceListNotifications.map((pieceNotification, i) => {
return (
<MenuItem eventKey={i + 2}>
<NotificationListItem
ref={i}
notification={pieceNotification.notification}
pieceOrEdition={pieceNotification.piece}
onClick={this.onMenuItemClick}/>
</MenuItem>
);
}
)}
</div>
);
}
return null;
refreshNotifications() {
NotificationActions.fetchPieceListNotifications();
NotificationActions.fetchEditionListNotifications();
},
getEditionNotifications() {
if (this.state.editionListNotifications && this.state.editionListNotifications.length > 0) {
renderNotifications({ notifications, isPiece }) {
if (notifications.length) {
return (
<div>
<div className="notification-header">
Editions ({this.state.editionListNotifications.length})
{`${(isPiece ? 'Artworks' : 'Editions')} (${notifications.length})`}
</div>
{this.state.editionListNotifications.map((editionNotification, i) => {
{notifications.map((notification, i) => {
return (
<MenuItem eventKey={i + 2}>
<NotificationListItem
ref={'edition' + i}
notification={editionNotification.notification}
pieceOrEdition={editionNotification.edition}
notification={notification.notification}
pieceOrEdition={isPiece ? notification.piece : notification.edition}
onClick={this.onMenuItemClick}/>
</MenuItem>
);
}
)}
})}
</div>
);
}
} else {
return null;
}
},
render() {
if ((this.state.pieceListNotifications && this.state.pieceListNotifications.length > 0) ||
(this.state.editionListNotifications && this.state.editionListNotifications.length > 0)) {
const { editionListNotifications, pieceListNotifications } = this.state;
if (pieceListNotifications.length || editionListNotifications.length) {
let numNotifications = 0;
if (this.state.pieceListNotifications && this.state.pieceListNotifications.length > 0) {
numNotifications += this.state.pieceListNotifications.length;
if (pieceListNotifications.length) {
numNotifications += pieceListNotifications.length;
}
if (this.state.editionListNotifications && this.state.editionListNotifications.length > 0) {
numNotifications += this.state.editionListNotifications.length;
if (editionListNotifications.length) {
numNotifications += editionListNotifications.length;
}
return (
<Nav navbar right>
<DropdownButton
@ -131,8 +124,8 @@ let HeaderNotifications = React.createClass({
</span>
}
className="notification-menu">
{this.getPieceNotifications()}
{this.getEditionNotifications()}
{this.renderNotifications({ notifications: pieceListNotifications, isPiece: true })}
{this.renderNotifications({ notifications: editionListNotifications, isPiece: false })}
</DropdownButton>
</Nav>
);

10
js/stores/notification_store.js
View File

@ -8,13 +8,15 @@ import NotificationActions from '../actions/notification_actions';
class NotificationStore {
constructor() {
this.pieceListNotifications = {};
this.editionListNotifications = {};
this.pieceListNotifications = [];
this.pieceNotifications = null;
this.editionListNotifications = [];
this.editionNotifications = null;
// Need to determine if contract agreement notifications have been loaded or not,
// so we use null here instead of an empty array
this.contractAgreementListNotifications = null;
this.editionNotifications = null;
this.pieceNotifications = null;
this.bindActions(NotificationActions);
}