diff --git a/apps/admin-x-settings/src/components/settings/growth/offers/AddOfferModal.tsx b/apps/admin-x-settings/src/components/settings/growth/offers/AddOfferModal.tsx index bcddb5df8a..e42ef0cbb5 100644 --- a/apps/admin-x-settings/src/components/settings/growth/offers/AddOfferModal.tsx +++ b/apps/admin-x-settings/src/components/settings/growth/offers/AddOfferModal.tsx @@ -128,7 +128,6 @@ const Sidebar: React.FC = ({tierOptions, handleDurationInMonthsInput, handleAmountInput, handleCodeInput, - validate, clearError, errors, testId, @@ -170,7 +169,11 @@ const Sidebar: React.FC = ({tierOptions, maxLength={40} placeholder='Black Friday' title='Offer name' - onBlur={validate} + onBlur={(e) => { + if (!e.target.value && e.target.value.length === 0) { + errors.name = 'Name is required'; + } + }} onChange={(e) => { handleNameInput(e); setNameLength(e.target.value.length); @@ -183,7 +186,11 @@ const Sidebar: React.FC = ({tierOptions, placeholder='Black Friday Special' title='Display title' value={overrides.displayTitle.value} - onBlur={validate} + onBlur={(e) => { + if (!e.target.value && e.target.value.length === 0) { + errors.displayTitle = 'Display title is required'; + } + }} onChange={(e) => { handleDisplayTitleInput(e); }} @@ -232,7 +239,19 @@ const Sidebar: React.FC = ({tierOptions, ? (overrides.fixedAmount === 0 ? '' : overrides.fixedAmount?.toString()) : (overrides.percentAmount === 0 ? '' : overrides.percentAmount?.toString()) } - onBlur={validate} + onBlur={() => { + if (overrides.type === 'percent' && overrides.percentAmount === 0) { + errors.amount = 'Enter an amount greater than 0.'; + } + + if (overrides.type === 'percent' && overrides.percentAmount && (overrides.percentAmount < 0 || overrides.percentAmount >= 100)) { + errors.amount = 'Amount must be between 0 and 100%.'; + } + + if (overrides.type === 'fixed' && overrides.fixedAmount && overrides.fixedAmount <= 0) { + errors.amount = 'Enter an amount greater than 0.'; + } + }} onChange={(e) => { handleAmountInput(e); }} @@ -272,7 +291,11 @@ const Sidebar: React.FC = ({tierOptions, title='Trial duration' type='number' value={overrides.trialAmount?.toString()} - onBlur={validate} + onBlur={(e) => { + if (Number(e.target.value) < 1) { + errors.amount = 'Free trial must be at least 1 day.'; + } + }} onChange={(e) => { handleTrialAmountInput(e); }} @@ -286,7 +309,11 @@ const Sidebar: React.FC = ({tierOptions, placeholder='black-friday' title='Offer code' value={overrides.code.value} - onBlur={validate} + onBlur={(e) => { + if (!e.target.value && e.target.value.length === 0) { + errors.code = 'Code is required'; + } + }} onChange={(e) => { handleCodeInput(e); }} @@ -637,7 +664,7 @@ const AddOfferModal = () => { onCancel={cancelAddOffer} onOk={async () => { validate(); - const isErrorsEmpty = Object.keys(errors).length === 0; + const isErrorsEmpty = Object.values(errors).every(error => !error); if (!isErrorsEmpty) { showToast({ type: 'pageError',