From 114129588ed72bce96febaf5b8413d4fd3c2fc1b Mon Sep 17 00:00:00 2001
From: Brett Sun <brett@ascribe.io>
Date: Wed, 16 Dec 2015 10:24:54 +0100
Subject: [PATCH] Improve DRYness of HeaderNotification

---
 js/components/header_notification.js | 64 +++++++++-------------------
 1 file changed, 20 insertions(+), 44 deletions(-)

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