22141: Refactoring to reduce circular import dependencies
[arvados.git] / services / workbench2 / 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 React from 'react';
6 import { reduxForm, InjectedFormProps } from 'redux-form';
7 import { CommandInputParameter, CWLType, IntCommandInputParameter, BooleanCommandInputParameter, FileCommandInputParameter, DirectoryCommandInputParameter, DirectoryArrayCommandInputParameter, FloatArrayCommandInputParameter, IntArrayCommandInputParameter } 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, WorkflowInputsData, EnumCommandInputParameter, isArrayOfType, StringArrayCommandInputParameter, FileArrayCommandInputParameter, getEnumType } 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 { CustomStyleRulesCallback } from 'common/custom-theme';
17 import { Grid } from '@mui/material';
18 import { WithStyles } from '@mui/styles';
19 import withStyles from '@mui/styles/withStyles';
20 import { EnumInput } from './inputs/enum-input';
21 import { DirectoryInput } from './inputs/directory-input';
22 import { StringArrayInput } from './inputs/string-array-input';
23 import { createStructuredSelector, createSelector } from 'reselect';
24 import { FileArrayInput } from './inputs/file-array-input';
25 import { DirectoryArrayInput } from './inputs/directory-array-input';
26 import { FloatArrayInput } from './inputs/float-array-input';
27 import { IntArrayInput } from './inputs/int-array-input';
28 import { RUN_PROCESS_INPUTS_FORM } from 'store/run-process-panel/run-process-panel-actions';
29
30 export interface RunProcessInputFormProps {
31     inputs: CommandInputParameter[];
32 }
33
34 const inputsSelector = (props: RunProcessInputFormProps) =>
35     props.inputs;
36
37 const initialValuesSelector = createSelector(
38     inputsSelector,
39     inputs => inputs.reduce(
40         (values, input) => ({ ...values, [input.id]: input.value || input.default }),
41         {}));
42
43 const propsSelector = createStructuredSelector({
44     initialValues: initialValuesSelector,
45 });
46
47 const mapStateToProps = (_: any, props: RunProcessInputFormProps) =>
48     propsSelector(props);
49
50 export const RunProcessInputsForm = compose(
51     connect(mapStateToProps),
52     reduxForm<WorkflowInputsData, RunProcessInputFormProps>({
53         form: RUN_PROCESS_INPUTS_FORM
54     }))(
55         (props: InjectedFormProps & RunProcessInputFormProps) =>
56             <form>
57                 <Grid container spacing={4}>
58                     {props.inputs.map(input =>
59                         <InputItem input={input} key={input.id} />)}
60                 </Grid>
61             </form>);
62
63 type CssRules = 'inputItem';
64
65 const styles: CustomStyleRulesCallback<CssRules> = theme => ({
66     inputItem: {
67         marginBottom: theme.spacing(2),
68     }
69 });
70
71 const InputItem = withStyles(styles)(
72     (props: WithStyles<CssRules> & { input: CommandInputParameter }) =>
73         <Grid item xs={12} md={6} className={props.classes.inputItem}>
74             {getInputComponent(props.input)}
75         </Grid>);
76
77 const getInputComponent = (input: CommandInputParameter) => {
78     switch (true) {
79         case isPrimitiveOfType(input, CWLType.BOOLEAN):
80             return <BooleanInput input={input as BooleanCommandInputParameter} />;
81
82         case isPrimitiveOfType(input, CWLType.INT):
83         case isPrimitiveOfType(input, CWLType.LONG):
84             return <IntInput input={input as IntCommandInputParameter} />;
85
86         case isPrimitiveOfType(input, CWLType.FLOAT):
87         case isPrimitiveOfType(input, CWLType.DOUBLE):
88             return <FloatInput input={input as FloatCommandInputParameter} />;
89
90         case isPrimitiveOfType(input, CWLType.STRING):
91             return <StringInput input={input as StringCommandInputParameter} />;
92
93         case isPrimitiveOfType(input, CWLType.FILE):
94             return <FileInput options={{ showOnlyOwned: false, showOnlyWritable: false }} input={input as FileCommandInputParameter} />;
95
96         case isPrimitiveOfType(input, CWLType.DIRECTORY):
97             return <DirectoryInput options={{ showOnlyOwned: false, showOnlyWritable: false }} input={input as DirectoryCommandInputParameter} />;
98
99         case getEnumType(input) !== null:
100             return <EnumInput input={input as EnumCommandInputParameter} />;
101
102         case isArrayOfType(input, CWLType.STRING):
103             return <StringArrayInput input={input as StringArrayCommandInputParameter} />;
104
105         case isArrayOfType(input, CWLType.INT):
106         case isArrayOfType(input, CWLType.LONG):
107             return <IntArrayInput input={input as IntArrayCommandInputParameter} />;
108
109         case isArrayOfType(input, CWLType.FLOAT):
110         case isArrayOfType(input, CWLType.DOUBLE):
111             return <FloatArrayInput input={input as FloatArrayCommandInputParameter} />;
112
113         case isArrayOfType(input, CWLType.FILE):
114             return <FileArrayInput options={{ showOnlyOwned: false, showOnlyWritable: false }} input={input as FileArrayCommandInputParameter} />;
115
116         case isArrayOfType(input, CWLType.DIRECTORY):
117             return <DirectoryArrayInput options={{ showOnlyOwned: false, showOnlyWritable: false }} input={input as DirectoryArrayCommandInputParameter} />;
118
119         default:
120             return null;
121     }
122 };