class Dispatcher extends Rx.Subject{

  dispatch(value : any) : void {

    this.next(value);

  }

}

​

class Store extends Rx.BehaviorSubject{

  constructor(

    private dispatcher,

    private reducer,

    preMiddleware,

    postMiddleware,

    initialState = {}

  ){

    super(initialState);

    this.dispatcher 

       .let(preMiddleware)

       .scan((state, action) => this.reducer(state, action), initialState)

       .let(postMiddleware) 

       .subscribe(state => super.next(state));

  }

  //Map makes it easy to select slices of state that will be needed for your components

  //This is a simple helper function to make grabbing sections of state more concise

  select(key : string) {

    return this.map(state => state[key]).distinctUntilChanged();

  }

​

  dispatch(value){

    this.dispatcher.dispatch(value);  

  }

​

  next(value){

    this.dispatcher.dispatch(value);

  }

}

​

const combineReducers = reducers => (state = {}, action) => {

  return Object.keys(reducers).reduce((nextState, key) => {

    nextState[key] = reducers[key](state[key], action);

    return nextState;

  }, {});

};

​

//Add a few basic reducers

const person = (state = {}, action) => {

  switch(action.type){

    case 'ADD_INFO':

      return Object.assign({}, state, action.payload)

    default:

      return state;

  }

}

​

const hoursWorked = (state = 0, action) => {

  switch(action.type){

    case 'ADD_HOUR':

      return state + 1;

    case 'SUBTRACT_HOUR':

      return state - 1;

    default:

      return state;

  }

}

​

//this is handled behind the scenes with @ngrx/store provideStore

const appReducer = combineReducers({person, hoursWorked});

const preMiddleware = obs => { return obs.do(val => console.log('ACTION:', val))};

const postMiddleware = obs => { return obs.do(val => console.log('STATE:', val))};

//create our store and dependencies

const dispatcher = new Dispatcher();

const store = new Store(dispatcher, appReducer, preMiddleware, postMiddleware, {hoursWorked: 10});

const subscriber = store

  //utilize our new select helper

  .select('person')

  .subscribe(val => console.log('VALUE OF PERSON:', val));

//dispatch a few actions

dispatcher.dispatch({

  type: 'ADD_INFO', 

  payload: {

    name: 'Brian', 

    message: 'Exploring Reduce!'

  }

});

dispatcher.dispatch({

  type: 'ADD_INFO', 

  payload: {

    goal: 'Learn @ngrx/store!'

  }

});

​