2 files changed, 26 insertions, 13 deletions

diff --git a/web/src/App.jsx b/web/src/App.jsx
index da7b2aa03..8125fea39 100644
--- a/web/src/App.jsx
+++ b/web/src/App.jsx
@@ -117,7 +117,7 @@ class App extends React.Component {
   }
 
   renderContent = () => {
-    const { info, tenant } = this.props
+    const { info, tenant, auth } = this.props
     const allRoutes = []
 
     if ((window.location.origin + window.location.pathname) ===
@@ -126,7 +126,7 @@ class App extends React.Component {
       // validation is complete (it will internally redirect when complete)
       return <AuthCallbackPage/>
     }
-    if (info.isFetching) {
+    if (info.isFetching || !auth.info || auth.isFetching) {
       return <Fetching />
     }
     this.menu
@@ -189,14 +189,14 @@ class App extends React.Component {
         this.props.dispatch(tenantAction)
         if (tenantName) {
           this.props.dispatch(fetchConfigErrorsAction(tenantAction.tenant))
-          if (whiteLabel) {
-            // The app info endpoint was already a tenant info
-            // endpoint, so auth info was already provided.
-            this.props.dispatch(configureAuthFromInfo(info))
-          } else {
-            // Query the tenant info endpoint for auth info.
-            this.props.dispatch(configureAuthFromTenant(tenantName))
-          }
+        }
+        if (whiteLabel || !tenantName) {
+          // The app info endpoint was already a tenant info
+          // endpoint, so auth info was already provided.
+          this.props.dispatch(configureAuthFromInfo(info))
+        } else {
+          // Query the tenant info endpoint for auth info.
+          this.props.dispatch(configureAuthFromTenant(tenantName))
         }
       }
     }
diff --git a/web/src/App.test.jsx b/web/src/App.test.jsx
index 9ef61e6d7..a1d0234d9 100644
--- a/web/src/App.test.jsx
+++ b/web/src/App.test.jsx
@@ -56,8 +56,14 @@ it('renders multi tenant', async () => {
   const auth_election = createLeaderElection(channel)
   api.fetchInfo.mockImplementation(
     () => Promise.resolve({data: {
-      info: {capabilities: {}}
-    }})
+      info: {
+        capabilities: {
+          auth: {
+            realms: {},
+            default_realm: null,
+          },
+        },
+      }}})
   )
   api.fetchTenants.mockImplementation(
     () => Promise.resolve({data: [{name: 'openstack'}]})
@@ -100,7 +106,14 @@ it('renders single tenant', async () => {
   const auth_election = createLeaderElection(channel)
   api.fetchInfo.mockImplementation(
     () => Promise.resolve({data: {
-      info: {capabilities: {}, tenant: 'openstack'}
+      info: {
+        capabilities: {
+          auth: {
+            realms: {},
+            default_realm: null,
+          },
+        },
+        tenant: 'openstack'}
     }})
   )
   api.fetchStatus.mockImplementation(