src/views/run-process-panel/inputs/int-input.tsx

   1 // Copyright (C) The Arvados Authors. All rights reserved.
   2 //
   3 // SPDX-License-Identifier: AGPL-3.0
   4
   5 import * as React from 'react';
   6 import { memoize } from 'lodash/fp';
   7 import { IntCommandInputParameter, isRequiredInput } from '~/models/workflow';
   8 import { Field } from 'redux-form';
   9 import { isInteger } from '~/validators/is-integer';
  10 import { GenericInputProps, GenericInput } from '~/views/run-process-panel/inputs/generic-input';
  11 import { IntInput as IntInputComponent } from '~/components/int-input/int-input';
  12
  13 export interface IntInputProps {
  14     input: IntCommandInputParameter;
  15 }
  16 export const IntInput = ({ input }: IntInputProps) =>
  17     <Field
  18         name={input.id}
  19         commandInput={input}
  20         component={InputComponent}
  21         parse={parse}
  22         format={format}
  23         validate={getValidation(input)} />;
  24
  25 const parse = (value: any) => parseInt(value, 10);
  26
  27 const format = (value: any) => isNaN(value) ? '' : JSON.stringify(value);
  28
  29 const getValidation = memoize(
  30     (input: IntCommandInputParameter) => ([
  31         isRequiredInput(input)
  32             ? isInteger
  33             : () => undefined,
  34     ]));
  35
  36 const InputComponent = (props: GenericInputProps) =>
  37     <GenericInput
  38         component={Input}
  39         {...props} />;
  40
  41
  42 const Input = (props: GenericInputProps) =>
  43     <IntInputComponent
  44         fullWidth
  45         type='number'
  46         error={props.meta.touched && !!props.meta.error}
  47         disabled={props.commandInput.disabled}
  48         {...props.input} />;
  49