From 87e36f8d6f2a825ecfdece6aaf8ec92df5355354 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Emilia=20M=C3=A4kel=C3=A4?= Date: Mon, 3 Jun 2024 12:16:20 +0300 Subject: [PATCH] feat: confirmation modal and additional state checks for alteration handler (#3061) (HL-1251, HL-1252, HL-1328) --- .../alteration/AlterationDeleteModal.tsx | 4 +- .../handler/public/locales/en/common.json | 27 ++- .../handler/public/locales/fi/common.json | 27 ++- .../handler/public/locales/sv/common.json | 27 ++- .../AlterationCalculator.tsx | 80 +++---- .../alterationHandling/AlterationHandling.tsx | 13 +- .../AlterationHandlingConfirmationModal.tsx | 82 ++++++++ .../AlterationHandlingForm.tsx | 195 +++++++++--------- .../alterationHandling/AlterationSummary.tsx | 87 ++++++++ .../useAlterationHandlingForm.ts | 27 +-- .../alterationHandling/utils/validation.ts | 38 ++-- .../handlingView/AlterationCancelModal.tsx | 36 ++-- .../handlingView/AlterationDeleteModal.tsx | 17 +- frontend/benefit/handler/src/constants.ts | 2 + .../handler/src/types/application.d.ts | 7 + frontend/benefit/shared/src/constants.ts | 1 + 16 files changed, 459 insertions(+), 211 deletions(-) create mode 100644 frontend/benefit/handler/src/components/alterationHandling/AlterationHandlingConfirmationModal.tsx create mode 100644 frontend/benefit/handler/src/components/alterationHandling/AlterationSummary.tsx diff --git a/frontend/benefit/applicant/src/components/applications/alteration/AlterationDeleteModal.tsx b/frontend/benefit/applicant/src/components/applications/alteration/AlterationDeleteModal.tsx index ca7c6b5a0d..393000d1b2 100644 --- a/frontend/benefit/applicant/src/components/applications/alteration/AlterationDeleteModal.tsx +++ b/frontend/benefit/applicant/src/components/applications/alteration/AlterationDeleteModal.tsx @@ -36,8 +36,8 @@ const AlterationDeleteModal = ({ : 'Suspension' }` )} - submitButtonLabel={t(`common.save`)} - cancelButtonLabel={t(`common.backWithoutBack`)} + submitButtonLabel="" + cancelButtonLabel="" handleToggle={null} handleSubmit={noop} headerIcon={} diff --git a/frontend/benefit/handler/public/locales/en/common.json b/frontend/benefit/handler/public/locales/en/common.json index 56b91659a7..582fc7a8df 100644 --- a/frontend/benefit/handler/public/locales/en/common.json +++ b/frontend/benefit/handler/public/locales/en/common.json @@ -100,8 +100,14 @@ "message": "Poistit hakemuksen {{applicationNumber}} muutosilmoituksen." }, "alterationHandled": { - "label": "Muutosilmoitus on käsitelty", - "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ja merkitsit takaisinlaskupyynnön lähetetyksi Talpaan. " + "recoverable": { + "label": "Muutosilmoitus on käsitelty", + "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ja merkitsit takaisinlaskutuspyynnön lähetetyksi Talpaan." + }, + "nonrecoverable": { + "label": "Muutosilmoitus on käsitelty", + "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ilman takaisinlaskutusta." + } } }, "mainIngress": { @@ -937,7 +943,12 @@ "label": "Laskutetaanko ylimääräinen tuki takaisin?", "hintText": "Tukea laskutetaan aina takaisin, jos takaisinlaskutettavan tuen määrä on yli 20 euroa.", "yes": "Ylimääräinen tuki laskutetaan takaisin", - "no": "Ylimääräistä tukea ei laskuteta" + "no": "Ylimääräistä tukea ei laskuteta", + "limitWarning": { + "heading": "Oletko varma, ettei tukea laskuteta takaisin?", + "body": "Takaisinlaskutettava tuki on yli {{limit}} euroa." + }, + "emptyRecovery": "Takaisinlaskutus ei ole mahdollista, kun takaisinlaskutettavan tuen määrä on nolla euroa" }, "recoveryJustification": { "label": "Selite" @@ -946,6 +957,16 @@ "label": "Perustelu" } }, + "confirmation": { + "recoverable": { + "title": "Olet merkitsemässä laskutustiedot lähetetyksi Talpaan", + "description": "Helsinki-lisän ylimääräinen osuus laskutetaan takaisin ajalta {{startDate}}–{{endDate}}, yhteensä {{amount}}." + }, + "nonrecoverable": { + "title": "Olet merkitsemässä muutosilmoituksen käsitellyksi. Haluatko jatkaa?", + "description": "Ylimääräistä tukea ei laskuteta takaisin." + } + }, "error": { "alterationNotFound": "Valittua muutosilmoitusta ei löytynyt!", "alreadyHandled": "Valittu muutosilmoitus on jo käsitelty!", diff --git a/frontend/benefit/handler/public/locales/fi/common.json b/frontend/benefit/handler/public/locales/fi/common.json index 31c8a1bc2e..9d191728f9 100644 --- a/frontend/benefit/handler/public/locales/fi/common.json +++ b/frontend/benefit/handler/public/locales/fi/common.json @@ -100,8 +100,14 @@ "message": "Poistit hakemuksen {{applicationNumber}} muutosilmoituksen." }, "alterationHandled": { - "label": "Muutosilmoitus on käsitelty", - "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ja merkitsit takaisinlaskupyynnön lähetetyksi Talpaan. " + "recoverable": { + "label": "Muutosilmoitus on käsitelty", + "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ja merkitsit takaisinlaskutuspyynnön lähetetyksi Talpaan." + }, + "nonrecoverable": { + "label": "Muutosilmoitus on käsitelty", + "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ilman takaisinlaskutusta." + } } }, "mainIngress": { @@ -937,7 +943,12 @@ "label": "Laskutetaanko ylimääräinen tuki takaisin?", "hintText": "Tukea laskutetaan aina takaisin, jos takaisinlaskutettavan tuen määrä on yli 20 euroa.", "yes": "Ylimääräinen tuki laskutetaan takaisin", - "no": "Ylimääräistä tukea ei laskuteta" + "no": "Ylimääräistä tukea ei laskuteta", + "limitWarning": { + "heading": "Oletko varma, ettei tukea laskuteta takaisin?", + "body": "Takaisinlaskutettava tuki on yli {{limit}} euroa." + }, + "emptyRecovery": "Takaisinlaskutus ei ole mahdollista, kun takaisinlaskutettavan tuen määrä on nolla euroa" }, "recoveryJustification": { "label": "Selite" @@ -946,6 +957,16 @@ "label": "Perustelu" } }, + "confirmation": { + "recoverable": { + "title": "Olet merkitsemässä laskutustiedot lähetetyksi Talpaan", + "description": "Helsinki-lisän ylimääräinen osuus laskutetaan takaisin ajalta {{startDate}}–{{endDate}}, yhteensä {{amount}}." + }, + "nonrecoverable": { + "title": "Olet merkitsemässä muutosilmoituksen käsitellyksi. Haluatko jatkaa?", + "description": "Ylimääräistä tukea ei laskuteta takaisin." + } + }, "error": { "alterationNotFound": "Valittua muutosilmoitusta ei löytynyt!", "alreadyHandled": "Valittu muutosilmoitus on jo käsitelty!", diff --git a/frontend/benefit/handler/public/locales/sv/common.json b/frontend/benefit/handler/public/locales/sv/common.json index 56b91659a7..582fc7a8df 100644 --- a/frontend/benefit/handler/public/locales/sv/common.json +++ b/frontend/benefit/handler/public/locales/sv/common.json @@ -100,8 +100,14 @@ "message": "Poistit hakemuksen {{applicationNumber}} muutosilmoituksen." }, "alterationHandled": { - "label": "Muutosilmoitus on käsitelty", - "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ja merkitsit takaisinlaskupyynnön lähetetyksi Talpaan. " + "recoverable": { + "label": "Muutosilmoitus on käsitelty", + "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ja merkitsit takaisinlaskutuspyynnön lähetetyksi Talpaan." + }, + "nonrecoverable": { + "label": "Muutosilmoitus on käsitelty", + "message": "Käsittelit hakemuksen {{applicationNumber}} muutosilmoituksen ilman takaisinlaskutusta." + } } }, "mainIngress": { @@ -937,7 +943,12 @@ "label": "Laskutetaanko ylimääräinen tuki takaisin?", "hintText": "Tukea laskutetaan aina takaisin, jos takaisinlaskutettavan tuen määrä on yli 20 euroa.", "yes": "Ylimääräinen tuki laskutetaan takaisin", - "no": "Ylimääräistä tukea ei laskuteta" + "no": "Ylimääräistä tukea ei laskuteta", + "limitWarning": { + "heading": "Oletko varma, ettei tukea laskuteta takaisin?", + "body": "Takaisinlaskutettava tuki on yli {{limit}} euroa." + }, + "emptyRecovery": "Takaisinlaskutus ei ole mahdollista, kun takaisinlaskutettavan tuen määrä on nolla euroa" }, "recoveryJustification": { "label": "Selite" @@ -946,6 +957,16 @@ "label": "Perustelu" } }, + "confirmation": { + "recoverable": { + "title": "Olet merkitsemässä laskutustiedot lähetetyksi Talpaan", + "description": "Helsinki-lisän ylimääräinen osuus laskutetaan takaisin ajalta {{startDate}}–{{endDate}}, yhteensä {{amount}}." + }, + "nonrecoverable": { + "title": "Olet merkitsemässä muutosilmoituksen käsitellyksi. Haluatko jatkaa?", + "description": "Ylimääräistä tukea ei laskuteta takaisin." + } + }, "error": { "alterationNotFound": "Valittua muutosilmoitusta ei löytynyt!", "alreadyHandled": "Valittu muutosilmoitus on jo käsitelty!", diff --git a/frontend/benefit/handler/src/components/alterationHandling/AlterationCalculator.tsx b/frontend/benefit/handler/src/components/alterationHandling/AlterationCalculator.tsx index ed76a2e636..d295682049 100644 --- a/frontend/benefit/handler/src/components/alterationHandling/AlterationCalculator.tsx +++ b/frontend/benefit/handler/src/components/alterationHandling/AlterationCalculator.tsx @@ -11,11 +11,9 @@ import { $TabButton } from 'benefit/handler/components/applicationReview/Applica import CalculationTable from 'benefit/handler/components/applicationReview/calculationTable/CalculationTable'; import useCalculationTable from 'benefit/handler/components/applicationReview/calculationTable/useCalculationTable'; import SalaryCalculatorHighlight from 'benefit/handler/components/applicationReview/salaryBenefitCalculatorView/SalaryCalculatorResults/SalaryCalculatorHighlight'; +import { ApplicationAlterationHandlingForm } from 'benefit/handler/types/application'; import { ALTERATION_STATE } from 'benefit-shared/constants'; -import { - Application, - ApplicationAlteration, -} from 'benefit-shared/types/application'; +import { Application } from 'benefit-shared/types/application'; import { areIntervalsOverlapping, max, min } from 'date-fns'; import { FormikProps } from 'formik'; import { @@ -44,17 +42,12 @@ import { } from 'shared/utils/string.utils'; type Props = { - formik: FormikProps>; + formik: FormikProps; application: Application; getErrorMessage: (fieldName: string) => string | undefined; onCalculationChange: (outOfDate: boolean) => void; }; -type CalculationResult = { - amount: string; - description: string; -}; - const AlterationCalculator = ({ formik, application, @@ -68,13 +61,13 @@ const AlterationCalculator = ({ const translationBase = 'common:applications.alterations.handling'; - const [calculationResult, setCalculationResult] = - useState(null); + const [calculationDescription, setCalculationDescription] = useState< + string | null + >(null); const [calculationOutOfDate, setCalculationOutOfDate] = useState(false); const [calculationRangeValid, setCalculationRangeValid] = useState(true); - const [isManual, setManual] = useState(false); const applicationStartDate = new Date(application.startDate); const applicationEndDate = new Date(application.endDate); @@ -116,7 +109,8 @@ const AlterationCalculator = ({ setCalculationRangeValid(true); if (startDate > endDate) { - setCalculationResult(null); + formik.setFieldValue('recoveryAmount', '0'); + setCalculationDescription(null); return; } @@ -127,15 +121,17 @@ const AlterationCalculator = ({ }) ) { setCalculationRangeValid(false); - setCalculationResult(null); + formik.setFieldValue('recoveryAmount', '0'); + setCalculationDescription(null); setCalculationOutOfDate(false); return; } let total: number; - if (isManual) { - total = getNumberValue(formik.values?.recoveryAmount || 0); + // eslint-disable-next-line unicorn/prefer-ternary + if (formik.values.isManual) { + total = getNumberValue(formik.values?.manualRecoveryAmount || 0); } else { total = tableRows.reduce((sum, row) => { if (!row.startDate || !row.endDate) { @@ -169,17 +165,16 @@ const AlterationCalculator = ({ return sum + amountOverOverlapPeriod; }, 0); - formik.setFieldValue('recoveryAmount', total.toFixed(2)); } - setCalculationResult({ - amount: total.toFixed(2), - description: t(`${translationBase}.calculation.resultDescription`, { + formik.setFieldValue('recoveryAmount', total.toFixed(2)); + setCalculationDescription( + t(`${translationBase}.calculation.resultDescription`, { months: diffMonths(endDate, startDate), startDate: formik.values.recoveryStartDate, endDate: formik.values.recoveryEndDate, - }), - }); + }) + ); setCalculationOutOfDate(false); onCalculationChange(false); }; @@ -193,13 +188,14 @@ const AlterationCalculator = ({ }; const selectTab = (manualTab: boolean): void => { - setManual(manualTab); + formik.setFieldValue('isManual', manualTab); setCalculationOutOfDate(true); onCalculationChange(true); }; const showRangeError = !calculationOutOfDate && !calculationRangeValid; - const showOutdatedError = calculationOutOfDate && calculationResult !== null; + const showOutdatedError = + calculationOutOfDate && calculationDescription !== null; return (
@@ -214,10 +210,16 @@ const AlterationCalculator = ({ <$Calculation> <$Grid> <$GridCell $colSpan={4}> - <$TabButton active={!isManual} onClick={() => selectTab(false)}> + <$TabButton + active={!formik.values.isManual} + onClick={() => selectTab(false)} + > {t(`${translationBase}.calculation.tabs.calculator`)} - <$TabButton active={isManual} onClick={() => selectTab(true)}> + <$TabButton + active={formik.values.isManual} + onClick={() => selectTab(true)} + > {t(`${translationBase}.calculation.tabs.manual`)} @@ -276,23 +278,25 @@ const AlterationCalculator = ({ <$GridCell $colSpan={6} /> - {isManual && ( + {formik.values.isManual && ( <> <$GridCell $colSpan={3}> - handleChange('recoveryAmount')( + handleChange('manualRecoveryAmount')( stringFloatToFixed(e.target.value) ) } - value={formatStringFloatValue(formik.values.recoveryAmount)} - invalid={!!getErrorMessage('recoveryAmount')} - aria-invalid={!!getErrorMessage('recoveryAmount')} - errorText={getErrorMessage('recoveryAmount')} + value={formatStringFloatValue( + formik.values.manualRecoveryAmount + )} + invalid={!!getErrorMessage('manualRecoveryAmount')} + aria-invalid={!!getErrorMessage('manualRecoveryAmount')} + errorText={getErrorMessage('manualRecoveryAmount')} required /> @@ -303,11 +307,11 @@ const AlterationCalculator = ({ - {calculationResult && ( + {calculationDescription && ( <$HighlightWrapper> )} diff --git a/frontend/benefit/handler/src/components/alterationHandling/AlterationHandling.tsx b/frontend/benefit/handler/src/components/alterationHandling/AlterationHandling.tsx index 091b208166..d1ee58df29 100644 --- a/frontend/benefit/handler/src/components/alterationHandling/AlterationHandling.tsx +++ b/frontend/benefit/handler/src/components/alterationHandling/AlterationHandling.tsx @@ -25,12 +25,15 @@ const AlterationHandling = (): JSX.Element => { const translationBase = 'common:applications.alterations.handling'; - const onSuccess = (): void => { + const onSuccess = (isRecoverable: boolean): void => { + const notificationTranslationBase = `common:notifications.alterationHandled.${ + isRecoverable ? 'recoverable' : 'nonrecoverable' + }`; hdsToast({ autoDismissTime: 0, type: 'success', - labelText: t('common:notifications.alterationHandled.label'), - text: t('common:notifications.alterationHandled.message', { + labelText: t(`${notificationTranslationBase}.label`), + text: t(`${notificationTranslationBase}.message`, { applicationNumber: application.applicationNumber, }), }); @@ -137,7 +140,9 @@ const AlterationHandling = (): JSX.Element => { alteration={alteration} onError={onError} onSuccess={onSuccess} - onClose={() => router.push(`${ROUTES.APPLICATION}?id=${application.id}`)} + onClose={() => + router.push(`${ROUTES.APPLICATION}?id=${application.id}`) + } /> ) : ( diff --git a/frontend/benefit/handler/src/components/alterationHandling/AlterationHandlingConfirmationModal.tsx b/frontend/benefit/handler/src/components/alterationHandling/AlterationHandlingConfirmationModal.tsx new file mode 100644 index 0000000000..3148430f88 --- /dev/null +++ b/frontend/benefit/handler/src/components/alterationHandling/AlterationHandlingConfirmationModal.tsx @@ -0,0 +1,82 @@ +import { ApplicationAlterationHandlingForm } from 'benefit/handler/types/application'; +import { Button, Dialog, IconInfoCircle } from 'hds-react'; +import noop from 'lodash/noop'; +import { useTranslation } from 'next-i18next'; +import React from 'react'; +import Modal from 'shared/components/modal/Modal'; +import theme from 'shared/styles/theme'; +import { formatFloatToCurrency } from 'shared/utils/string.utils'; + +type Props = { + onClose: () => void; + onSubmit: () => void; + isOpen: boolean; + isWorking: boolean; + values: ApplicationAlterationHandlingForm; +}; + +const AlterationHandlingConfirmationModal = ({ + onClose, + onSubmit, + isOpen, + values, + isWorking, +}: Props): JSX.Element => { + const { t } = useTranslation(); + + if (!values) { + return null; + } + + const translationBase = `common:applications.alterations.handling.confirmation.${ + values.isRecoverable ? 'recoverable' : 'nonrecoverable' + }`; + + return ( + } + customContent={ + <> + +

+ {t(`${translationBase}.description`, { + startDate: values.recoveryStartDate, + endDate: values.recoveryEndDate, + amount: formatFloatToCurrency(values.recoveryAmount), + })} +

+ + + + + + + } + /> + ); +}; + +export default AlterationHandlingConfirmationModal; diff --git a/frontend/benefit/handler/src/components/alterationHandling/AlterationHandlingForm.tsx b/frontend/benefit/handler/src/components/alterationHandling/AlterationHandlingForm.tsx index fdeb451f82..ce1894a598 100644 --- a/frontend/benefit/handler/src/components/alterationHandling/AlterationHandlingForm.tsx +++ b/frontend/benefit/handler/src/components/alterationHandling/AlterationHandlingForm.tsx @@ -1,17 +1,18 @@ import { AxiosError } from 'axios'; import AlterationCalculator from 'benefit/handler/components/alterationHandling/AlterationCalculator'; import { - $AlterationDetails, $PageHeading, $SaveActionFormErrorText, $StickyBarColumn, $StickyBarWrapper, $TalpaGuideText, } from 'benefit/handler/components/alterationHandling/AlterationHandling.sc'; +import AlterationHandlingConfirmationModal from 'benefit/handler/components/alterationHandling/AlterationHandlingConfirmationModal'; import AlterationHandlingSection from 'benefit/handler/components/alterationHandling/AlterationHandlingSection'; +import AlterationSummary from 'benefit/handler/components/alterationHandling/AlterationSummary'; import useAlterationHandlingForm from 'benefit/handler/components/alterationHandling/useAlterationHandlingForm'; +import { DEFAULT_MINIMUM_RECOVERY_AMOUNT } from 'benefit/handler/constants'; import { getErrorText } from 'benefit/handler/utils/forms'; -import { ALTERATION_TYPE } from 'benefit-shared/constants'; import { Application, ApplicationAlteration, @@ -21,6 +22,7 @@ import { IconAlertCircleFill, IconCheck, IconDownload, + Notification, RadioButton, SelectionGroup, TextArea, @@ -33,13 +35,13 @@ import { } from 'shared/components/forms/section/FormSection.sc'; import StickyActionBar from 'shared/components/stickyActionBar/StickyActionBar'; import { $StickyBarSpacing } from 'shared/components/stickyActionBar/StickyActionBar.sc'; -import { formatDate } from 'shared/utils/date.utils'; +import { getNumberValue } from 'shared/utils/string.utils'; type Props = { application: Application; alteration: ApplicationAlteration; onError: (error: AxiosError) => void; - onSuccess: () => void; + onSuccess: (isRecoverable: boolean) => void; onClose: () => void; }; @@ -50,24 +52,48 @@ const AlterationHandlingForm = ({ onSuccess, onClose, }: Props): JSX.Element => { - const { t, formik, isSubmitted, isSubmitting, handleAlteration } = - useAlterationHandlingForm({ - onError, - onSuccess, - application, - alteration, - }); + const { + t, + formik, + isSubmitted, + isSubmitting, + handleAlteration, + validateForm, + } = useAlterationHandlingForm({ + onError, + onSuccess, + application, + alteration, + }); const [isCalculationOutOfDate, setCalculationOutOfDate] = useState(true); + const [isConfirmationModalOpen, setConfirmationModalOpen] = + useState(false); + const getErrorMessage = (fieldName: string): string | undefined => getErrorText(formik.errors, formik.touched, fieldName, t, isSubmitted); + const openConfirmationModal = (): void => { + void validateForm().then((isValid) => { + if (isValid) { + setConfirmationModalOpen(true); + } + + return null; + }); + }; + + const translationBase = 'common:applications.alterations.handling'; + const hasErrors = Object.keys(formik.errors).length > 0 || isCalculationOutOfDate; - const translationBase = 'common:applications.alterations.handling'; + const isNonRecoverableOverLimit = + !formik.values.isRecoverable && + getNumberValue(formik.values.recoveryAmount) > + DEFAULT_MINIMUM_RECOVERY_AMOUNT; return ( <> @@ -79,73 +105,10 @@ const AlterationHandlingForm = ({ heading={t(`${translationBase}.headings.alterationData`)} withBottomHeadingBorder > - <$AlterationDetails> -
-
{t(`${translationBase}.summary.type.label`)}
-
- {t( - `${translationBase}.summary.type.${alteration.alterationType}` - )} -
-
-
-
{t(`${translationBase}.summary.endDate`)}
-
{formatDate(new Date(alteration.endDate))}
-
-
- {alteration.alterationType === ALTERATION_TYPE.SUSPENSION && ( - <> -
{t(`${translationBase}.summary.resumeDate`)}
-
{formatDate(new Date(alteration.resumeDate))}
- - )} -
-
-
-
{t(`${translationBase}.summary.contactPerson`)}
-
{alteration.contactPersonName}
-
- {alteration.useEinvoice ? ( - <> -
-
- {t(`${translationBase}.summary.einvoiceProviderName`)} -
-
{alteration.einvoiceProviderName}
-
-
-
- {t(`${translationBase}.summary.einvoiceProviderIdentifier`)} -
-
{alteration.einvoiceProviderIdentifier}
-
-
-
{t(`${translationBase}.summary.einvoiceAddress`)}
-
{alteration.einvoiceAddress}
-
- - ) : ( - <> -
-
{t(`${translationBase}.summary.billingAddress`)}
-
- {application.company.streetAddress},{' '} - {application.company.postcode} {application.company.city} -
-
-
-
- - )} -
-
- {alteration.alterationType === ALTERATION_TYPE.TERMINATION - ? t(`${translationBase}.summary.reasonTermination`) - : t(`${translationBase}.summary.reasonSuspension`)} -
-
{alteration.reason || '-'}
-
- + + <$GridCell $colSpan={6}> + {isNonRecoverableOverLimit && ( + + {t( + `${translationBase}.fields.isRecoverable.limitWarning.body`, + { + limit: DEFAULT_MINIMUM_RECOVERY_AMOUNT, + } + )} + + )} + @@ -234,26 +218,28 @@ const AlterationHandlingForm = ({ - - <$Grid> - <$GridCell $colSpan={12}> - {/* TODO: Talpa integration to be implemented in HL-887 */} - <$TalpaGuideText> - {t(`${translationBase}.talpaCsv.guideText`)} - - - - - + {formik.values.isRecoverable && ( + + <$Grid> + <$GridCell $colSpan={12}> + {/* TODO: Talpa integration to be implemented in HL-887 */} + <$TalpaGuideText> + {t(`${translationBase}.talpaCsv.guideText`)} + + + + + + )} <$StickyBarWrapper> @@ -278,7 +264,7 @@ const AlterationHandlingForm = ({ )}