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

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