18874: Merge commit '6f8dcb2b13f3058db656908fb26b09e23b527f08' into 18874-merge-wb2
[arvados.git] / services / workbench2 / src / views-components / virtual-machines-dialog / add-login-dialog.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 { compose } from "redux";
7 import { reduxForm, InjectedFormProps, Field, GenericField } from 'redux-form';
8 import { withDialog, WithDialogProps } from "store/dialog/with-dialog";
9 import { FormDialog } from 'components/form-dialog/form-dialog';
10 import { VIRTUAL_MACHINE_ADD_LOGIN_DIALOG, VIRTUAL_MACHINE_ADD_LOGIN_FORM, addUpdateVirtualMachineLogin, AddLoginFormData, VIRTUAL_MACHINE_ADD_LOGIN_USER_FIELD, VIRTUAL_MACHINE_ADD_LOGIN_GROUPS_FIELD } from 'store/virtual-machines/virtual-machines-actions';
11 import { ParticipantSelect } from 'views-components/sharing-dialog/participant-select';
12 import { GroupArrayInput, GroupArrayDataProps } from 'views-components/virtual-machines-dialog/group-array-input';
13
14 export const VirtualMachineAddLoginDialog = compose(
15     withDialog(VIRTUAL_MACHINE_ADD_LOGIN_DIALOG),
16     reduxForm<AddLoginFormData>({
17         form: VIRTUAL_MACHINE_ADD_LOGIN_FORM,
18         onSubmit: (data, dispatch) => {
19             dispatch(addUpdateVirtualMachineLogin(data));
20         }
21     })
22 )(
23     (props: CreateGroupDialogComponentProps) => {
24         const [hasPartialGroupInput, setPartialGroupInput] = React.useState<boolean>(false);
25
26         return <FormDialog
27             dialogTitle={props.data.updating ? "Update login permission" : "Add login permission"}
28             formFields={AddLoginFormFields}
29             submitLabel={props.data.updating ? "Update" : "Add"}
30             {...props}
31             data={{
32                 ...props.data,
33                 setPartialGroupInput,
34                 hasPartialGroupInput,
35             }}
36             invalid={props.invalid || hasPartialGroupInput}
37         />;
38     }
39 );
40
41 type CreateGroupDialogComponentProps = WithDialogProps<{updating: boolean}> & GroupArrayDataProps & InjectedFormProps<AddLoginFormData>;
42
43 const AddLoginFormFields = (props) => {
44     return <>
45         <ParticipantField
46             name={VIRTUAL_MACHINE_ADD_LOGIN_USER_FIELD}
47             component={props.data.updating ? ReadOnlyUserSelect : UserSelect}
48             excludedParticipants={props.data.excludedParticipants}
49         />
50         <GroupArrayInput
51             name={VIRTUAL_MACHINE_ADD_LOGIN_GROUPS_FIELD}
52             input={{id:"Add groups to VM login (eg: docker, sudo)", disabled:false}}
53             required={false}
54             setPartialGroupInput={props.data.setPartialGroupInput}
55             hasPartialGroupInput={props.data.hasPartialGroupInput}
56         />
57     </>;
58 }
59
60 interface UserFieldProps {
61     excludedParticipants: string[];
62 }
63
64 const ParticipantField = Field as new () => GenericField<UserFieldProps>;
65
66 const UserSelect = (props) =>
67     <ParticipantSelect
68         onlyPeople
69         onlyActive
70         label='Search for user to grant login permission'
71         items={props.input.value ? [props.input.value] : []}
72         excludedParticipants={props.excludedParticipants}
73         onSelect={props.input.onChange}
74         onDelete={() => (props.input.onChange(''))} />;
75
76 const ReadOnlyUserSelect = (props) =>
77         <ParticipantSelect
78             onlyPeople
79             onlyActive
80             label='User'
81             items={props.input.value ? [props.input.value] : []}
82             disabled={true} />;