diff --git a/js/actions/notification_actions.js b/js/actions/notification_actions.js
index 5d80e1e7..dd396baf 100644
--- a/js/actions/notification_actions.js
+++ b/js/actions/notification_actions.js
@@ -12,8 +12,8 @@ class NotificationActions {
'flushPieceListNotifications',
'updateEditionListNotifications',
'flushEditionListNotifications',
- 'updateEditionNotifications',
'updatePieceNotifications',
+ 'updateEditionNotifications',
'updateContractAgreementListNotifications',
'flushContractAgreementListNotifications'
);
diff --git a/js/components/header.js b/js/components/header.js
index 181e14c0..6863dc5d 100644
--- a/js/components/header.js
+++ b/js/components/header.js
@@ -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}
-
+
{navRoutesLinks}
diff --git a/js/components/header_notification.js b/js/components/header_notifications.js
similarity index 69%
rename from js/components/header_notification.js
rename to js/components/header_notifications.js
index fe50e150..8672f1db 100644
--- a/js/components/header_notification.js
+++ b/js/components/header_notifications.js
@@ -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 (
-
-
- Artworks ({this.state.pieceListNotifications.length})
-
- {this.state.pieceListNotifications.map((pieceNotification, i) => {
- return (
-
- );
- }
- )}
-
- );
- }
- return null;
+ refreshNotifications() {
+ NotificationActions.fetchPieceListNotifications();
+ NotificationActions.fetchEditionListNotifications();
},
- getEditionNotifications() {
- if (this.state.editionListNotifications && this.state.editionListNotifications.length > 0) {
+ renderNotifications({ notifications, isPiece }) {
+ if (notifications.length) {
return (
- Editions ({this.state.editionListNotifications.length})
+ {`${(isPiece ? 'Artworks' : 'Editions')} (${notifications.length})`}
- {this.state.editionListNotifications.map((editionNotification, i) => {
+ {notifications.map((notification, i) => {
return (
- );
- }
- )}
+ );
+ })}
);
+ } else {
+ return null;
}
- 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 (
);
diff --git a/js/fetchers/notification_fetcher.js b/js/fetchers/notification_fetcher.js
index 48606b70..8be00f29 100644
--- a/js/fetchers/notification_fetcher.js
+++ b/js/fetchers/notification_fetcher.js
@@ -16,7 +16,7 @@ let NotificationFetcher = {
fetchEditionListNotifications() {
return requests.get('notification_editionlist');
},
-
+
fetchEditionNotifications(editionId) {
return requests.get('notification_edition', {'edition_id': editionId});
},
diff --git a/js/stores/notification_store.js b/js/stores/notification_store.js
index 515a3730..856f9981 100644
--- a/js/stores/notification_store.js
+++ b/js/stores/notification_store.js
@@ -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);
}