Home

Using Redux and Firebase

• More info on Redux Middleware - https://medium.com/@meagle/understanding-87566abcfb7a#.8dlay3nwa
• More info on async actions - http://redux.js.org/docs/advanced/AsyncActions.html
• More info on JS middleware - https://reactjsnews.com/redux-middleware

REDUX - STORE + MIDDLEWARE + REDUCER

1. create a middleware for the store
2. in this middleware, when redux actions come in for adding todo items or toggling todo items or deleting todo items, then modify what needs to be modified and save it to firebase -> do NOT dispatch these actions!

FIREBASE LISTENER(S)

1. create a firebase listener that simply takes the snapshot data and creates a redux action (like set_state_data) and then applies it to the redux store

ANDROID MIDDLEWARE

private void _initReduxStore() {
  _log = new ReduxDebugLog();
  State state = new State();
  com.brianegan.bansa.Reducer reducer = new Reducer(this);
  _store = new BaseStore<>(state, reducer, new Middleware<State>() {
    @Override
    public void dispatch(Store<State> store, Action action, NextDispatcher next) {
      App.log("Middleware [START]", "");
      App.log("Middleware [state]", store.getState().toString());
      App.log("Middleware [action]", action.toString());
      App.log("Middleware [END]", "");
      next.dispatch(action);
    }
  });
}

next.dispatch(action) is what allows the middleware to keep processing actions in the chain. If this call was removed, then the middleware would just stop processing that action (just like java servlet filtering). So it's best to make this call, and just ignore the actions that don't need to be processed in the reducer. So there are some actions that will be processed by the middleware and others that will be processed by the reducer.

The Middleware handles the following actions:

1. AddTodoItemAction (this writes to Firebase)
2. ToggleTodoItemAction (this writes to Firebase)

The Reducer handles the following actions:

1. ResetStateAction (no connection to Firebase)
2. RestoreStateAction (no connection to Firebase)
3. SetUserAction (these are read from Firebase)
4. SetDataAction (these are read from Firebase)