Disable run process button if advanced form is invalid
[arvados-workbench2.git] / src / views / run-process-panel / run-process-advanced-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 { ExpansionPanel, ExpansionPanelDetails, ExpansionPanelSummary } from '@material-ui/core';
7 import { reduxForm, Field } from 'redux-form';
8 import { Grid } from '@material-ui/core';
9 import { TextField } from '~/components/text-field/text-field';
10 import { ExpandIcon } from '~/components/icon/icon';
11 import * as IntInput from './inputs/int-input';
12 import { require } from '~/validators/require';
13 import { min } from '~/validators/min';
14 import { optional } from '~/validators/optional';
15
16 export const RUN_PROCESS_ADVANCED_FORM = 'runProcessAdvancedForm';
17
18 const OUTPUT_FIELD = 'output';
19 const RUNTIME_FIELD = 'runtime';
20 const RAM_FIELD = 'ram';
21 const VCPUS_FIELD = 'vcpus';
22 const KEEP_CACHE_RAM_FIELD = 'keepCacheRam';
23
24 export interface RunProcessAdvancedFormData {
25     [OUTPUT_FIELD]?: string;
26     [RUNTIME_FIELD]?: string;
27     [RAM_FIELD]: number;
28     [VCPUS_FIELD]: number;
29     [KEEP_CACHE_RAM_FIELD]?: number;
30 }
31
32 export const RunProcessAdvancedForm =
33     reduxForm<RunProcessAdvancedFormData>({
34         form: RUN_PROCESS_ADVANCED_FORM,
35         initialValues: {
36             [RAM_FIELD]: 1073741824,
37             [VCPUS_FIELD]: 1,
38         },
39     })(() =>
40         <form>
41             <ExpansionPanel elevation={0}>
42                 <ExpansionPanelSummary style={{ padding: 0 }} expandIcon={<ExpandIcon />}>
43                     Advanced
44                 </ExpansionPanelSummary>
45                 <ExpansionPanelDetails style={{ padding: 0 }}>
46                     <Grid container spacing={32}>
47                         <Grid item xs={12} md={6}>
48                             <Field
49                                 name={OUTPUT_FIELD}
50                                 component={TextField}
51                                 label="Output name" />
52                         </Grid>
53                         <Grid item xs={12} md={6}>
54                             <Field
55                                 name={RUNTIME_FIELD}
56                                 component={TextField}
57                                 label="Runtime limit (hh)" />
58                         </Grid>
59                         <Grid item xs={12} md={6}>
60                             <Field
61                                 name={RAM_FIELD}
62                                 component={TextField}
63                                 label="RAM"
64                                 helperText="Number of ram bytes to be used to run this process."
65                                 parse={IntInput.parse}
66                                 format={IntInput.format}
67                                 type='number'
68                                 required
69                                 validate={ramValidation} />
70                         </Grid>
71                         <Grid item xs={12} md={6}>
72                             <Field
73                                 name={VCPUS_FIELD}
74                                 component={TextField}
75                                 label="VCPUs"
76                                 helperText="Number of cores to be used to run this process."
77                                 parse={IntInput.parse}
78                                 format={IntInput.format}
79                                 type='number'
80                                 required
81                                 validate={vcpusValidation} />
82                         </Grid>
83                         <Grid item xs={12} md={6}>
84                             <Field
85                                 name={KEEP_CACHE_RAM_FIELD}
86                                 component={TextField}
87                                 label="Keep cache RAM"
88                                 helperText="Number of keep cache bytes to be used to run this process."
89                                 parse={IntInput.parse}
90                                 format={IntInput.format}
91                                 type='number'
92                                 validate={keepCacheRamValdation} />
93                         </Grid>
94                     </Grid>
95                 </ExpansionPanelDetails>
96             </ExpansionPanel>
97         </form >);
98
99 const ramValidation = [min(0)];
100 const vcpusValidation = [min(1)];
101 const keepCacheRamValdation = [optional(min(0))];