Merge branch 'master'
[arvados.git] / src / views-components / sharing-dialog / sharing-invitation-form-component.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 { Field, WrappedFieldProps, FieldArray, WrappedFieldArrayProps } from 'redux-form';
7 import { Grid, FormControl, InputLabel } from '@material-ui/core';
8 import { PermissionSelect, parsePermissionLevel, formatPermissionLevel } from './permission-select';
9 import { PeopleSelect, Person } from './people-select';
10
11 export default () =>
12     <Grid container spacing={8}>
13         <Grid item xs={8}>
14             <InvitedPeopleField />
15         </Grid>
16         <Grid item xs={4}>
17             <PermissionSelectField />
18         </Grid>
19     </Grid>;
20
21 const InvitedPeopleField = () =>
22     <FieldArray
23         name='invitedPeople'
24         component={InvitedPeopleFieldComponent} />;
25
26
27 const InvitedPeopleFieldComponent = ({ fields }: WrappedFieldArrayProps<Person>) =>
28     <PeopleSelect
29         items={fields.getAll() || []}
30         onSelect={fields.push}
31         onDelete={fields.remove} />;
32
33 const PermissionSelectField = () =>
34     <Field
35         name='permissions'
36         component={PermissionSelectComponent}
37         format={formatPermissionLevel}
38         parse={parsePermissionLevel} />;
39
40 const PermissionSelectComponent = ({ input }: WrappedFieldProps) =>
41     <FormControl fullWidth>
42         <InputLabel>Authorization</InputLabel>
43         <PermissionSelect {...input} />
44     </FormControl>;