diff --git a/source/frontend/src/components/common/form/Check.tsx b/source/frontend/src/components/common/form/Check.tsx index d3ac6a5355..1176956e79 100644 --- a/source/frontend/src/components/common/form/Check.tsx +++ b/source/frontend/src/components/common/form/Check.tsx @@ -43,6 +43,7 @@ type OptionalAttributes = { toolTip?: string; /** id for tooltip */ toolTipId?: string; + handleChange?: (field: string, value: boolean) => void; }; // only "field" is required for , the rest are optional @@ -67,6 +68,7 @@ export const Check: React.FC> = ({ radioLabelTwo, toolTip, toolTipId, + handleChange, ...rest }) => { const { values, initialValues, setFieldValue, setFieldTouched, errors, touched, handleBlur } = @@ -113,8 +115,10 @@ export const Check: React.FC> = ({ onChange={() => { if (type !== 'radio') { setFieldValue(field, !checked); + handleChange && handleChange(field, !checked); } else { setFieldValue(field, true); + handleChange && handleChange(field, true); } }} onBlur={handleBlur} @@ -137,6 +141,7 @@ export const Check: React.FC> = ({ checked={checked === false} onChange={() => { setFieldValue(field, false); + handleChange && handleChange(field, false); }} onBlur={handleBlur} /> diff --git a/source/frontend/src/features/leases/detail/LeasePages/payment/PeriodPaymentsContainer.tsx b/source/frontend/src/features/leases/detail/LeasePages/payment/PeriodPaymentsContainer.tsx index ebca956575..c472947f7b 100644 --- a/source/frontend/src/features/leases/detail/LeasePages/payment/PeriodPaymentsContainer.tsx +++ b/source/frontend/src/features/leases/detail/LeasePages/payment/PeriodPaymentsContainer.tsx @@ -46,7 +46,6 @@ export const PeriodPaymentsContainer: React.FunctionComponent< const { updateLeasePayment, addLeasePayment } = useLeasePaymentRepository(); const { getSystemConstant } = useSystemConstants(); const gstConstant = getSystemConstant(SystemConstants.GST); - const gstDecimal = gstConstant !== undefined ? parseFloat(gstConstant.value) : undefined; const leaseId = lease?.id; const getLeasePeriodsFunc = getLeasePeriods.execute; @@ -86,8 +85,8 @@ export const PeriodPaymentsContainer: React.FunctionComponent< const onSavePeriod = useCallback( async (values: FormLeasePeriod) => { const updatedPeriod = isValidId(values.id) - ? await updateLeasePeriod.execute(FormLeasePeriod.toApi(values, gstDecimal)) - : await addLeasePeriod.execute(FormLeasePeriod.toApi(values, gstDecimal)); + ? await updateLeasePeriod.execute(FormLeasePeriod.toApi(values)) + : await addLeasePeriod.execute(FormLeasePeriod.toApi(values)); if (isValidId(updatedPeriod?.id) && isValidId(leaseId)) { await getLeasePeriods.execute(leaseId); @@ -96,15 +95,7 @@ export const PeriodPaymentsContainer: React.FunctionComponent< onSuccess(); } }, - [ - addLeasePeriod, - getLeasePeriods, - gstDecimal, - leaseId, - updateLeasePeriod, - onSuccess, - setDisplayModal, - ], + [addLeasePeriod, getLeasePeriods, leaseId, updateLeasePeriod, onSuccess, setDisplayModal], ); /** @@ -185,9 +176,10 @@ export const PeriodPaymentsContainer: React.FunctionComponent< initialValues={editModalValues} onSave={onSavePeriod} lease={lease} + gstConstant={gstConstant} /> ), - [editModalValues, formikRef, onSavePeriod, lease], + [formikRef, editModalValues, onSavePeriod, lease, gstConstant], ); useEffect(() => { diff --git a/source/frontend/src/features/leases/detail/LeasePages/payment/modal/period/PeriodForm.test.tsx b/source/frontend/src/features/leases/detail/LeasePages/payment/modal/period/PeriodForm.test.tsx index d5369d63e4..9229e21753 100644 --- a/source/frontend/src/features/leases/detail/LeasePages/payment/modal/period/PeriodForm.test.tsx +++ b/source/frontend/src/features/leases/detail/LeasePages/payment/modal/period/PeriodForm.test.tsx @@ -15,6 +15,7 @@ import { import { FormLeasePeriod, defaultFormLeasePeriod } from '../../models'; import PeriodForm, { IPeriodFormProps } from './PeriodForm'; import { createRef } from 'react'; +import { ISystemConstant } from '@/store/slices/systemConstants'; const history = createMemoryHistory(); const onSave = vi.fn(); @@ -32,6 +33,7 @@ describe('PeriodForm component', () => { formikRef={formikRef} initialValues={renderOptions?.initialValues ?? { ...defaultFormLeasePeriod }} lease={{} as any} + gstConstant={{ name: 'gstDecimal', value: '0.05' }} />, { ...renderOptions, diff --git a/source/frontend/src/features/leases/detail/LeasePages/payment/modal/period/PeriodForm.tsx b/source/frontend/src/features/leases/detail/LeasePages/payment/modal/period/PeriodForm.tsx index cbf99141a1..584733cd43 100644 --- a/source/frontend/src/features/leases/detail/LeasePages/payment/modal/period/PeriodForm.tsx +++ b/source/frontend/src/features/leases/detail/LeasePages/payment/modal/period/PeriodForm.tsx @@ -20,6 +20,9 @@ import * as API from '@/constants/API'; import { LeasePeriodStatusTypes } from '@/constants/leaseStatusTypes'; import useLookupCodeHelpers from '@/hooks/useLookupCodeHelpers'; import { ApiGen_Concepts_Lease } from '@/models/api/generated/ApiGen_Concepts_Lease'; +import { ISystemConstant } from '@/store/slices/systemConstants'; +import { NumberFieldValue } from '@/typings/NumberFieldValue'; +import { formatMoney, round } from '@/utils'; import { toTypeCodeNullable } from '@/utils/formUtils'; import { defaultFormLeasePeriod, FormLeasePeriod } from '../../models'; @@ -32,6 +35,7 @@ export interface IPeriodFormProps { onSave: (values: FormLeasePeriod) => void; initialValues?: FormLeasePeriod; lease: ApiGen_Concepts_Lease | undefined; + gstConstant: ISystemConstant; } /** @@ -44,6 +48,7 @@ export const PeriodForm: React.FunctionComponent { const [displayWarningModal, setDisplayWarningModal] = useState(false); const lookups = useLookupCodeHelpers(); @@ -64,6 +69,24 @@ export const PeriodForm: React.FunctionComponent, values: boolean) => { + if (values === true) { + const gstDecimal = gstConstant !== undefined ? parseFloat(gstConstant.value) : 5; + + const calculated = round((formikState.values.paymentAmount as number) * (gstDecimal / 100)); + formikState.setFieldValue('gstAmount', calculated); + } else { + formikState.setFieldValue('gstAmount', ''); + } + }; + + const calculateTotal = (amount: NumberFieldValue, gstAmount: NumberFieldValue): number => { + const total = Number(amount) + Number(gstAmount); + return isNaN(total) ? 0 : total; + }; + return ( <> @@ -148,7 +171,7 @@ export const PeriodForm: React.FunctionComponent @@ -168,9 +191,36 @@ export const PeriodForm: React.FunctionComponent onGstCheckChange(formikProps, value)} /> + {initialGstAmount !== formikProps.values.gstAmount && + formikProps.values.isGstEligible === false && ( + + You have selected to remove subject to GST. GST amount previously added + will be removed. + + )} + {formikProps.values.isGstEligible === true && ( + + + + + + )} + + {formatMoney( + calculateTotal( + formikProps.values.paymentAmount, + formikProps.values.gstAmount, + ), + )} +