example-navigation.js

/*eslint-disable */

const PUSH = '@@nav/PUSH';
const POP = '@@nav/POP';

const INDEX = '@@articles/INDEX';
const ARTICLE = '@@articles/ARTICLE';
const COMMENTS = '@@articles/COMMENTS';


const navActions = {
  push: (payload) => { type: PUSH, payload },
  pop: () => { type: POP }
};

const routeMap = [
  {
    key: ARTICLES,
    renderer: (props) => {}
  }, {
    key: ARTICLE,
    renderer: (props) => {}
  }, {
    key: COMMENTS,
    renderer: (props) => {}
  }
];

routeMap.prototype.get = function(key) {
  const keys = routeMap.map(r => r.key);
  const route = keys[key];
  
  if (route) {
    return route.renderer;
  } else {
    return null;
  }
}

const initialState = {
  key: 'articles',
  index: 0,
  history: [
    {
      key: 'index',
      index: 0
    }
  ]
};

const articlesReducer = (state = initialState, action) => {
  switch(action.type) {
    case PUSH:
      return {
        ...state,
        history: history.push(action.payload)
      };
    case POP: {
      if (history.length > 1) {
       return {
         ...state,
         history: history.pop() // imaginary api
       };
      } else {
        return state;
      }
    }

    default:
      return state;
  }
};

const render = (props) => {
  const component = routeMap.get(props.history.last.key);

  if (component) {
    return component(props);
  } else {
    return null;
  }
};