src/views/run-process-panel/run-process-inputs-form.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 { reduxForm, InjectedFormProps } from 'redux-form';
   7 import { CommandInputParameter, CWLType, IntCommandInputParameter, BooleanCommandInputParameter, FileCommandInputParameter } from '~/models/workflow';
   8 import { IntInput } from '~/views/run-process-panel/inputs/int-input';
   9 import { StringInput } from '~/views/run-process-panel/inputs/string-input';
  10 import { StringCommandInputParameter, FloatCommandInputParameter, isPrimitiveOfType, File, Directory, WorkflowInputsData, EnumCommandInputParameter } from '../../models/workflow';
  11 import { FloatInput } from '~/views/run-process-panel/inputs/float-input';
  12 import { BooleanInput } from './inputs/boolean-input';
  13 import { FileInput } from './inputs/file-input';
  14 import { connect } from 'react-redux';
  15 import { compose } from 'redux';
  16 import { Grid, StyleRulesCallback, withStyles, WithStyles } from '@material-ui/core';
  17 import { EnumInput } from './inputs/enum-input';
  18
  19 export const RUN_PROCESS_INPUTS_FORM = 'runProcessInputsForm';
  20
  21 export interface RunProcessInputFormProps {
  22     inputs: CommandInputParameter[];
  23 }
  24
  25 export const RunProcessInputsForm = compose(
  26     connect((_: any, props: RunProcessInputFormProps) => ({
  27         initialValues: props.inputs.reduce(
  28             (values, input) => ({ ...values, [input.id]: input.default }),
  29             {}),
  30     })),
  31     reduxForm<WorkflowInputsData, RunProcessInputFormProps>({
  32         form: RUN_PROCESS_INPUTS_FORM
  33     }))(
  34         (props: InjectedFormProps & RunProcessInputFormProps) =>
  35             <form>
  36                 <Grid container spacing={32}>
  37                     {props.inputs.map(input =>
  38                         <InputItem input={input} key={input.id} />)}
  39                 </Grid>
  40             </form>);
  41
  42 type CssRules = 'inputItem';
  43
  44 const styles: StyleRulesCallback<CssRules> = theme => ({
  45     inputItem: {
  46         marginBottom: theme.spacing.unit * 2,
  47     }
  48 });
  49
  50 const InputItem = withStyles(styles)(
  51     (props: WithStyles<CssRules> & { input: CommandInputParameter }) =>
  52         <Grid item xs={12} md={6} className={props.classes.inputItem}>
  53             {getInputComponent(props.input)}
  54         </Grid>);
  55
  56 const getInputComponent = (input: CommandInputParameter) => {
  57     switch (true) {
  58         case isPrimitiveOfType(input, CWLType.BOOLEAN):
  59             return <BooleanInput input={input as BooleanCommandInputParameter} />;
  60
  61         case isPrimitiveOfType(input, CWLType.INT):
  62         case isPrimitiveOfType(input, CWLType.LONG):
  63             return <IntInput input={input as IntCommandInputParameter} />;
  64
  65         case isPrimitiveOfType(input, CWLType.FLOAT):
  66         case isPrimitiveOfType(input, CWLType.DOUBLE):
  67             return <FloatInput input={input as FloatCommandInputParameter} />;
  68
  69         case isPrimitiveOfType(input, CWLType.STRING):
  70             return <StringInput input={input as StringCommandInputParameter} />;
  71
  72         case isPrimitiveOfType(input, CWLType.FILE):
  73             return <FileInput input={input as FileCommandInputParameter} />;
  74
  75         case typeof input.type === 'object' &&
  76             !(input.type instanceof Array) &&
  77             input.type.type === 'enum':
  78             return <EnumInput input={input as EnumCommandInputParameter} />;
  79
  80         default:
  81             return null;
  82     }
  83 };