Convert allProjects page

app/actions/index.js

@@ -14,3 +14,14 @@ export function login(token, callback) {
     { token, callback }
   );
 }
+
+export const GET_PROJECTS = makeAsyncActionSet('GET_PROJECTS');
+export function getProjects(callback) {
+  return buildAsyncAction(
+    GET_PROJECTS,
+    endpoints.get('ALL_PROJECTS'),
+    methods.GET,
+    {},
+    { callback }
+  );
+}

app/components/projects/ProjectList.js

@@ -1,7 +1,8 @@
 import React from 'react-native';
 import GiftedListView from 'react-native-gifted-listview';
 import ProjectItem from './ProjectItem';
-import { getProjects, getUserDetails } from '../../api/CircleCI';
+import { connect } from 'react-redux';
+import { getProjects } from '../../actions';
 import loaderHandler from 'react-native-busy-indicator/LoaderHandler';
 
 const {
@@ -20,23 +21,13 @@ const styles = StyleSheet.create({
   },
 });
 
-export default class ProjectList extends React.Component {
+export class ProjectList extends React.Component {
   constructor(props) {
     super(props);
-    this.state = {
-      userDetails: false,
-    };
     this.renderRow = this.renderRow.bind(this);
     this._fetch = this._fetch.bind(this);
   }
 
-  componentDidMount() {
-    getUserDetails().then(function(userDetails) {
-      this.setState({ userDetails });
-    }.bind(this));
-  }
-
-
   _sortByDate(projects) {
     return projects.sort(function (a, b) {
       const keyA = a.username + '/' + a.reponame;
@@ -48,21 +39,24 @@ export default class ProjectList extends React.Component {
   }
 
   renderRow(project) {
-    return <ProjectItem project={project} userDetails={this.state.userDetails} nav={this.props.nav} />;
+    return <ProjectItem project={project} userDetails={this.props.userDetails} nav={this.props.nav} />;
   }
 
 
   _fetch(page, callback, options) {
-    getProjects().then((projects) => {
+    const actionCallback = function (data) {
-      callback(this._sortByDate(projects));
+      this._sortByDate(data);
+      callback(data);
       loaderHandler.hideLoader();
-    });
+    }.bind(this);
+    this.props.getProjects(actionCallback);
   }
 
   render() {
-    if (!this.state.userDetails) {
+    if (!this.props.token) {
-      return <View />;
+      return null;  // If there's no token, we can't do anything, so wait
     }
+    console.log('HAS TOKEN', this.props.userDetails.token);
     return (
       <View style={styles.listView}>
         <GiftedListView
@@ -74,3 +68,14 @@ export default class ProjectList extends React.Component {
     );
   }
 };
+
+
+function mapStateToProps(state) {
+  return {
+    userDetails: state.user.toJS(),
+    projects: state.allProjects.toJS(),
+    token: state.user.get('token')
+  };
+}
+
+export default connect(mapStateToProps, { getProjects }) (ProjectList);

app/middleware/actionChain.js

@@ -3,7 +3,7 @@ export default store => next => action => {
     action.meta.callback &&
     action.type.endsWith('SUCCESS') &&
     typeof action.meta.callback === 'function') {
-    action.meta.callback();
+    action.meta.callback(action.payload);
   }
   return next(action);
 };

app/reducers/allProjects.js

@@ -0,0 +1,10 @@
+import * as actions from '../actions';
+import { Map } from 'immutable';
+
+export default function allProjects(state = Map(), action) {
+  console.log(action.type);
+  if (action.type === actions.GET_PROJECTS.SUCCESS) {
+    return Map(action.payload);
+  }
+  return state;
+};

app/reducers/index.js

@@ -2,8 +2,10 @@ import { combineReducers } from 'redux';
 import * as storage from 'redux-storage';
 
 import user from './user';
+import allProjects from './allProjects';
 
 
 export default storage.reducer(combineReducers({
-  user
+  user,
+  allProjects
 }));