MPDX-7893 - Allowing users to add offline organizations to their accounts

src/components/Settings/integrations/Organization/Modals/OrganizationAddAccountModal.test.tsx

@@ -83,6 +83,14 @@ const GetOrganizationsMock: Pick<
     giftAidPercentage: 60,
     disableNewUsers: true,
   },
+  {
+    id: 'disableNewUserAsNull',
+    name: 'Org With DisableNewUsers As NULL',
+    apiClass: 'OfflineOrg',
+    oauth: false,
+    giftAidPercentage: 60,
+    disableNewUsers: null,
+  },
 ];
 
 const standardMocks = {
@@ -178,6 +186,46 @@ describe('OrganizationAddAccountModal', () => {
     });
   });
 
+  it('allows offline Organization to be added if disableNewUsers is null', async () => {
+    const mutationSpy = jest.fn();
+    const { getByText, getByRole, findByRole } = render(
+      <Components>
+        <GqlMockedProvider<{
+          GetOrganizations: GetOrganizationsQuery;
+        }>
+          mocks={{
+            getOrganizations: {
+              organizations: GetOrganizationsMock,
+            },
+          }}
+          onCall={mutationSpy}
+        >
+          <OrganizationAddAccountModal
+            handleClose={handleClose}
+            refetchOrganizations={refetchOrganizations}
+            accountListId={accountListId}
+          />
+        </GqlMockedProvider>
+      </Components>,
+    );
+
+    userEvent.click(getByRole('combobox'));
+    userEvent.click(
+      await findByRole('option', { name: 'Org With DisableNewUsers As NULL' }),
+    );
+
+    await waitFor(() => {
+      expect(getByText('Add Account')).not.toBeDisabled();
+      userEvent.click(getByText('Add Account'));
+    });
+    await waitFor(() => {
+      expect(mockEnqueue).toHaveBeenCalledWith(
+        '{{appName}} added your organization account',
+        { variant: 'success' },
+      );
+    });
+  });
+
   it('should select Ministry Organization and be unable to add it.', async () => {
     const mutationSpy = jest.fn();
     const { getByText, getByRole } = render(

src/components/Settings/integrations/Organization/Modals/OrganizationAddAccountModal.tsx

@@ -56,6 +56,41 @@ export type OrganizationFormikSchema = {
   password: string | undefined;
 };
 
+const OrganizationSchema: yup.SchemaOf<OrganizationFormikSchema> = yup.object({
+  selectedOrganization: yup
+    .object({
+      id: yup.string().required(),
+      apiClass: yup.string().required(),
+      name: yup.string().required(),
+      oauth: yup.boolean().required(),
+      giftAidPercentage: yup.number().nullable(),
+      disableNewUsers: yup.boolean().nullable(),
+    })
+    .required(),
+  username: yup
+    .string()
+    .when('selectedOrganization', (organization, schema) => {
+      if (
+        getOrganizationType(organization?.apiClass, organization?.oauth) ===
+        OrganizationTypesEnum.LOGIN
+      ) {
+        return schema.required('Must enter username');
+      }
+      return schema;
+    }),
+  password: yup
+    .string()
+    .when('selectedOrganization', (organization, schema) => {
+      if (
+        getOrganizationType(organization?.apiClass, organization?.oauth) ===
+        OrganizationTypesEnum.LOGIN
+      ) {
+        return schema.required('Must enter password');
+      }
+      return schema;
+    }),
+});
+
 const StyledBox = styled(Box)(() => ({
   padding: '0 10px',
 }));
@@ -144,43 +179,6 @@ export const OrganizationAddAccountModal: React.FC<
     showArticle('HS_SETUP_FIND_ORGANIZATION');
   };
 
-  const OrganizationSchema: yup.SchemaOf<OrganizationFormikSchema> = yup.object(
-    {
-      selectedOrganization: yup
-        .object({
-          id: yup.string().required(),
-          apiClass: yup.string().required(),
-          name: yup.string().required(),
-          oauth: yup.boolean().required(),
-          giftAidPercentage: yup.number().nullable(),
-          disableNewUsers: yup.boolean(),
-        })
-        .required(),
-      username: yup
-        .string()
-        .when('selectedOrganization', (organization, schema) => {
-          if (
-            getOrganizationType(organization?.apiClass, organization?.oauth) ===
-            OrganizationTypesEnum.LOGIN
-          ) {
-            return schema.required('Must enter username');
-          }
-          return schema;
-        }),
-      password: yup
-        .string()
-        .when('selectedOrganization', (organization, schema) => {
-          if (
-            getOrganizationType(organization?.apiClass, organization?.oauth) ===
-            OrganizationTypesEnum.LOGIN
-          ) {
-            return schema.required('Must enter password');
-          }
-          return schema;
-        }),
-    },
-  );
-
   return (
     <Modal
       isOpen={true}
@@ -239,13 +237,11 @@ export const OrganizationAddAccountModal: React.FC<
                 )}
               />
             </StyledBox>
-
             {!selectedOrganization && !!articles.HS_SETUP_FIND_ORGANIZATION && (
               <Button onClick={showOrganizationHelp}>
                 {t("Can't find your organization?")}
               </Button>
             )}
-
             {organizationType === OrganizationTypesEnum.MINISTRY && (
               <WarningBox>
                 <Typography
@@ -288,7 +284,9 @@ export const OrganizationAddAccountModal: React.FC<
                           });
                         }}
                       >
-                        {t('click here to log out of {{appName}}', { appName })}
+                        {t('click here to log out of {{appName}}', {
+                          appName,
+                        })}
                       </Link>
                       {t(
                         ' so you can log back in with your official key account.',
@@ -307,7 +305,6 @@ export const OrganizationAddAccountModal: React.FC<
                 </StyledTypography>
               </WarningBox>
             )}
-
             {organizationType === OrganizationTypesEnum.OAUTH && (
               <WarningBox>
                 <Typography color={theme.palette.mpdxYellow.contrastText}>
@@ -318,7 +315,6 @@ export const OrganizationAddAccountModal: React.FC<
                 </Typography>
               </WarningBox>
             )}
-
             {organizationType === OrganizationTypesEnum.LOGIN && (
               <>
                 <StyledBox marginTop={4}>
@@ -353,7 +349,6 @@ export const OrganizationAddAccountModal: React.FC<
                 </StyledBox>
               </>
             )}
-
             <DialogActions>
               <CancelButton onClick={handleClose} disabled={isSubmitting} />