React Router in meteor.startup.js (meteor top-level)

Question

I'm using meteor with React Router, meteor-webpack and meteor-useraccounts.

I want to redirect my user after a successfully logged in.

From the user accounts doc :

var mySubmitFunc = function(error, state){
  if (!error) {
     if (state === "signIn") {
     // Successfully logged in
     // ...
    }
  if (state === "signUp") {
    // Successfully registered
    // ...
    }
  }
};

AccountsTemplates.configure({
   onSubmitHook: mySubmitFunc
});

Because AccountsTemplates configuration should be called in top-level code, this code has to be in meteor.startup.js when you are using meteor-webpack.

I wish call browserHistory.push('/some/path') in the "Successfully logged in" state but I have no access to my react router at this level.

What are my possibilities ?

Answer 1

Inside startup client folder I have file routes.js like this.

import React from 'react';
import { Meteor } from 'meteor/meteor';
import { render } from 'react-dom';
import { Router, Route, browserHistory, IndexRoute } from 'react-router';

import { App } from '../../ui/App';
import { NavLayout } from '../../ui/layouts/NavLayout';
import { Index } from '../../ui/pages/Index';
import { TasksList } from '../../ui/pages/TasksList';
import { ReportsList } from '../../ui/pages/ReportsList';
import { TechniciansList } from '../../ui/pages/TechniciansList';
import { ChangePassword } from '../../ui/pages/ChangePassword';

const requireAuth = (nextState, replace) => {
  if (!Meteor.loggingIn() && !Meteor.userId()) {
    replace({
      pathname: '/logout',
      state: { nextPathname: nextState.location.pathname },
    });
  }
};

Meteor.startup(() => {
  render(
    <Router history={ browserHistory }>
      <Route path="/" component={ App }>
        <Route component={ NavLayout }>
          <IndexRoute component={ Index } onEnter={ requireAuth } />
           <Route path="/techniciens" component={ TechniciansList } onEnter={ requireAuth } />
          <Route path="/techniciens/:id/edit" component={ EditTechnician } onEnter={ requireAuth } />
          <Route path="/clients" component={ ClientsList } onEnter={ requireAuth } />
          <Route path="/clients/:id" component={ ClientDetails } onEnter={ requireAuth } />
          <Route path="/appareils" component={ MachinesList } onEnter={ requireAuth } />
          <Route path="/appareils/:id" component={ MachineDetails } onEnter={ requireAuth } />

          <Route path="/change-password" component={ ChangePassword } onEnter={ requireAuth } />
        </Route>

        <Route path="/logout" component={ Connexion } />
      </Route>
    </Router>,
    document.getElementById('react-root')
  );
});