// SPDX-License-Identifier: AGPL-3.0
import * as React from 'react';
-import { IntCommandInputParameter, getInputLabel } from '~/models/workflow';
+import { memoize } from 'lodash/fp';
+import { IntCommandInputParameter, isRequiredInput } from '~/models/workflow';
import { Field } from 'redux-form';
-import { TextField } from '~/components/text-field/text-field';
import { isInteger } from '~/validators/is-integer';
+import { GenericInputProps, GenericInput } from '~/views/run-process-panel/inputs/generic-input';
+import { IntInput as IntInputComponent } from '~/components/int-input/int-input';
export interface IntInputProps {
input: IntCommandInputParameter;
export const IntInput = ({ input }: IntInputProps) =>
<Field
name={input.id}
- label={getInputLabel(input)}
- component={TextField}
- parse={value => parseInt(value, 10)}
- format={value => isNaN(value) ? '' : JSON.stringify(value)}
- validate={[isInteger]} />;
+ commandInput={input}
+ component={InputComponent}
+ parse={parse}
+ format={format}
+ validate={getValidation(input)} />;
+
+const parse = (value: any) => parseInt(value, 10);
+
+const format = (value: any) => isNaN(value) ? '' : JSON.stringify(value);
+
+const getValidation = memoize(
+ (input: IntCommandInputParameter) => ([
+ isRequiredInput(input)
+ ? isInteger
+ : () => undefined,
+ ]));
+
+const InputComponent = (props: GenericInputProps) =>
+ <GenericInput
+ component={Input}
+ {...props} />;
+
+
+const Input = (props: GenericInputProps) =>
+ <IntInputComponent
+ fullWidth
+ type='number'
+ error={props.meta.touched && !!props.meta.error}
+ disabled={props.commandInput.disabled}
+ {...props.input} />;