PSP-8794 : Allow payment periods to have default start date (#4221)

Co-authored-by: Herrera <eduardo.herrera@quartech.com> Co-authored-by: Alejandro Sanchez <emailforasr@gmail.com>
bcgov · Jul 23, 2024 · 43d437e · 43d437e
1 parent b58874d
commit 43d437e
Show file tree

Hide file tree

Showing 2 changed files with 58 additions and 3 deletions.
diff --git a/...e/frontend/src/features/leases/detail/LeasePages/payment/PeriodPaymentsContainer.test.tsx b/...e/frontend/src/features/leases/detail/LeasePages/payment/PeriodPaymentsContainer.test.tsx
@@ -120,6 +120,7 @@ describe('PeriodsPaymentsContainer component', () => {
 
     return {
       component,
+      periodStartDateInput: () => document.querySelector('#datepicker-startDate') as HTMLElement,
     };
   };
 
@@ -149,7 +150,8 @@ describe('PeriodsPaymentsContainer component', () => {
       try {
         mockGetLeasePeriods.response = [];
         const {
-          component: { getAllByText, getByDisplayValue },
+          component: { getAllByText },
+          periodStartDateInput,
         } = await setup({ claims: [Claims.LEASE_EDIT, Claims.LEASE_ADD] });
         mockAxios.onPost().reply(200, { id: 1 });
 
@@ -158,7 +160,48 @@ describe('PeriodsPaymentsContainer component', () => {
           userEvent.click(addButton);
         });
 
-        expect(getByDisplayValue('Jan 01, 2020')).toBeVisible();
+        expect(periodStartDateInput()).toHaveValue('Jan 01, 2020');
+      } finally {
+        mockGetLeasePeriods.response = temp;
+      }
+    });
+
+    it('when adding a new sequential period, the start date is set to one day after the previous period expiry date', async () => {
+      const {
+        component: { getAllByText },
+        periodStartDateInput,
+      } = await setup({ claims: [Claims.LEASE_EDIT, Claims.LEASE_ADD] });
+
+      const addButton = getAllByText('Add a Period')[0];
+      await act(async () => {
+        userEvent.click(addButton);
+      });
+
+      expect(periodStartDateInput()).toHaveValue('Jan 02, 2020');
+    });
+
+    it('when adding a new seqquential period, the start date is set to empty when previous period is flexible and no expiry date', async () => {
+      const temp = mockGetLeasePeriods.response;
+      try {
+        mockGetLeasePeriods.response = [
+          FormLeasePeriod.toApi({
+            ...defaultFormLeasePeriod,
+            isFlexible: 'true',
+            expiryDate: null,
+            payments: [],
+          }),
+        ];
+        const {
+          component: { getAllByText },
+          periodStartDateInput,
+        } = await setup({ claims: [Claims.LEASE_EDIT, Claims.LEASE_ADD] });
+
+        const addButton = getAllByText('Add a Period')[0];
+        await act(async () => {
+          userEvent.click(addButton);
+        });
+
+        expect(periodStartDateInput()).toHaveValue('');
       } finally {
         mockGetLeasePeriods.response = temp;
       }

diff --git a/source/frontend/src/features/leases/detail/LeasePages/payment/PeriodPaymentsContainer.tsx b/source/frontend/src/features/leases/detail/LeasePages/payment/PeriodPaymentsContainer.tsx
@@ -1,5 +1,6 @@
 import { FormikProps } from 'formik/dist/types';
 import { find, noop } from 'lodash';
+import moment from 'moment';
 import { useCallback, useContext, useEffect, useMemo, useState } from 'react';
 import { FaExclamationCircle, FaPlusCircle } from 'react-icons/fa';
 
@@ -57,6 +58,7 @@ export const PeriodPaymentsContainer: React.FunctionComponent<
     },
     [getLeasePeriodsFunc],
   );
+
   useDeepCompareEffect(() => {
     if (isValidId(leaseId)) {
       refreshLeasePeriods(leaseId);
@@ -145,11 +147,20 @@ export const PeriodPaymentsContainer: React.FunctionComponent<
           isAdditionalRentGstEligible: isReceivableLease ? true : false,
           isVariableRentGstEligible: isReceivableLease ? true : false,
         };
+
+        if (getLeasePeriods?.response?.length > 0) {
+          const lastPeriod = getLeasePeriods?.response.slice(-1)[0];
+          const startDate = isValidIsoDateTime(lastPeriod.expiryDate)
+            ? moment(lastPeriod.expiryDate).add(1, 'days')
+            : '';
+
+          values.startDate = startDate ? startDate.toISOString() : '';
+        }
       }
 
       setEditModalValues(values);
     },
-    [getLeasePeriods?.response?.length, lease?.paymentReceivableType?.id, lease.startDate],
+    [getLeasePeriods?.response, lease?.paymentReceivableType?.id, lease.startDate],
   );
 
   const onEditPayment = useCallback((values: FormLeasePayment) => {
@@ -178,6 +189,7 @@ export const PeriodPaymentsContainer: React.FunctionComponent<
     ),
     [editModalValues, formikRef, onSavePeriod, lease],
   );
+
   useEffect(() => {
     if (editModalValues) {
       setModalContent({