issue #1985 - fixed sources generation and total calculation after notifications store refactoring

Author: maxceem

src/routes/notifications/containers/NotificationsContainer.jsx

@@ -115,7 +115,7 @@ const NotificationsContainerView = (props) => {
       <aside className="filters">
         <Sticky top={90}>
           <SideFilter
-            filterSections={getNotificationsFilters(sources)}
+            filterSections={getNotificationsFilters(allNotificationsBySources)}
             selectedFilter={filterBy}
             onFilterItemClick={setNotificationsFilterBy}
           >
@@ -148,12 +148,12 @@ class NotificationsContainer extends Component {
   render() {
     const { notifications, ...restProps } = this.props
     const preRenderedNotifications = preRenderNotifications(notifications)
-    
+
     return (
       <NotificationsContainerView
         {...{
           ...restProps, 
-          notifications: preRenderedNotifications
+          notifications: preRenderedNotifications,
         }}
       />
     )

src/routes/notifications/helpers/notifications.js

@@ -158,11 +158,14 @@ const compareSourcesByLastNotificationDate = (s1, s2) => {
  * @return {Array}                list of sources with related notifications
  */
 export const splitNotificationsBySources = (sources, notifications) => {
-  const notificationsBySources = []
-
-  sources.filter(source => source.total > 0).forEach(source => {
-    source.notifications = _.filter(notifications, n => n.sourceId === source.id)
-    notificationsBySources.push(source)
+  const notificationsBySources = sources.map(source => {
+    const sourceNotifications = _.filter(notifications, { sourceId: source.id })
+    
+    return ({
+      ...source,
+      notifications: sourceNotifications,
+      total: sourceNotifications.length,
+    })
   })
 
   // source that has the most recent notification should be on top

src/routes/notifications/reducers/index.js

@@ -26,7 +26,7 @@ const initialState = {
   isLoading: false,
   initialized: false,
   filterBy: '',
-  sources: [{ id: 'global', title: 'Global', total: 0 }],
+  sources: [{ id: 'global', title: 'Global' }],
   notifications: [],
   // ids of sources that will also show old notifications
   oldSourceIds: [],
@@ -40,17 +40,16 @@ const initialState = {
 
 // get sources from notifications
 const getSources = (notifications) => {
-  const sources = [{ id: 'global', title: 'Global', total: 0 }]
-  _.each(notifications, notification => {
-    if (!notification.isRead) {
-      const source = _.find(sources, s => s.id === notification.sourceId)
-      if (source) {
-        source.total++
-      } else {
-        sources.push({ id: notification.sourceId, title: notification.sourceName, total: 1 })
-      }
-    }
-  })
+  const sources = [
+    ...initialState.sources,
+    ..._.uniqBy(
+      notifications.map((notification) => ({ 
+        id: notification.sourceId, 
+        title: notification.sourceName 
+      })),
+      'id'
+    )
+  ]
   return sources
 }
 
@@ -75,7 +74,6 @@ export default (state = initialState, action) => {
         ids.indexOf(n.id) >= 0 ? { ...n, seen: true } : n
       ))
     }
-    newState.sources = getSources(newState.notifications)
     return newState
   }
 
@@ -97,7 +95,6 @@ export default (state = initialState, action) => {
         !action.payload || n.sourceId === action.payload ? { ...n, isRead: true } : n
       ))
     }
-    newState.sources = getSources(newState.notifications)
     return newState
   }
 
@@ -109,7 +106,6 @@ export default (state = initialState, action) => {
         n.id === action.payload ? { ...n, isRead: true } : n
       ))
     }
-    newState.sources = getSources(newState.notifications)
     return newState
   }
 
@@ -121,7 +117,6 @@ export default (state = initialState, action) => {
         _.includes(action.payload, n.id) ? { ...n, isRead: true } : n
       ))
     }
-    newState.sources = getSources(newState.notifications)
     return newState
   }