src/views-components/sharing-dialog/sharing-public-access-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 { Grid, StyleRulesCallback, Divider, Typography } from '@material-ui/core';
   7 import { Field, WrappedFieldProps } from 'redux-form';
   8 import { WithStyles } from '@material-ui/core/styles';
   9 import withStyles from '@material-ui/core/styles/withStyles';
  10 import { VisibilityLevelSelect } from './visibility-level-select';
  11 import { VisibilityLevel } from '~/store/sharing-dialog/sharing-dialog-types';
  12
  13 const sharingPublicAccessStyles: StyleRulesCallback<'root'> = theme => ({
  14     root: {
  15         padding: `${theme.spacing.unit * 2}px 0`,
  16     }
  17 });
  18
  19 const SharingPublicAccessForm = withStyles(sharingPublicAccessStyles)(
  20     ({ classes, visibility }: WithStyles<'root'> & { visibility: VisibilityLevel }) =>
  21         <>
  22             <Divider />
  23             <Grid container alignItems='center' spacing={8} className={classes.root}>
  24                 <Grid item xs={8}>
  25                     <Typography variant='subheading'>
  26                         {renderVisibilityInfo(visibility)}
  27                     </Typography>
  28                 </Grid>
  29                 <Grid item xs={4} container wrap='nowrap'>
  30                     <Field name='visibility' component={VisibilityLevelSelectComponent} />
  31                 </Grid>
  32             </Grid>
  33         </>
  34 );
  35
  36 const renderVisibilityInfo = (visibility: VisibilityLevel) => {
  37     switch (visibility) {
  38         case VisibilityLevel.PUBLIC:
  39             return 'Anyone can access';
  40         case VisibilityLevel.SHARED:
  41             return 'Specific people can access';
  42         case VisibilityLevel.PRIVATE:
  43             return 'Only you can access';
  44         default:
  45             return '';
  46     }
  47 };
  48
  49 export default ({ visibility }: { visibility: VisibilityLevel }) =>
  50     <SharingPublicAccessForm {...{ visibility }} />;
  51
  52 const VisibilityLevelSelectComponent = ({ input }: WrappedFieldProps) =>
  53     <VisibilityLevelSelect fullWidth disableUnderline {...input} />;