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', 'flushPieceListNotifications',
'updateEditionListNotifications', 'updateEditionListNotifications',
'flushEditionListNotifications', 'flushEditionListNotifications',
'updateEditionNotifications',
'updatePieceNotifications', 'updatePieceNotifications',
'updateEditionNotifications',
'updateContractAgreementListNotifications', 'updateContractAgreementListNotifications',
'flushContractAgreementListNotifications' '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 PieceListStore from '../stores/piece_list_store';
import AclProxy from './acl_proxy'; import AclProxy from './acl_proxy';
import HeaderNotifications from './header_notification'; import HeaderNotifications from './header_notifications';
import HeaderNotificationDebug from './header_notification_debug'; import HeaderNotificationDebug from './header_notification_debug';
import NavRoutesLinks from './nav_routes_links'; import NavRoutesLinks from './nav_routes_links';
@ -218,7 +218,7 @@ let Header = React.createClass({
{account} {account}
{signup} {signup}
</Nav> </Nav>
<HeaderNotifications /> <HeaderNotifications currentUser={currentUser} />
{navRoutesLinks} {navRoutesLinks}
</CollapsibleNav> </CollapsibleNav>
</Navbar> </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({ let HeaderNotifications = React.createClass({
propTypes: {
currentUser: React.PropTypes.object.isRequired
},
getInitialState() { getInitialState() {
return NotificationStore.getState(); return NotificationStore.getState();
}, },
componentDidMount() { componentDidMount() {
NotificationStore.listen(this.onChange); 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() { componentWillUnmount() {
@ -58,66 +70,47 @@ let HeaderNotifications = React.createClass({
this.refs.dropdownbutton.setDropdownState(false); this.refs.dropdownbutton.setDropdownState(false);
}, },
getPieceNotifications() { refreshNotifications() {
if (this.state.pieceListNotifications && this.state.pieceListNotifications.length > 0) { NotificationActions.fetchPieceListNotifications();
return ( NotificationActions.fetchEditionListNotifications();
<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;
}, },
getEditionNotifications() { renderNotifications({ notifications, isPiece }) {
if (this.state.editionListNotifications && this.state.editionListNotifications.length > 0) { if (notifications.length) {
return ( return (
<div> <div>
<div className="notification-header"> <div className="notification-header">
Editions ({this.state.editionListNotifications.length}) {`${(isPiece ? 'Artworks' : 'Editions')} (${notifications.length})`}
</div> </div>
{this.state.editionListNotifications.map((editionNotification, i) => { {notifications.map((notification, i) => {
return ( return (
<MenuItem eventKey={i + 2}> <MenuItem eventKey={i + 2}>
<NotificationListItem <NotificationListItem
ref={'edition' + i} notification={notification.notification}
notification={editionNotification.notification} pieceOrEdition={isPiece ? notification.piece : notification.edition}
pieceOrEdition={editionNotification.edition}
onClick={this.onMenuItemClick}/> onClick={this.onMenuItemClick}/>
</MenuItem> </MenuItem>
); );
} })}
)}
</div> </div>
); );
} } else {
return null; return null;
}
}, },
render() { render() {
if ((this.state.pieceListNotifications && this.state.pieceListNotifications.length > 0) || const { editionListNotifications, pieceListNotifications } = this.state;
(this.state.editionListNotifications && this.state.editionListNotifications.length > 0)) { if (pieceListNotifications.length || editionListNotifications.length) {
let numNotifications = 0; 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) { if (editionListNotifications.length) {
numNotifications += this.state.editionListNotifications.length; numNotifications += editionListNotifications.length;
} }
return ( return (
<Nav navbar right> <Nav navbar right>
<DropdownButton <DropdownButton
@ -131,8 +124,8 @@ let HeaderNotifications = React.createClass({
</span> </span>
} }
className="notification-menu"> className="notification-menu">
{this.getPieceNotifications()} {this.renderNotifications({ notifications: pieceListNotifications, isPiece: true })}
{this.getEditionNotifications()} {this.renderNotifications({ notifications: editionListNotifications, isPiece: false })}
</DropdownButton> </DropdownButton>
</Nav> </Nav>
); );

10
js/stores/notification_store.js
View File

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