Navigation

For navigation, we use react-router.

Configuration

We defined a globally accessible browser history object in the history.js service. In index.js, we declare the global Router, and in App.js, we declare all the routes.

Is it integrated with Redux?

We do not manage the navigation status in Redux. However, we base the navigation as side effects of actions.

Where is the navigation performed?

In the navigation.js module, and it works using sagas. We listen to certain actions and then push to the global history.

Navigation considerations

Each root component for a route is in charge of loading whatever data is needed for them to manage. For instance, the EditPage component, which is the one rendered for the /graphs/<GRAPH_NAME> route, will load the graph which name comes in the URL. That way, accessing a page by typing the URL in the browser, or reloading the page, will load the proper data into the state and thus the app will not start in an inconsistent status.