diff --git a/frontend/packages/console-shared/src/components/formik-fields/NumberSpinnerField.tsx b/frontend/packages/console-shared/src/components/formik-fields/NumberSpinnerField.tsx index ae30ce97652..14c351e7710 100644 --- a/frontend/packages/console-shared/src/components/formik-fields/NumberSpinnerField.tsx +++ b/frontend/packages/console-shared/src/components/formik-fields/NumberSpinnerField.tsx @@ -8,7 +8,16 @@ import { RedExclamationCircleIcon } from '../status'; import { FieldProps } from './field-types'; import { getFieldId } from './field-utils'; -const NumberSpinnerField: React.FC = ({ label, helpText, required, ...props }) => { +interface NumberSpinnerFieldProps extends FieldProps { + setOutputAsIntegerFlag?: boolean; +} + +const NumberSpinnerField: React.FC = ({ + label, + helpText, + required, + ...props +}) => { const [field, { touched, error }] = useField(props.name); const { setFieldValue, setFieldTouched } = useFormikContext(); const fieldId = getFieldId(props.name, 'number-spinner'); @@ -20,9 +29,14 @@ const NumberSpinnerField: React.FC = ({ label, helpText, required, . const handleChange: React.ReactEventHandler = React.useCallback( (event) => { field.onChange(event); - setFieldValue(props.name, event.currentTarget.value); + setFieldValue( + props.name, + props?.setOutputAsIntegerFlag + ? _.toInteger(event.currentTarget.value) + : event.currentTarget.value, + ); }, - [field, props.name, setFieldValue], + [field, props.name, setFieldValue, props?.setOutputAsIntegerFlag], ); return ( diff --git a/frontend/packages/dev-console/src/components/import/advanced/ScalingSection.tsx b/frontend/packages/dev-console/src/components/import/advanced/ScalingSection.tsx index 14a4d350704..c0bfe7ba93d 100644 --- a/frontend/packages/dev-console/src/components/import/advanced/ScalingSection.tsx +++ b/frontend/packages/dev-console/src/components/import/advanced/ScalingSection.tsx @@ -15,6 +15,7 @@ const ScalingSection: React.FC<{ name: string }> = ({ name }) => { name={name} label={t('devconsole~Replicas')} helpText={t('devconsole~The number of instances of your Image.')} + setOutputAsIntegerFlag /> );