Remove global dependency on router history

client/coral-admin/src/AppRouter.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import {Router, Route, IndexRedirect, IndexRoute} from 'react-router';
-import {history} from 'coral-framework/helpers/router';
+import PropTypes from 'prop-types';
 
 import Configure from 'routes/Configure';
 import Dashboard from 'routes/Dashboard';
@@ -47,6 +47,14 @@ const routes = (
   </div>
 );
 
-const AppRouter = () => <Router history={history} routes={routes}/>;
+class AppRouter extends React.Component {
+  static contextTypes = {
+    history: PropTypes.object,
+  };
+
+  render() {
+    return <Router history={this.context.history} routes={routes} />;
+  }
+}
 
 export default AppRouter;

client/coral-embed-stream/src/AppRouter.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import {Router, Route} from 'react-router';
-import {history} from 'coral-framework/helpers/router';
+import PropTypes from 'prop-types';
 
 import Embed from './containers/Embed';
 import {LoginContainer} from 'coral-sign-in/containers/LoginContainer';
@@ -12,6 +12,14 @@ const routes = (
   </div>
 );
 
-const AppRouter = () => <Router history={history} routes={routes} />;
+class AppRouter extends React.Component {
+  static contextTypes = {
+    history: PropTypes.object,
+  };
+
+  render() {
+    return <Router history={this.context.history} routes={routes} />;
+  }
+}
 
 export default AppRouter;

client/coral-framework/components/TalkProvider.js

@@ -12,6 +12,7 @@ class TalkProvider extends React.Component {
       graphqlRegistry: this.props.graphqlRegistry,
       notification: this.props.notification,
       storage: this.props.storage,
+      history: this.props.history,
     };
   }
 
@@ -33,6 +34,7 @@ TalkProvider.childContextTypes = {
   graphqlRegistry: PropTypes.object,
   notification: PropTypes.object,
   storage: PropTypes.object,
+  history: PropTypes.object,
 };
 
 export default TalkProvider;

client/coral-framework/helpers/router.js

@@ -1,7 +0,0 @@
-import {useBasename} from 'history';
-import {browserHistory} from 'react-router';
-import {BASE_PATH} from 'coral-framework/constants/url';
-
-export const history = useBasename(() => browserHistory)({
-  basename: BASE_PATH
-});

client/coral-framework/services/bootstrap.js

@@ -13,6 +13,7 @@ import {createNotificationService} from './notification';
 import {createGraphQLRegistry} from './graphqlRegistry';
 import globalFragments from 'coral-framework/graphql/fragments';
 import {createStorage} from 'coral-framework/services/storage';
+import {createHistory} from 'coral-framework/services/history';
 
 /**
  * getAuthToken returns the active auth token or null
@@ -41,6 +42,7 @@ export function createContext({reducers = {}, pluginsConfig = [], graphqlExtensi
   const protocol = location.protocol === 'https:' ? 'wss' : 'ws';
   const eventEmitter = new EventEmitter({wildcard: true});
   const storage = createStorage();
+  const history = createHistory(BASE_PATH);
   let store = null;
   const token = () => {
 
@@ -76,6 +78,7 @@ export function createContext({reducers = {}, pluginsConfig = [], graphqlExtensi
     graphqlRegistry,
     notification,
     storage,
+    history,
   };
 
   // Load framework fragments.

client/coral-framework/services/history.js

@@ -0,0 +1,12 @@
+import {browserHistory} from 'react-router';
+import {useBasename} from 'history';
+
+export function createHistory(basename) {
+  if (!basename) {
+    return browserHistory;
+  }
+
+  return useBasename(() => browserHistory)({
+    basename
+  });
+}