Merge branch '21764-project-picker-crash' into main. Closes #21764
[arvados.git] / services / workbench2 / src / views / run-process-panel / run-process-basic-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, Field } from 'redux-form';
7 import { Grid } from '@material-ui/core';
8 import { TextField } from 'components/text-field/text-field';
9 import { ProjectInput, ProjectCommandInputParameter } from 'views/run-process-panel/inputs/project-input';
10 import { PROCESS_NAME_VALIDATION } from 'validators/validators';
11 import { ProjectResource } from 'models/project';
12 import { UserResource } from 'models/user';
13
14 export const RUN_PROCESS_BASIC_FORM = 'runProcessBasicForm';
15
16 export interface RunProcessBasicFormData {
17     name: string;
18     description: string;
19     owner?: ProjectResource | UserResource;
20 }
21
22 export const RunProcessBasicForm =
23     reduxForm<RunProcessBasicFormData>({
24         form: RUN_PROCESS_BASIC_FORM
25     })(() =>
26         <form>
27             <Grid container spacing={32}>
28                 <Grid item xs={12} md={6}>
29                     <Field
30                         name='name'
31                         component={TextField as any}
32                         label="Name for this workflow run"
33                         required
34                         validate={PROCESS_NAME_VALIDATION} />
35                 </Grid>
36                 <Grid item xs={12} md={6}>
37                     <Field
38                         name='description'
39                         component={TextField as any}
40                         label="Optional description of this workflow run" />
41                 </Grid>
42                 <Grid item xs={12} md={6}>
43                     <ProjectInput required input={{
44                         id: "owner",
45                         label: "Project where the workflow will run"
46                     } as ProjectCommandInputParameter}
47                         options={{ showOnlyOwned: false, showOnlyWritable: true }} />
48                 </Grid>
49             </Grid>
50         </form>);