UrlManager.js.diff

diff --git a/src/components/app/UrlManager.js b/src/components/app/UrlManager.js
index 6c12908a..82d7e868 100644
--- a/src/components/app/UrlManager.js
+++ b/src/components/app/UrlManager.js
@@ -8,7 +8,11 @@ import * as React from 'react';
 import explicitConnect from '../../utils/connect';
 import { getIsUrlSetupDone } from '../../selectors/app';
 import { updateUrlState, urlSetupDone, show404 } from '../../actions/app';
-import { urlFromState, stateFromLocation } from '../../app-logic/url-handling';
+import {
+  urlFromState,
+  stateFromLocation,
+  getProfilesFromRawUrl,
+} from '../../app-logic/url-handling';
 
 import type { ConnectedProps } from '../../utils/connect';
 import type { UrlState } from '../../types/state';
@@ -53,12 +57,41 @@ class UrlManager extends React.PureComponent<Props> {
     }
     updateUrlState(urlState);
   }
-  componentDidMount() {
-    this._updateState(true);
-    window.addEventListener('popstate', () => this._updateState(false));
+
+  // This method could be packaged up as its own ThunkAction.
+  async processInitialUrls() {
+    let profiles;
+    let error;
+
+    // Move the URL processing phase from "initial-load" to "loading-profile".
+    this.props.startFetchingProfiles();
+
+    try {
+      // Process the raw url, and fetch any profiles.
+      profiles = await getProfilesFromRawUrl(window.location);
+    } catch (err) {
+      error = err;
+    }
+
+    if (profiles) {
+      // This will process the initial URL state, but already have the profiles
+      // that were referenced. This will move the UrlSetupPhase to "done".
+      this.props.setupInitialUrlState(window.location, profiles);
+    } else if (error) {
+      // In case of an error fetching, this will notify the store, and the UrlSetupPhase
+      // will move to "done".
+      this.props.unableToFetchProfiles(error);
+    } else {
+      throw new Error('This if branch should not be reached.');
+    }
+
     this.props.urlSetupDone();
   }
 
+  componentDidMount() {
+    this.processInitialUrls();
+  }
+
   componentWillReceiveProps(nextProps: Props) {
     const { isUrlSetupDone } = this.props;
     const newUrl = urlFromState(nextProps.urlState);
@@ -72,19 +105,25 @@ class UrlManager extends React.PureComponent<Props> {
   }
 
   render() {
-    const { isUrlSetupDone } = this.props;
-    return isUrlSetupDone ? (
-      this.props.children
-    ) : (
-      <div className="processingUrl" />
-    );
+    // This render function changes from an `if` check to a switch to handle the
+    // three cases of the url setup phase, with a new "loading-profile" phase.
+    switch (urlSetupPhase) {
+      case 'initial-load':
+        return null;
+      case 'loading-profile':
+        return <ProfileLoaderAnimation />;
+      case 'done':
+        return <div className="processingUrl" />;
+      default:
+        assertExhaustiveCheck(urlSetupPhase, `Unhandled URL setup phase.`);
+    }
   }
 }
 
 export default explicitConnect<OwnProps, StateProps, DispatchProps>({
   mapStateToProps: state => ({
     urlState: state.urlState,
-    isUrlSetupDone: getIsUrlSetupDone(state),
+    urlSetupPhase: getUrlPhase(state),
   }),
   mapDispatchToProps: {
     updateUrlState,