Commit f21269d

mo khan <mo@mokhan.ca>
2016-11-28 04:40:03
hook up movie actions.
1 parent 942f25e
app/actions/counterActions.js
@@ -1,5 +1,4 @@
 import * as types from './actionTypes';
-import Api from '../infrastructure/api';
 
 export function increment() {
   return { type: types.INCREMENT };
@@ -8,18 +7,3 @@ export function increment() {
 export function decrement() {
   return { type: types.DECREMENT };
 }
-
-export function fetchMovies() {
-  return dispatch => {
-    var url = 'https://facebook.github.io/react-native/movies.json'
-    new Api(url).get((json) => dispatch(receiveMovies(json)));
-  };
-}
-
-export function receiveMovies(json) {
-  return {
-    type: types.RECEIVED_MOVIES,
-    movies: json.movies.map((item) => item.title),
-    receivedAt: Date.now()
-  }
-}
app/actions/movieActions.js
@@ -0,0 +1,17 @@
+import * as types from './actionTypes';
+import Api from '../infrastructure/api';
+
+export function fetchMovies() {
+  return dispatch => {
+    var url = 'https://facebook.github.io/react-native/movies.json'
+    new Api(url).get((json) => dispatch(receiveMovies(json)));
+  };
+}
+
+export function receiveMovies(json) {
+  return {
+    type: types.RECEIVED_MOVIES,
+    movies: json.movies.map((item) => item.title),
+    receivedAt: Date.now()
+  }
+}
app/components/counter.js
@@ -3,10 +3,10 @@ import { View, Text, TouchableOpacity } from 'react-native';
 
 export default class Counter extends Component {
   render() {
-    const { counter, increment, decrement, fetchMovies } = this.props;
     console.log("PROPS");
     console.dir(this.props);
-    let moviesCount = this.props.movies ? this.props.movies.length : 0;
+    const { counter, increment, decrement, fetchMovies } = this.props;
+    let moviesCount = this.props.movies.movies.length;
     return (
       <View style={{flex: 1, alignItems: 'center', justifyContent: 'center' }}>
         <Text>{counter}</Text>
app/containers/awesome-app.js
@@ -2,21 +2,25 @@ import React, { Component } from 'react';
 import { bindActionCreators } from 'redux';
 import Counter from '../components/counter';
 import * as counterActions from '../actions/counterActions';
+import * as movieActions from '../actions/movieActions';
 import { connect } from 'react-redux';
 
 class AwesomeApp extends Component {
   render(){
     const { state, actions } = this.props;
+    console.log("PROPYS");
+    console.dir(this.props);
     return (
-      <Counter counter={state.count} movies={state.movies} {...actions} />
+      <Counter counter={state.counter.count} movies={state.movies} {...actions} {...this.props.movieActions} />
     );
   }
 }
 
 export default connect(state => ({
-    state: state.counter
+    state: state
   }),
   (dispatch) => ({
-    actions: bindActionCreators(counterActions, dispatch)
+    actions: bindActionCreators(counterActions, dispatch),
+    movieActions: bindActionCreators(movieActions, dispatch),
   })
 )(AwesomeApp);
app/reducers/counter.js
@@ -16,11 +16,6 @@ export default function counter(state = initialState, action = {}) {
         ...state,
         count: state.count - 1
       };
-    case types.RECEIVED_MOVIES:
-      return {
-        ...state,
-        movies: action.movies,
-      };
     default:
       return state;
   }
app/reducers/index.js
@@ -1,5 +1,7 @@
 import counter from './counter'
+import movies from './movies'
 
 export {
-  counter
+  counter,
+  movies
 };
app/reducers/movies.js
@@ -0,0 +1,17 @@
+import * as types from '../actions/actionTypes';
+
+const initialState = {
+  movies: []
+};
+
+export default function movies(state = initialState, action = {}) {
+  switch(action.type) {
+    case types.RECEIVED_MOVIES:
+      return {
+        ...state,
+        movies: action.movies,
+      };
+    default:
+      return state;
+  }
+}