Working narrative feature minus getNarrativeLinks (need further clarification); working on modifying narrativise filters feature

example.config.js

@@ -24,6 +24,7 @@ module.exports = {
     },
     features: {
       USE_CATEGORIES: true,
+      USE_NARRATIVES: true,
       CATEGORIES_AS_FILTERS: true,
       USE_ASSOCIATIONS: true,
       USE_ASSOCIATION_DESCRIPTIONS: true,

src/components/Layout.js

@@ -119,8 +119,9 @@ class Dashboard extends React.Component {
     }
   }
 
+  // Broken for time being; need clarification on function
   getNarrativeLinks (event) {
-    const narrative = this.props.domain.narratives.find(nv => nv.id === event.narrative)
+    const narrative = this.props.narratives.find(nv => nv.id === event.narratives[0])
     if (narrative) return narrative.byId[event.id]
     return null
   }
@@ -196,7 +197,7 @@ class Dashboard extends React.Component {
       }
     }
 
-    const { narrative } = this.props.app
+    const { narrative } = this.props.app.associations
     if (narrative === null) return
 
     if (idx < narrative.steps.length && idx >= 0) {
@@ -363,7 +364,8 @@ function mapDispatchToProps (dispatch) {
 export default connect(
   state => ({
     ...state,
-    narrativeIdx: selectors.selectNarrativeIdx(state)
+    narrativeIdx: selectors.selectNarrativeIdx(state),
+    narratives: selectors.selectNarratives(state)
   }),
   mapDispatchToProps
 )(Dashboard)

src/components/Toolbar/FilterListPanel.js

@@ -66,7 +66,6 @@ function FilterListPanel ({
 
   function renderTree (filters) {
     const aggregatedFilterPaths = aggregatePaths(filters)
-    console.info(aggregatedFilterPaths)
     return (
       <div>
         {Object.entries(aggregatedFilterPaths).map(filter => createNodeComponent(filter, 1))}

src/components/Toolbar/Layout.js

@@ -62,8 +62,8 @@ class Toolbar extends React.Component {
           return (
             <div className='panel-action action'>
               <button onClick={() => { this.goToNarrative(narr) }}>
-                <p>{narr.label}</p>
-                <p><small>{trimAndEllipse(narr.description, 120)}</small></p>
+                <p>{narr.id}</p>
+                <p><small>{trimAndEllipse(narr.desc, 120)}</small></p>
               </button>
             </div>
           )

src/reducers/app.js

@@ -82,11 +82,10 @@ function updateNarrative (appState, action) {
     minTime = minTime - Math.abs((maxTime - minTime) / 10)
     maxTime = maxTime + Math.abs((maxTime - minTime) / 10)
   }
-
   return {
     ...appState,
     associations: {
-      ...appState.filters,
+      ...appState.associations,
       narrative: action.narrative
     },
     map: {

src/selectors/index.js

@@ -1,12 +1,12 @@
 import { createSelector } from 'reselect'
 import { insetSourceFrom, dateMin, dateMax } from '../common/utilities'
 import { isTimeRangedIn } from './helpers'
-import { FILTER_MODE } from '../common/constants'
+import { FILTER_MODE, NARRATIVE_MODE } from '../common/constants'
 
 // Input selectors
 export const getEvents = state => state.domain.events
 export const getCategories = state => state.domain.categories
-export const getNarratives = state => state.domain.narratives
+export const getNarratives = state => state.domain.associations.filter(item => item.mode === NARRATIVE_MODE)
 export const getActiveNarrative = state => state.app.associations.narrative
 export const getSelected = state => state.app.selected
 export const getSites = state => state.domain.sites
@@ -87,27 +87,29 @@ export const selectNarratives = createSelector(
       evt.narratives.forEach(narrative => {
         // initialise
         if (!narratives[narrative]) { narratives[narrative] = narrativeSkeleton(narrative) }
-
         // add evt to steps
         // NB: insetSourceFrom is a 'curried' function to allow with maps
         narratives[narrative].steps.push(insetSourceFrom(sources)(evt))
       })
     })
-
     /* sort steps by time */
     Object.keys(narratives).forEach(key => {
       const steps = narratives[key].steps
 
       steps.sort((a, b) => a.datetime - b.datetime)
 
-      if (narrativesMeta.find(n => n.id === key)) {
+      const existingAssociatedNarrative = narrativesMeta.find(n => n.id === key)
+
+      if (existingAssociatedNarrative) {
         narratives[key] = {
-          ...narrativesMeta.find(n => n.id === key),
+          ...existingAssociatedNarrative,
           ...narratives[key]
         }
+      } else {
+        // Associations dont contain this narrative 
+        delete narratives[key]
       }
     })
-
     // Return narratives in original order
     // + filter those that are undefined
     return narrativesMeta.map(n => narratives[n.id]).filter(d => d)