feat: hide signup page on the bases of flag (#837)

Co-authored-by: attiyaishaque <atiya.ishaq@arbisoft.com>

src/common-components/EnterpriseSSO.jsx

@@ -15,6 +15,7 @@ import messages from './messages';
 const EnterpriseSSO = (props) => {
   const { intl } = props;
   const tpaProvider = props.provider;
+  const disablePublicAccountCreation = getConfig().ALLOW_PUBLIC_ACCOUNT_CREATION === false;
 
   const handleSubmit = (e, url) => {
     e.preventDefault();
@@ -61,12 +62,15 @@ const EnterpriseSSO = (props) => {
               <div className="mb-4" />
               <Button
                 type="submit"
+                id="other-ways-to-sign-in"
                 variant="outline-primary"
                 state="Complete"
                 className="w-100"
                 onClick={(e) => handleClick(e)}
               >
-                {intl.formatMessage(messages['enterprisetpa.login.button.text'])}
+                {disablePublicAccountCreation
+                  ? intl.formatMessage(messages['enterprisetpa.login.button.text.public.account.creation.disabled'])
+                  : intl.formatMessage(messages['enterprisetpa.login.button.text'])}
               </Button>
             </Form>
           </div>

src/common-components/Logistration.jsx

@@ -25,6 +25,7 @@ const Logistration = (props) => {
   const tpa = getTpaHint();
   const [institutionLogin, setInstitutionLogin] = useState(false);
   const [key, setKey] = useState('');
+  const disablePublicAccountCreation = getConfig().ALLOW_PUBLIC_ACCOUNT_CREATION === false;
 
   useEffect(() => {
     const authService = getAuthService();
@@ -63,30 +64,56 @@ const Logistration = (props) => {
   return (
     <BaseComponent>
       <div>
-        {institutionLogin
+        {disablePublicAccountCreation
           ? (
-            <Tabs defaultActiveKey="" id="controlled-tab" onSelect={handleInstitutionLogin}>
-              <Tab title={tabTitle} eventKey={selectedPage === LOGIN_PAGE ? LOGIN_PAGE : REGISTER_PAGE} />
-            </Tabs>
-          )
-          : (
             <>
-              {!tpa && (
-                <Tabs defaultActiveKey={selectedPage} id="controlled-tab" onSelect={handleOnSelect}>
-                  <Tab title={intl.formatMessage(messages['logistration.register'])} eventKey={REGISTER_PAGE} />
-                  <Tab title={intl.formatMessage(messages['logistration.sign.in'])} eventKey={LOGIN_PAGE} />
+              <Redirect to={updatePathWithQueryParams(LOGIN_PAGE)} />
+              {institutionLogin && (
+                <Tabs defaultActiveKey="" id="controlled-tab" onSelect={handleInstitutionLogin}>
+                  <Tab title={tabTitle} eventKey={LOGIN_PAGE} />
                 </Tabs>
               )}
+              <div id="main-content" className="main-content">
+                {!institutionLogin && (
+                  <h3 className="mb-4.5">{intl.formatMessage(messages['logistration.sign.in'])}</h3>
+                )}
+                <LoginPage institutionLogin={institutionLogin} handleInstitutionLogin={handleInstitutionLogin} />
+              </div>
             </>
+          )
+          : (
+            <div>
+              {institutionLogin
+                ? (
+                  <Tabs defaultActiveKey="" id="controlled-tab" onSelect={handleInstitutionLogin}>
+                    <Tab title={tabTitle} eventKey={selectedPage === LOGIN_PAGE ? LOGIN_PAGE : REGISTER_PAGE} />
+                  </Tabs>
+                )
+                : (
+                  <>
+                    {!tpa && (
+                      <Tabs defaultActiveKey={selectedPage} id="controlled-tab" onSelect={handleOnSelect}>
+                        <Tab title={intl.formatMessage(messages['logistration.register'])} eventKey={REGISTER_PAGE} />
+                        <Tab title={intl.formatMessage(messages['logistration.sign.in'])} eventKey={LOGIN_PAGE} />
+                      </Tabs>
+                    )}
+                  </>
+                )}
+              { key && (
+                <Redirect to={updatePathWithQueryParams(key)} />
+              )}
+              <div id="main-content" className="main-content">
+                {selectedPage === LOGIN_PAGE
+                  ? <LoginPage institutionLogin={institutionLogin} handleInstitutionLogin={handleInstitutionLogin} />
+                  : (
+                    <RegistrationPage
+                      institutionLogin={institutionLogin}
+                      handleInstitutionLogin={handleInstitutionLogin}
+                    />
+                  )}
+              </div>
+            </div>
           )}
-        { key && (
-          <Redirect to={updatePathWithQueryParams(key)} />
-        )}
-        <div id="main-content" className="main-content">
-          {selectedPage === LOGIN_PAGE
-            ? <LoginPage institutionLogin={institutionLogin} handleInstitutionLogin={handleInstitutionLogin} />
-            : <RegistrationPage institutionLogin={institutionLogin} handleInstitutionLogin={handleInstitutionLogin} />}
-        </div>
       </div>
     </BaseComponent>
   );

src/common-components/messages.jsx

@@ -60,6 +60,11 @@ const messages = defineMessages({
     defaultMessage: 'Show me other ways to sign in or register',
     description: 'Button text for login',
   },
+  'enterprisetpa.login.button.text.public.account.creation.disabled': {
+    id: 'enterprisetpa.login.button.text.public.account.creation.disabled',
+    defaultMessage: 'Show me other ways to sign in',
+    description: 'Button text for login when account creation is disabled',
+  },
   // social auth providers
   'sso.sign.in.with': {
     id: 'sso.sign.in.with',

src/common-components/tests/Logistration.test.jsx

@@ -51,6 +51,9 @@ describe('Logistration', () => {
       messages: { 'es-419': {}, de: {}, 'en-us': {} },
     });
 
+    mergeConfig({
+      ALLOW_PUBLIC_ACCOUNT_CREATION: true,
+    });
     store = mockStore({
       register: {
         registrationResult: { success: false, redirectUrl: '' },
@@ -81,9 +84,42 @@ describe('Logistration', () => {
     expect(logistration.find('#main-content').find('LoginPage').exists()).toBeTruthy();
   });
 
+  it('should render only login page when public account creation is disabled', () => {
+    mergeConfig({
+      ALLOW_PUBLIC_ACCOUNT_CREATION: false,
+      DISABLE_ENTERPRISE_LOGIN: 'true',
+    });
+
+    store = mockStore({
+      login: {
+        loginResult: { success: false, redirectUrl: '' },
+      },
+      commonComponents: {
+        thirdPartyAuthContext: {
+          currentProvider: null,
+          finishAuthUrl: null,
+          providers: [],
+          secondaryProviders: [secondaryProviders],
+        },
+        thirdPartyAuthApiStatus: COMPLETE_STATE,
+      },
+    });
+
+    const props = { selectedPage: LOGIN_PAGE };
+    const logistration = mount(reduxWrapper(<IntlLogistration {...props} />));
+
+    // verifying sign in heading for institution login false
+    expect(logistration.find('#main-content').find('h3').text()).toEqual('Sign in');
+
+    // verifying tabs heading for institution login true
+    logistration.find(RenderInstitutionButton).simulate('click', { institutionLogin: true });
+    expect(logistration.find('#controlled-tab').exists()).toBeTruthy();
+  });
+
   it('should display institution login option when secondary providers are present', () => {
     mergeConfig({
       DISABLE_ENTERPRISE_LOGIN: 'true',
+      ALLOW_PUBLIC_ACCOUNT_CREATION: 'true',
     });
 
     store = mockStore({

src/login/tests/LoginPage.test.jsx

@@ -611,6 +611,51 @@ describe('LoginPage', () => {
     });
   });
 
+  it('should render other ways to sign in button', () => {
+    store = mockStore({
+      ...initialState,
+      commonComponents: {
+        ...initialState.commonComponents,
+        thirdPartyAuthContext: {
+          ...initialState.commonComponents.thirdPartyAuthContext,
+          providers: [ssoProvider],
+        },
+        thirdPartyAuthApiStatus: COMPLETE_STATE,
+      },
+    });
+
+    delete window.location;
+    window.location = { href: getConfig().BASE_URL.concat('/login'), search: `?tpa_hint=${ssoProvider.id}` };
+    ssoProvider.iconImage = null;
+
+    const loginPage = mount(reduxWrapper(<IntlLoginPage {...props} />));
+    expect(loginPage.find('button#other-ways-to-sign-in').text()).toEqual('Show me other ways to sign in or register');
+  });
+
+  it('should render other ways to sign in button when public account creation disabled', () => {
+    mergeConfig({
+      ALLOW_PUBLIC_ACCOUNT_CREATION: false,
+    });
+    store = mockStore({
+      ...initialState,
+      commonComponents: {
+        ...initialState.commonComponents,
+        thirdPartyAuthContext: {
+          ...initialState.commonComponents.thirdPartyAuthContext,
+          providers: [ssoProvider],
+        },
+        thirdPartyAuthApiStatus: COMPLETE_STATE,
+      },
+    });
+
+    delete window.location;
+    window.location = { href: getConfig().BASE_URL.concat('/login'), search: `?tpa_hint=${ssoProvider.id}` };
+    ssoProvider.iconImage = null;
+
+    const loginPage = mount(reduxWrapper(<IntlLoginPage {...props} />));
+    expect(loginPage.find('button#other-ways-to-sign-in').text()).toEqual('Show me other ways to sign in');
+  });
+
   // ******** miscellaneous tests ********
 
   it('should render cookie banner', () => {