From e02b1c93e1b1fca5e7188d7fb19861c063ba6aec Mon Sep 17 00:00:00 2001
From: Franc Camps-Febrer <francamps@gmail.com>
Date: Mon, 3 Dec 2018 16:40:27 +0000
Subject: [PATCH] Add narrative schemas

---
 .gitignore                             |  1 +
 src/actions/index.js                   | 13 ++++++++++---
 src/components/Dashboard.jsx           |  2 +-
 src/components/Notification.jsx        |  4 ++--
 src/js/map/map.js                      |  1 -
 src/reducers/schema/narrativeSchema.js |  9 +++++++++
 src/reducers/utils/validators.js       | 10 +++++++++-
 src/selectors/index.js                 |  7 ++++---
 8 files changed, 36 insertions(+), 11 deletions(-)
 create mode 100644 src/reducers/schema/narrativeSchema.js

diff --git a/.gitignore b/.gitignore
index 12b0846..4ce2e5c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 build/
 node_modules/
 config.js
+dev.config.js
diff --git a/src/actions/index.js b/src/actions/index.js
index 77ead1b..e065b25 100644
--- a/src/actions/index.js
+++ b/src/actions/index.js
@@ -52,6 +52,10 @@ export function fetchDomain () {
       .then(response => response.json())
       .catch(handleError('categories'))
 
+    const narPromise = fetch(NARRATIVE_URL)
+      .then(response => response.json())
+      .catch(handleError('narratives'))
+
     let sitesPromise = Promise.resolve([])
     if (process.env.features.USE_SITES) {
       sitesPromise = fetch(SITES_URL)
@@ -66,14 +70,16 @@ export function fetchDomain () {
         .catch(handleError('tags'))
     }
 
-    return Promise.all([ eventPromise, catPromise, sitesPromise, tagsPromise])
+    return Promise.all([eventPromise, catPromise, narPromise,
+      sitesPromise, tagsPromise])
       .then(response => {
         dispatch(toggleFetchingDomain())
         const result = {
           events: response[0],
           categories: response[1],
-          sites: response[2],
-          tags: response[3],
+          narratives: response[2],
+          sites: response[3],
+          tags: response[4],
           notifications
         }
         return result
@@ -102,6 +108,7 @@ export function updateDomain(domain) {
       categories: domain.categories,
       tags: domain.tags,
       sites: domain.sites,
+      narratives: domain.narratives,
       notifications: domain.notifications
     }
   }
diff --git a/src/components/Dashboard.jsx b/src/components/Dashboard.jsx
index 783fd78..1e758f2 100644
--- a/src/components/Dashboard.jsx
+++ b/src/components/Dashboard.jsx
@@ -67,7 +67,7 @@ class Dashboard extends React.Component {
   }
 
   getNarrativeLinks(event) {
-    const narrative = this.props.domain.narratives.find(nv => nv.key === event.narrative);
+    const narrative = this.props.domain.narratives.find(nv => nv.id === event.narrative);
     if (narrative) return narrative.byId[event.id];
     return null;
   }
diff --git a/src/components/Notification.jsx b/src/components/Notification.jsx
index 260befa..1bee1b9 100644
--- a/src/components/Notification.jsx
+++ b/src/components/Notification.jsx
@@ -48,7 +48,7 @@ export default class Notification extends React.Component{
       return (
         <div className={`notification-wrapper`}>
           {this.props.notifications.map((notification) => {
-
+console.log(notification)
             return (
               <div className='notification' onClick={() => this.toggleDetails() }>
                 <button
@@ -65,6 +65,6 @@ export default class Notification extends React.Component{
         </div>
       )
     }
-    return (<div/>);
+    return '';
   }
 }
diff --git a/src/js/map/map.js b/src/js/map/map.js
index 4f5727a..a40fa90 100644
--- a/src/js/map/map.js
+++ b/src/js/map/map.js
@@ -370,7 +370,6 @@ Stop and start the development process in terminal after you have added your tok
       })
       .style('stroke-dasharray', d => {
         const styleProps = getNarrativeStyle(d[0].narrative);
-        console.log(styleProps)
         return (styleProps.style === 'dotted') ? "2px 5px" : 'none';
       })
       .style('stroke', d => {
diff --git a/src/reducers/schema/narrativeSchema.js b/src/reducers/schema/narrativeSchema.js
new file mode 100644
index 0000000..373c0ac
--- /dev/null
+++ b/src/reducers/schema/narrativeSchema.js
@@ -0,0 +1,9 @@
+import Joi from 'joi';
+
+const narrativeSchema = Joi.object().keys({
+  id:             Joi.string().required(),
+  description:    Joi.string().allow('').required(),
+  label:           Joi.string().required()
+});
+
+export default narrativeSchema;
diff --git a/src/reducers/utils/validators.js b/src/reducers/utils/validators.js
index da3e98d..4a8fdcc 100644
--- a/src/reducers/utils/validators.js
+++ b/src/reducers/utils/validators.js
@@ -3,6 +3,7 @@ import Joi from 'joi';
 import eventSchema from '../schema/eventSchema.js';
 import categorySchema from '../schema/categorySchema.js';
 import siteSchema from '../schema/siteSchema.js';
+import narrativeSchema from '../schema/narrativeSchema.js';
 
 import { capitalize } from './helpers.js';
 
@@ -57,6 +58,7 @@ export function validateDomain (domain) {
     events: [],
     categories: [],
     sites: [],
+    narratives: [],
     notifications: domain.notifications,
     tags: {}
   }
@@ -64,7 +66,8 @@ export function validateDomain (domain) {
   const discardedDomain = {
     events: [],
     categories: [],
-    sites: []
+    sites: [],
+    narratives: [],
   }
 
   function validateItem(item, domainClass, schema) {
@@ -84,11 +87,16 @@ export function validateDomain (domain) {
     validateItem(event, 'events', eventSchema);
   });
   domain.categories.forEach(category => {
+    console.log(category)
     validateItem(category, 'categories', categorySchema);
   });
   domain.sites.forEach(site => {
     validateItem(site, 'sites', siteSchema);
   });
+  domain.narratives.forEach(narrative => {
+    validateItem(narrative, 'narratives', narrativeSchema);
+  });
+
 
   // Message the number of failed items in domain
   Object.keys(discardedDomain).forEach(disc => {
diff --git a/src/selectors/index.js b/src/selectors/index.js
index bd1315f..b502d7c 100644
--- a/src/selectors/index.js
+++ b/src/selectors/index.js
@@ -6,6 +6,7 @@ import {
 export const getEvents = state => state.domain.events
 export const getLocations = state => state.domain.locations
 export const getCategories = state => state.domain.categories
+export const getNarratives = state => state.domain.narratives
 export const getSites = (state) => {
   if (process.env.features.USE_SITES) return state.domain.sites
   return []
@@ -84,8 +85,8 @@ export const selectEvents = createSelector(
  * and if TAGS are being used, select them if their tags are enabled
  */
 export const selectNarratives = createSelector(
-    [getEvents, getTagsFilter, getTimeRange],
-    (events, tagFilters, timeRange) => {
+    [getEvents, getNarratives, getTagsFilter, getTimeRange],
+    (events, narrativeMetadata, tagFilters, timeRange) => {
 
       const narratives = {};
       events.forEach((evt) => {
@@ -112,7 +113,7 @@ export const selectNarratives = createSelector(
           narratives[key].byId[step.id].prev = (i > 0) ? steps[i - 1] : null;
         });
       });
-
+console.log(narrativeMetadata, narratives)
       return Object.values(narratives);
 });