1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-22 17:33:14 +01:00

Improve DRYness of HeaderNotification

This commit is contained in:
Brett Sun 2015-12-16 10:24:54 +01:00
parent 874aad05b8
commit 114129588e

View File

@ -58,66 +58,42 @@ let HeaderNotifications = React.createClass({
this.refs.dropdownbutton.setDropdownState(false); this.refs.dropdownbutton.setDropdownState(false);
}, },
getPieceNotifications() { getNotifications({ notifications, isPiece }) {
if (this.state.pieceListNotifications && this.state.pieceListNotifications.length > 0) { if (notifications.length) {
return ( return (
<div> <div>
<div className="notification-header"> <div className="notification-header">
Artworks ({this.state.pieceListNotifications.length}) {`${(isPiece ? 'Artworks' : 'Editions')} (${notifications.length})`}
</div> </div>
{this.state.pieceListNotifications.map((pieceNotification, i) => { {notifications.map((notification, i) => {
return ( return (
<MenuItem eventKey={i + 2}> <MenuItem eventKey={i + 2}>
<NotificationListItem <NotificationListItem
ref={i} notification={notification.notification}
notification={pieceNotification.notification} pieceOrEdition={isPiece ? notification.piece : notification.edition}
pieceOrEdition={pieceNotification.piece}
onClick={this.onMenuItemClick}/> onClick={this.onMenuItemClick}/>
</MenuItem> </MenuItem>
); );
} })}
)}
</div> </div>
); );
} } else {
return null; return null;
},
getEditionNotifications() {
if (this.state.editionListNotifications && this.state.editionListNotifications.length > 0) {
return (
<div>
<div className="notification-header">
Editions ({this.state.editionListNotifications.length})
</div>
{this.state.editionListNotifications.map((editionNotification, i) => {
return (
<MenuItem eventKey={i + 2}>
<NotificationListItem
ref={'edition' + i}
notification={editionNotification.notification}
pieceOrEdition={editionNotification.edition}
onClick={this.onMenuItemClick}/>
</MenuItem>
);
} }
)}
</div>
);
}
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 +107,8 @@ let HeaderNotifications = React.createClass({
</span> </span>
} }
className="notification-menu"> className="notification-menu">
{this.getPieceNotifications()} {this.getNotifications({ notifications: pieceListNotifications, isPiece: true })}
{this.getEditionNotifications()} {this.getNotifications({ notifications: editionListNotifications, isPiece: false })}
</DropdownButton> </DropdownButton>
</Nav> </Nav>
); );