src/views-components/rename-file-dialog/rename-file-dialog.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 { compose } from 'redux';
   7 import { reduxForm, InjectedFormProps, Field } from 'redux-form';
   8 import { withDialog, WithDialogProps } from '~/store/dialog/with-dialog';
   9 import { FormDialog } from '~/components/form-dialog/form-dialog';
  10 import { DialogContentText } from '@material-ui/core';
  11 import { TextField } from '~/components/text-field/text-field';
  12 import { RENAME_FILE_DIALOG, RenameFileDialogData, renameFile } from '~/store/collection-panel/collection-panel-files/collection-panel-files-actions';
  13 import { WarningCollection } from '~/components/warning-collection/warning-collection';
  14 import { RENAME_FILE_VALIDATION } from '~/validators/validators';
  15
  16 export const RenameFileDialog = compose(
  17     withDialog(RENAME_FILE_DIALOG),
  18     reduxForm({
  19         form: RENAME_FILE_DIALOG,
  20         onSubmit: (data: { path: string }, dispatch) => {
  21             dispatch<any>(renameFile(data.path));
  22         }
  23     })
  24 )((props: WithDialogProps<RenameFileDialogData> & InjectedFormProps<{ name: string, path: string }>) =>
  25     <FormDialog
  26         dialogTitle='Rename'
  27         formFields={RenameDialogFormFields}
  28         submitLabel='Ok'
  29         {...props}
  30     />);
  31
  32 const RenameDialogFormFields = (props: WithDialogProps<RenameFileDialogData>) => <>
  33     <DialogContentText>
  34         {`Please, enter a new name for ${props.data.name}`}
  35     </DialogContentText>
  36     <Field
  37         name='path'
  38         component={TextField}
  39         autoFocus={true}
  40         validate={RENAME_FILE_VALIDATION}
  41     />
  42     <WarningCollection text="Renaming a file will change the collection's content address." />
  43 </>;