Fix login after source variables change

awx/ui_next/src/screens/Login/Login.jsx

@@ -7,11 +7,10 @@ import styled from 'styled-components';
 import { LoginForm, LoginPage as PFLoginPage } from '@patternfly/react-core';
 import useRequest, { useDismissableError } from '../../util/useRequest';
 import { RootAPI } from '../../api';
-import { BrandName } from '../../variables';
 import AlertModal from '../../components/AlertModal';
 import ErrorDetail from '../../components/ErrorDetail';
 
-import brandLogo from './brand-logo.svg';
+const loginLogoSrc = '/static/media/logo-login.svg';
 
 const LoginPage = styled(PFLoginPage)`
   & .pf-c-brand {
@@ -24,21 +23,27 @@ function AWXLogin({ alt, i18n, isAuthenticated }) {
     isLoading: isCustomLoginInfoLoading,
     error: customLoginInfoError,
     request: fetchCustomLoginInfo,
-    result: { logo, loginInfo },
+    result: { brandName, logo, loginInfo },
   } = useRequest(
     useCallback(async () => {
-      const {
+      const [
-        data: { custom_logo, custom_login_info },
+        {
-      } = await RootAPI.read();
+          data: { custom_logo, custom_login_info },
+        },
+        {
+          data: { BRAND_NAME },
+        },
+      ] = await Promise.all([RootAPI.read(), RootAPI.readAssetVariables()]);
       const logoSrc = custom_logo
         ? `data:image/jpeg;${custom_logo}`
-        : brandLogo;
+        : loginLogoSrc;
       return {
+        brandName: BRAND_NAME,
         logo: logoSrc,
         loginInfo: custom_login_info,
       };
     }, []),
-    { logo: brandLogo, loginInfo: null }
+    { brandName: null, logo: loginLogoSrc, loginInfo: null }
   );
 
   const {
@@ -70,8 +75,6 @@ function AWXLogin({ alt, i18n, isAuthenticated }) {
     await authenticate(values);
   };
 
-  const brandName = BrandName;
-
   if (isCustomLoginInfoLoading) {
     return null;
   }
@@ -91,7 +94,11 @@ function AWXLogin({ alt, i18n, isAuthenticated }) {
     <LoginPage
       brandImgSrc={logo}
       brandImgAlt={alt || brandName}
-      loginTitle={i18n._(t`Welcome to Ansible ${brandName}! Please Sign In.`)}
+      loginTitle={
+        brandName
+          ? i18n._(t`Welcome to Ansible ${brandName}! Please Sign In.`)
+          : ''
+      }
       textContent={loginInfo}
     >
       <Formik

awx/ui_next/src/screens/Login/Login.test.jsx

@@ -10,6 +10,12 @@ import AWXLogin from './Login';
 
 jest.mock('../../api');
 
+RootAPI.readAssetVariables.mockResolvedValue({
+  data: {
+    BRAND_NAME: 'AWX',
+  },
+});
+
 describe('<Login />', () => {
   async function findChildren(wrapper) {
     const [
@@ -100,7 +106,7 @@ describe('<Login />', () => {
     });
     const { loginHeaderLogo } = await findChildren(wrapper);
     const { alt, src } = loginHeaderLogo.props();
-    expect([alt, src]).toEqual(['AWX', 'brand-logo.svg']);
+    expect([alt, src]).toEqual(['AWX', '/static/media/logo-login.svg']);
     done();
   });
 
@@ -123,7 +129,7 @@ describe('<Login />', () => {
     });
     const { loginHeaderLogo } = await findChildren(wrapper);
     const { alt, src } = loginHeaderLogo.props();
-    expect([alt, src]).toEqual(['AWX', 'brand-logo.svg']);
+    expect([alt, src]).toEqual([null, '/static/media/logo-login.svg']);
     expect(wrapper.find('AlertModal').length).toBe(1);
     done();
   });