MPDX-9129 - MHA Eligibility check for new requests

src/components/Reports/MinisterHousingAllowance/MainPages/IneligibleDisplay.test.tsx

@@ -1,86 +1,93 @@
 import React from 'react';
 import { ThemeProvider } from '@mui/material/styles';
-import { LocalizationProvider } from '@mui/x-date-pickers';
-import { AdapterLuxon } from '@mui/x-date-pickers/AdapterLuxon';
 import { render } from '@testing-library/react';
+import TestRouter from '__tests__/util/TestRouter';
+import { GqlMockedProvider } from '__tests__/util/graphqlMocking';
 import theme from 'src/theme';
+import { HcmDataQuery } from '../../Shared/HcmData/HCMData.generated';
 import {
-  ContextType,
-  HcmData,
-  MinisterHousingAllowanceContext,
-} from '../Shared/Context/MinisterHousingAllowanceContext';
+  marriedBothIneligible,
+  marriedSpouseIneligible,
+  marriedUserIneligible,
+  singleIneligible,
+} from '../../Shared/HcmData/mockData';
+import { MinistryHousingAllowanceRequestsQuery } from '../MinisterHousingAllowance.generated';
+import { MinisterHousingAllowanceProvider } from '../Shared/Context/MinisterHousingAllowanceContext';
 import { IneligibleDisplay } from './IneligibleDisplay';
 
 interface TestComponentProps {
-  contextValue: Partial<ContextType>;
+  hcmMock: HcmDataQuery['hcm'];
 }
 
-const TestComponent: React.FC<TestComponentProps> = ({ contextValue }) => {
+const TestComponent: React.FC<TestComponentProps> = ({ hcmMock }) => {
   return (
     <ThemeProvider theme={theme}>
-      <LocalizationProvider dateAdapter={AdapterLuxon}>
-        <MinisterHousingAllowanceContext.Provider
-          value={contextValue as ContextType}
+      <TestRouter>
+        <GqlMockedProvider<{
+          HcmData: HcmDataQuery;
+          MinistryHousingAllowanceRequests: MinistryHousingAllowanceRequestsQuery;
+        }>
+          mocks={{
+            HcmData: {
+              hcm: hcmMock,
+            },
+            MinistryHousingAllowanceRequests: {
+              ministryHousingAllowanceRequests: {
+                nodes: [],
+              },
+            },
+          }}
         >
-          <IneligibleDisplay />
-        </MinisterHousingAllowanceContext.Provider>
-      </LocalizationProvider>
+          <MinisterHousingAllowanceProvider>
+            <IneligibleDisplay />
+          </MinisterHousingAllowanceProvider>
+        </GqlMockedProvider>
+      </TestRouter>
     </ThemeProvider>
   );
 };
 
 describe('IneligibleDisplay', () => {
-  it('should render page with single staff', () => {
-    const { getByText, queryByText } = render(
-      <TestComponent
-        contextValue={{
-          isMarried: false,
-          preferredName: 'John',
-          spousePreferredName: '',
-          userHcmData: {
-            staffInfo: {
-              personNumber: '000123456',
-            },
-          } as unknown as HcmData,
-          spouseHcmData: null,
-        }}
-      />,
+  it('should render page with single ineligible staff', async () => {
+    const { findByRole, findByText, findByTestId } = render(
+      <TestComponent hcmMock={singleIneligible} />,
     );
 
-    expect(getByText('Your MHA')).toBeInTheDocument();
     expect(
-      getByText(
+      await findByRole('heading', { name: 'Your MHA' }),
+    ).toBeInTheDocument();
+    expect(
+      await findByText(
         /our records indicate that you have not applied for minister's housing allowance/i,
       ),
     ).toBeInTheDocument();
-    expect(
-      queryByText(/Jane has not completed the required ibs courses/i),
-    ).not.toBeInTheDocument();
+    expect(await findByTestId('user-ineligible-message')).toBeInTheDocument();
   });
 
-  it('should render page with married staff', () => {
-    const { getByText } = render(
-      <TestComponent
-        contextValue={{
-          isMarried: true,
-          preferredName: 'John',
-          spousePreferredName: 'Jane',
-          userHcmData: {
-            staffInfo: {
-              personNumber: '000123456',
-            },
-          } as unknown as HcmData,
-          spouseHcmData: {
-            staffInfo: {
-              personNumber: '100123456',
-            },
-          } as unknown as HcmData,
-        }}
-      />,
+  it('should render page with married staff and ineligible spouse', async () => {
+    const { findByTestId } = render(
+      <TestComponent hcmMock={marriedSpouseIneligible} />,
     );
 
-    expect(
-      getByText(/Jane has not completed the required ibs courses/i),
-    ).toBeInTheDocument();
+    expect(await findByTestId('spouse-ineligible-message')).toBeInTheDocument();
+    expect(await findByTestId('user-ineligible-message')).toBeInTheDocument();
+  });
+
+  it('should render page with married staff and ineligible user', async () => {
+    const { findByTestId, queryByTestId } = render(
+      <TestComponent hcmMock={marriedUserIneligible} />,
+    );
+
+    expect(await findByTestId('user-ineligible-message')).toBeInTheDocument();
+    expect(queryByTestId('spouse-ineligible-message')).not.toBeInTheDocument();
+  });
+
+  it('should render page with both married staff ineligible', async () => {
+    const { findByTestId, queryByTestId } = render(
+      <TestComponent hcmMock={marriedBothIneligible} />,
+    );
+
+    expect(await findByTestId('user-ineligible-message')).toBeInTheDocument();
+    expect(queryByTestId('spouse-ineligible-message')).not.toBeInTheDocument();
   });
 });

src/components/Reports/MinisterHousingAllowance/MainPages/IneligibleDisplay.tsx

@@ -4,44 +4,63 @@
 
 export const IneligibleDisplay: React.FC = () => {
   const { t } = useTranslation();
-  const { isMarried, preferredName, spousePreferredName } =
-    useMinisterHousingAllowance();
-
-  // TODO - Add spouse to API and check eligibility
-  // We will get this from HCM data in the future
-  const spouseEligibleForMHA = false;
+  const {
+    isMarried,
+    preferredName,
+    spousePreferredName,
+    userEligibleForMHA,
+    spouseEligibleForMHA,
+    hcmLoading,
+  } = useMinisterHousingAllowance();
 
   return (
     <>
       <Box mb={2}>
         <Typography variant="h5">{t('Your MHA')}</Typography>
       </Box>
       <Box>
         <Trans
           i18nKey={isMarried ? 'newMhaRequestMarried' : 'newMhaRequestSingle'}
         >
           <p style={{ lineHeight: 1.5 }}>
             Our records indicate that you have not applied for Minister&apos;s
             Housing Allowance. If you would like information about applying for
             one, contact Personnel Records at 407-826-2252 or{' '}
             <a href="mailto:MHA@cru.org">MHA@cru.org</a>.
           </p>
         </Trans>
-        {isMarried && spouseEligibleForMHA === false && (
-          <Box mt={2}>
-            <Trans i18nKey="spouseNotEligibleMha">
-              <p style={{ lineHeight: 1.5 }}>
-                Completing a Minister&apos;s Housing Allowance will submit the
-                request for {preferredName}. {spousePreferredName} has not
-                completed the required IBS courses to meet eligibility criteria.
-                When you calculate your salary, you will see the approved amount
-                that can be applied to {preferredName}&apos;s salary. If you
-                believe this is incorrect, please contact Personnel Records at
-                407-826-2252 or <a href="mailto:MHA@cru.org">MHA@cru.org</a>.
-              </p>
-            </Trans>
-          </Box>
-        )}
+        {!hcmLoading &&
+          isMarried &&
+          userEligibleForMHA &&
+          !spouseEligibleForMHA && (
+            <Box mt={2} data-testid="spouse-ineligible-message">
+              <Trans
+                i18nKey="spouseNotEligibleMha"
+                values={{ preferredName, spousePreferredName }}
+              >
+                <p style={{ lineHeight: 1.5 }}>
+                  Completing a Minister&apos;s Housing Allowance calculation
+                  form will submit the request for {preferredName}.{' '}
+                  {spousePreferredName} has not completed the required IBS
+                  courses to meet eligibility criteria.
+                </p>
+              </Trans>
+            </Box>
+          )}
+        {!hcmLoading &&
+          ((isMarried && !spouseEligibleForMHA) || !userEligibleForMHA) && (
+            <Box mt={2} data-testid="user-ineligible-message">
+              <Trans i18nKey="userNotEligibleMha" values={{ preferredName }}>
+                <p style={{ lineHeight: 1.5 }}>
+                  Once approved, when you calculate your salary, you will see
+                  the approved amount that can be applied to {preferredName}
+                  &apos;s salary. If you believe this is incorrect, please
+                  contact Personnel Records at 407-826-2236 or{' '}
+                  <a href="mailto:MHA@cru.org">MHA@cru.org</a>.
+                </p>
+              </Trans>
+            </Box>
+          )}
       </Box>
     </>
   );

src/components/Reports/MinisterHousingAllowance/MinisterHousingAllowance.test.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { ThemeProvider } from '@mui/material/styles';
-import { render } from '@testing-library/react';
+import { render, waitFor } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import { SnackbarProvider } from 'notistack';
 import TestRouter from '__tests__/util/TestRouter';
 import { GqlMockedProvider } from '__tests__/util/graphqlMocking';
@@ -9,15 +10,21 @@
 import { HcmDataQuery } from '../Shared/HcmData/HCMData.generated';
 import {
   marriedMhaAndNoException,
-  marriedNoMhaNoException,
+  marriedSpouseIneligible,
+  singleIneligible,
   singleMhaNoException,
   singleNoMhaNoException,
 } from '../Shared/HcmData/mockData';
 import { MinisterHousingAllowanceReport } from './MinisterHousingAllowance';
-import { MinistryHousingAllowanceRequestsQuery } from './MinisterHousingAllowance.generated';
+import {
+  CreateHousingAllowanceRequestMutation,
+  MinistryHousingAllowanceRequestsQuery,
+} from './MinisterHousingAllowance.generated';
 import { MinisterHousingAllowanceProvider } from './Shared/Context/MinisterHousingAllowanceContext';
 import { mockMHARequest } from './mockData';
 
+const mutationSpy = jest.fn();
+
 interface TestComponentProps {
   hcmMock: HcmDataQuery['hcm'];
   mhaRequestsMock: MinistryHousingAllowanceRequestsQuery['ministryHousingAllowanceRequests']['nodes'];
@@ -33,6 +40,7 @@
         <GqlMockedProvider<{
           HcmData: HcmDataQuery;
           MinistryHousingAllowanceRequests: MinistryHousingAllowanceRequestsQuery;
+          CreateHousingAllowanceRequest: CreateHousingAllowanceRequestMutation;
         }>
           mocks={{
             HcmData: {
@@ -44,6 +52,7 @@
               },
             },
           }}
+          onCall={mutationSpy}
         >
           <MinisterHousingAllowanceProvider>
             <MinisterHousingAllowanceReport />
@@ -66,17 +75,15 @@
     expect(await findByText('John Doe')).toBeInTheDocument();
   });
 
-  it('renders married, no pending, no approved correctly', async () => {
-    const { findByText } = render(
-      <TestComponent hcmMock={marriedNoMhaNoException} mhaRequestsMock={[]} />,
+  it('renders married with ineligible spouse, no approved requests', async () => {
+    const { findByText, findByTestId } = render(
+      <TestComponent hcmMock={marriedSpouseIneligible} mhaRequestsMock={[]} />,
     );
 
     expect(
       await findByText(/our records indicate that you have not applied for/i),
     ).toBeInTheDocument();
-    expect(
-      await findByText(/will submit the request for john. jane has not/i),
-    ).toBeInTheDocument();
+    expect(await findByTestId('spouse-ineligible-message')).toBeInTheDocument();
     expect(await findByText('John Doe and Jane Doe')).toBeInTheDocument();
   });
 
@@ -151,4 +158,48 @@
 
     expect(await findByText('Current MHA Request')).toBeInTheDocument();
   });
+
+  describe('Create MHA Request Eligibility', () => {
+    it('should allow create mutation when user is eligible', async () => {
+      const { findByText, getByRole } = render(
+        <TestComponent hcmMock={singleMhaNoException} mhaRequestsMock={[]} />,
+      );
+
+      // Wait for data to load
+      await findByText('John Doe');
+
+      const button = getByRole('button', { name: 'Request New MHA' });
+      expect(button).toBeEnabled();
+
+      userEvent.click(button);
+
+      await waitFor(() =>
+        expect(mutationSpy).toHaveGraphqlOperation(
+          'CreateHousingAllowanceRequest',
+        ),
+      );
+    });
+
+    it('should block create mutation when user is not eligible', async () => {
+      const { getByRole, findByText } = render(
+        <TestComponent hcmMock={singleIneligible} mhaRequestsMock={[]} />,
+      );
+
+      await findByText('John Doe');
+
+      const button = getByRole('button', { name: 'Request New MHA' });
+      userEvent.click(button);
+
+      // Should show error message and not trigger mutation
+      expect(
+        await findByText('You are not eligible to create a new MHA request.'),
+      ).toBeInTheDocument();
+
+      await waitFor(() => {
+        expect(mutationSpy).not.toHaveGraphqlOperation(
+          'CreateHousingAllowanceRequest',
+        );
+      });
+    });
+  });
 });

src/components/Reports/MinisterHousingAllowance/MinisterHousingAllowance.tsx

@@ -39,8 +39,12 @@
     spousePreferredName,
     userHcmData,
     spouseHcmData,
+    userEligibleForMHA,
+    spouseEligibleForMHA,
   } = useMinisterHousingAllowance();
 
+  const canAccessMHA = userEligibleForMHA || spouseEligibleForMHA;
+
   const personNumber = userHcmData?.staffInfo?.personNumber ?? '';
   const spousePersonNumber = spouseHcmData?.staffInfo?.personNumber ?? '';
   const lastName = userHcmData?.staffInfo?.lastName ?? '';
@@ -56,6 +60,13 @@
   const [createMHA] = useCreateHousingAllowanceRequestMutation();
 
   const onCreateMHARequest = async () => {
+    if (!userEligibleForMHA) {
+      enqueueSnackbar(t('You are not eligible to create a new MHA request.'), {
+        variant: 'error',
+      });
+      return;
+    }
+
     await createMHA({
       variables: {
         requestAttributes: {},
@@ -122,7 +133,7 @@
           ) : (
             <>
               <Stack direction="column" width={mainContentWidth}>
-                {hasNoRequests ? (
+                {hasNoRequests || !canAccessMHA ? (
                   <IneligibleDisplay />
                 ) : (
                   <EligibleDisplay isPending={isCurrentRequestPending} />
@@ -149,7 +160,7 @@
             </>
           )}
 
-          {previousApprovedRequest && (
+          {canAccessMHA && previousApprovedRequest && (
             <Stack direction="column" width={mainContentWidth} mt={4}>
               <CurrentBoardApproved request={previousApprovedRequest} />
             </Stack>