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, WrappedFieldProps, Field } 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, addVirtualMachineLogin, 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 } 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(addVirtualMachineLogin(data));
  20         }
  21     })
  22 )(
  23     (props: CreateGroupDialogComponentProps) =>
  24         <FormDialog
  25             dialogTitle='Add login permissions'
  26             formFields={AddLoginFormFields}
  27             submitLabel='Add'
  28             {...props}
  29         />
  30 );
  31
  32 type CreateGroupDialogComponentProps = WithDialogProps<{}> & InjectedFormProps<AddLoginFormData>;
  33
  34 const AddLoginFormFields = () =>
  35     <>
  36         <UserField />
  37         <GroupArrayInput
  38             name={VIRTUAL_MACHINE_ADD_LOGIN_GROUPS_FIELD}
  39             input={{id:"Add groups to VM login", disabled:false}}
  40             required={false}
  41         />
  42     </>;
  43
  44 const UserField = () =>
  45     <Field
  46         name={VIRTUAL_MACHINE_ADD_LOGIN_USER_FIELD}
  47         component={UserSelect}
  48         />;
  49
  50 const UserSelect = ({ input, meta }: WrappedFieldProps) =>
  51     <ParticipantSelect
  52         onlyPeople
  53         label='Search for users to grant login permission'
  54         items={input.value ? [input.value] : []}
  55         onSelect={input.onChange}
  56         onDelete={() => (input.onChange(''))} />;