Add async RECEIVE_JOURNEY_PATTERN action Refs #2204

Signed-off-by: Thomas Shawarma Haddad <thomas.haddad@af83.com>
Signed-off-by: Jean-Paul Lescouzeres <jean-paul.lescouzeres@af83.com>

6 files changed, 72 insertions, 62 deletions

diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/actions/index.js b/app/assets/javascripts/es6_browserified/journey_patterns/actions/index.js
index a51c11b9c..5d2b0bdd2 100644
--- a/app/assets/javascripts/es6_browserified/journey_patterns/actions/index.js
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/actions/index.js
@@ -1,3 +1,38 @@
-const actions = {}
+const actions = {
+  receiveJourneyPatterns : (state) => ({
+    type: "RECEIVE_JOURNEY_PATTERNS",
+    state
+  }),
+
+  fetchJourneyPatterns : (dispatch) => {
+    let state = []
+    let urlJSON = window.location.pathname + '.json'
+    let req = new Request(urlJSON, {
+      credentials: 'same-origin'
+    });
+    fetch(req)
+      .then(response => response.json())
+      .then((json) => {
+        console.log(json)
+        for (let [i, val] of json.entries()){
+          let stop_points = []
+          for (let [i, stopArea] of val['stop_area_short_descriptions'].entries()){
+            stop_points.push("id", false)
+          }
+          for (let [i, stopArea] of val['stop_area_short_descriptions'].entries()){
+            stop_points["id"] = true
+          }
+          state.push({
+            name: val.name,
+            object_id: val.object_id,
+            published_name: val.published_name
+            // stop_points: stop_points
+          })
+        }
+        dispatch(actions.receiveJourneyPatterns(state))
+      })
+  }
+}
+
 
 module.exports = actions
diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/components/JourneyPatterns.js b/app/assets/javascripts/es6_browserified/journey_patterns/components/JourneyPatterns.js
deleted file mode 100644
index b291494e4..000000000
--- a/app/assets/javascripts/es6_browserified/journey_patterns/components/JourneyPatterns.js
+++ /dev/null
@@ -1,21 +0,0 @@
-var React = require('react')
-var PropTypes = require('react').PropTypes
-var JourneyPattern = require('./JourneyPattern')
-
-const JourneyPatterns = ({ journeyPatterns }) => {
-  return (
-    <div className='list-group'>
-      {journeyPatterns.map((journeyPattern, index) =>
-        <JourneyPattern
-          value={ journeyPattern }
-        />
-      )}
-    </div>
-  )
-}
-
-JourneyPatterns.propTypes = {
-  journeyPatterns: PropTypes.array.isRequired
-}
-
-module.exports = JourneyPatterns
diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/containers/JourneyPatternList.js b/app/assets/javascripts/es6_browserified/journey_patterns/containers/JourneyPatternList.js
index 0e3e57b21..a6710c690 100644
--- a/app/assets/javascripts/es6_browserified/journey_patterns/containers/JourneyPatternList.js
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/containers/JourneyPatternList.js
@@ -1,6 +1,34 @@
+var React = require('react')
+var Component = require('react').Component
+var PropTypes = require('react').PropTypes
 var actions = require('../actions')
 var connect = require('react-redux').connect
-var JourneyPatterns = require('../components/JourneyPatterns')
+var JourneyPattern = require('../components/JourneyPattern')
+
+class JourneyPatternList extends Component{
+  constructor(props) {
+    super(props)
+  }
+
+  componentDidMount() {
+    const dispatch = this.props.dispatch
+    const journeyPatterns = this.props.journeyPatterns
+    actions.fetchJourneyPatterns(dispatch)
+  }
+
+  render() {
+    return (
+      <div className='list-group'>
+        {this.props.journeyPatterns.map((journeyPattern, index) =>
+          <JourneyPattern
+            value={ journeyPattern }
+            key={ index }
+          />
+        )}
+      </div>
+    )
+  }
+}
 
 const mapStateToProps = (state) => {
   return {
@@ -8,13 +36,11 @@ const mapStateToProps = (state) => {
   }
 }
 
-const mapDispatchToProps = (dispatch) => {
-  return {}
+JourneyPatternList.propTypes = {
+  dispatch: PropTypes.func.isRequired,
+  journeyPatterns: PropTypes.array.isRequired
 }
 
-const JourneyPatternList = connect(
-  mapStateToProps,
-  mapDispatchToProps
-)(JourneyPatterns)
+JourneyPatternList = connect(mapStateToProps)(JourneyPatternList)
 
 module.exports = JourneyPatternList
diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/containers/test.js b/app/assets/javascripts/es6_browserified/journey_patterns/containers/test.js
new file mode 100644
index 000000000..e69de29bb
--- /dev/null
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/containers/test.js
diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/index.js b/app/assets/javascripts/es6_browserified/journey_patterns/index.js
index 626997f4c..e0104db09 100644
--- a/app/assets/javascripts/es6_browserified/journey_patterns/index.js
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/index.js
@@ -11,39 +11,7 @@ var createLogger = require('redux-logger')
 var thunkMiddleware = require('redux-thunk').default
 var promise = require('redux-promise')
 
-const urlJSON = window.location.pathname + '.json'
-var req = new Request(urlJSON, {
-  credentials: 'same-origin'
-});
-const getInitialState = () => {
-  console.log(urlJSON)
-  let state = []
-  fetch(req)
-    .then(response => response.json())
-    // .then(json => dispatch(receivePosts(reddit, json)))
-    .then((json) => {
-      console.log(json)
-      for (let [i, val] of json.entries()){
-        let stop_points = []
-        for (let [i, stopArea] of val['stop_area_short_descriptions'].entries()){
-          stop_points.push("id", false)
-        }
-        for (let [i, stopArea] of val['stop_area_short_descriptions'].entries()){
-          stop_points["id"] = true
-        }
-        state.push({
-          name: val.name,
-          object_id: val.object_id,
-          published_name: val.published_name
-          // stop_points: stop_points
-        })
-      }
-    })
-  return state
-}
-
-
-var initialState = {journeyPatterns: getInitialState()}
+var initialState = {journeyPatterns: []}
 const loggerMiddleware = createLogger()
 
 let store = createStore(
diff --git a/app/assets/javascripts/es6_browserified/journey_patterns/reducers/journey_patterns.js b/app/assets/javascripts/es6_browserified/journey_patterns/reducers/journey_patterns.js
index a63c83be6..0d7dc569b 100644
--- a/app/assets/javascripts/es6_browserified/journey_patterns/reducers/journey_patterns.js
+++ b/app/assets/javascripts/es6_browserified/journey_patterns/reducers/journey_patterns.js
@@ -1,5 +1,7 @@
 const journeyPatterns = (state = [], action) => {
   switch (action.type) {
+    case 'RECEIVE_JOURNEY_PATTERNS':
+      return [...action.state]
     default:
       return state
   }