src/components/rename-dialog/rename-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 { InjectedFormProps, Field } from "redux-form";
   7 import { Dialog, DialogTitle, DialogContent, DialogActions, Button, DialogContentText, CircularProgress } from "@material-ui/core";
   8 import { WithDialogProps } from "~/store/dialog/with-dialog";
   9 import { TextField } from "../text-field/text-field";
  10
  11 export const RenameDialog = (props: WithDialogProps<string> & InjectedFormProps<{ name: string }>) =>
  12     <form>
  13         <Dialog open={props.open}>
  14             <DialogTitle>{`Rename`}</DialogTitle>
  15             <DialogContent>
  16                 <DialogContentText>
  17                     {`Please, enter a new name for ${props.data}`}
  18                 </DialogContentText>
  19                 <Field
  20                     name='name'
  21                     component={TextField}
  22                 />
  23             </DialogContent>
  24             <DialogActions>
  25                 <Button
  26                     variant='flat'
  27                     color='primary'
  28                     disabled={props.submitting}
  29                     onClick={props.closeDialog}>
  30                     Cancel
  31                     </Button>
  32                 <Button
  33                     variant='contained'
  34                     color='primary'
  35                     type='submit'
  36                     onClick={props.handleSubmit}
  37                     disabled={props.pristine || props.invalid || props.submitting}>
  38                     {props.submitting
  39                         ? <CircularProgress size={20} />
  40                         : 'Ok'}
  41                 </Button>
  42             </DialogActions>
  43         </Dialog>
  44     </form>;