observable-history.js

import {Observable} from 'rxjs/Observable';
import {Subscription} from 'rxjs/Subscription';
import {map} from 'rxjs/operator/map';
import useRouterHistory from 'react-router/lib/useRouterHistory';
import createTransitionManager from 'react-router/lib/createTransitionManager';
import {stringify, parse} from 'qs';
 
const RAILS_QUERY_FORMAT = {arrayFormat: 'brackets'};
const stringifyQuery = query => stringify(query, RAILS_QUERY_FORMAT).replace(/%20/g, '+');
const parseQueryString = query => parse(query, RAILS_QUERY_FORMAT);
 
function observe(history) {
  const source = new Observable(obs => {
    return new Subscription(history.listen((_err, state) => obs.next(state)));
  });
  return source::map(x => ({...x, isActive: history.isActive}));
}
 
export default function createObservableHistory(createHistory, routes) {
  const routerHistory = useRouterHistory(createHistory)({stringifyQuery, parseQueryString});
  const routingHistory = createTransitionManager(routerHistory, routes);
  const historyStream = observe(routingHistory);
  return {routerHistory, historyStream};
}