Removed onBlur error feedback on Tier detail modal (#19381)
Fixes [PROD-265](https://linear.app/tryghost/issue/PROD-265/remove-onblur-error-feedback-on-tier-detail-modal)
This commit is contained in:
parent
bb42faf694
commit
8d3f3d60f7
@ -37,7 +37,7 @@ const TierDetailModalContent: React.FC<{tier?: Tier}> = ({tier}) => {
|
||||
yearly_price: () => (formState.type !== 'free' ? validateCurrencyAmount(formState.yearly_price || 0, formState.currency, {allowZero: false}) : undefined)
|
||||
};
|
||||
|
||||
const {formState, saveState, updateForm, handleSave, errors, setErrors, clearError, okProps} = useForm<TierFormState>({
|
||||
const {formState, saveState, updateForm, handleSave, errors, clearError, okProps} = useForm<TierFormState>({
|
||||
initialState: {
|
||||
...(tier || {}),
|
||||
trial_days: tier?.trial_days?.toString() || '',
|
||||
@ -105,16 +105,6 @@ const TierDetailModalContent: React.FC<{tier?: Tier}> = ({tier}) => {
|
||||
onSaveError: handleError
|
||||
});
|
||||
|
||||
const validateField = (key: string) => {
|
||||
const error = validators[key as keyof Tier]?.();
|
||||
|
||||
if (error) {
|
||||
setErrors({...errors, [key]: error});
|
||||
} else {
|
||||
clearError(key);
|
||||
}
|
||||
};
|
||||
|
||||
const benefits = useSortableIndexedList({
|
||||
items: formState.benefits || [],
|
||||
setItems: newBenefits => updateForm(state => ({...state, benefits: newBenefits})),
|
||||
@ -227,8 +217,8 @@ const TierDetailModalContent: React.FC<{tier?: Tier}> = ({tier}) => {
|
||||
title='Name'
|
||||
value={formState.name || ''}
|
||||
autoFocus
|
||||
onBlur={() => validateField('name')}
|
||||
onChange={e => updateForm(state => ({...state, name: e.target.value}))}
|
||||
onKeyDown={() => clearError('name')}
|
||||
/>}
|
||||
<TextField
|
||||
autoComplete='off'
|
||||
@ -267,8 +257,8 @@ const TierDetailModalContent: React.FC<{tier?: Tier}> = ({tier}) => {
|
||||
title='Monthly price'
|
||||
valueInCents={formState.monthly_price || ''}
|
||||
hideTitle
|
||||
onBlur={() => validateField('monthly_price')}
|
||||
onChange={price => updateForm(state => ({...state, monthly_price: price}))}
|
||||
onKeyDown={() => clearError('monthly_price')}
|
||||
/>
|
||||
<CurrencyField
|
||||
error={Boolean(errors.yearly_price)}
|
||||
@ -278,8 +268,8 @@ const TierDetailModalContent: React.FC<{tier?: Tier}> = ({tier}) => {
|
||||
title='Yearly price'
|
||||
valueInCents={formState.yearly_price || ''}
|
||||
hideTitle
|
||||
onBlur={() => validateField('yearly_price')}
|
||||
onChange={price => updateForm(state => ({...state, yearly_price: price}))}
|
||||
onKeyDown={() => clearError('yearly_price')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user