Paper,
Tabs,
Tab,
+ Checkbox,
+ FormControlLabel,
+ Typography,
} from '@material-ui/core';
import {
StyleRulesCallback,
} from 'models/resource';
import { SharingInvitationForm } from './sharing-invitation-form';
import { SharingManagementForm } from './sharing-management-form';
+import {
+ BasePicker,
+ Calendar,
+ MuiPickersUtilsProvider,
+ TimePickerView
+} from 'material-ui-pickers';
+import DateFnsUtils from "@date-io/date-fns";
+import moment from 'moment';
+import { SharingPublicAccessForm } from './sharing-public-access-form';
export interface SharingDialogDataProps {
open: boolean;
export interface SharingDialogActionProps {
onClose: () => void;
onSave: () => void;
- onCreateSharingToken: () => void;
+ onCreateSharingToken: (d: Date | undefined) => () => void;
refreshPermissions: () => void;
}
enum SharingDialogTab {
onClose, onSave, onCreateSharingToken, refreshPermissions } = props;
const showTabs = extractUuidObjectType(sharedResourceUuid) === ResourceObjectType.COLLECTION;
const [tabNr, setTabNr] = React.useState<number>(SharingDialogTab.PERMISSIONS);
+ const [expDate, setExpDate] = React.useState<Date>();
+ const [withExpiration, setWithExpiration] = React.useState<boolean>(false);
// Sets up the dialog depending on the resource type
if (!showTabs && tabNr !== SharingDialogTab.PERMISSIONS) {
setTabNr(SharingDialogTab.PERMISSIONS);
}
+ React.useEffect(() => {
+ if (!withExpiration) {
+ setExpDate(undefined);
+ } else {
+ setExpDate(moment().add(1, 'hour').toDate());
+ }
+ }, [withExpiration]);
+
return <Dialog
{...{ open, onClose }}
className="sharing-dialog"
<DialogContent>
{ tabNr === SharingDialogTab.PERMISSIONS &&
<Grid container direction='column' spacing={24}>
- <Grid item>
- <SharingManagementForm />
- </Grid>
+ <Grid item>
+ <SharingPublicAccessForm />
+ </Grid>
+ <Grid item>
+ <SharingManagementForm />
+ </Grid>
</Grid>
}
{ tabNr === SharingDialogTab.URLS &&
<Grid item md={12}>
<SharingInvitationForm />
</Grid> }
+ { tabNr === SharingDialogTab.URLS && withExpiration && <>
+ <Grid item container direction='row' md={12}>
+ <MuiPickersUtilsProvider utils={DateFnsUtils}>
+ <BasePicker autoOk value={expDate} onChange={setExpDate}>
+ {({ date, handleChange }) => (<>
+ <Grid item md={6}>
+ <Calendar date={date} minDate={new Date()} maxDate={undefined}
+ onChange={handleChange} />
+ </Grid>
+ <Grid item md={6}>
+ <TimePickerView type="hours" date={date} ampm={false}
+ onMinutesChange={() => {}}
+ onSecondsChange={() => {}}
+ onHourChange={handleChange}
+ />
+ </Grid>
+ </>)}
+ </BasePicker>
+ </MuiPickersUtilsProvider>
+ </Grid>
+ <Grid item md={12}>
+ <Typography variant='caption' align='center'>
+ Maximum expiration date may be limited by the cluster configuration.
+ </Typography>
+ </Grid>
+ </> }
<Grid item xs />
- { tabNr === SharingDialogTab.URLS &&
+ { tabNr === SharingDialogTab.URLS && <>
+ <Grid item><FormControlLabel
+ control={<Checkbox color="primary" checked={withExpiration}
+ onChange={(e) => setWithExpiration(e.target.checked)} />}
+ label="With expiration" />
+ </Grid>
<Grid item>
- <Button
- variant="contained"
- color="primary"
- onClick={onCreateSharingToken}>
+ <Button variant="contained" color="primary"
+ onClick={onCreateSharingToken(expDate)}>
Create sharing URL
</Button>
</Grid>
- }
+ </>}
{ tabNr === SharingDialogTab.PERMISSIONS &&
<Grid item>
- <Button
- variant='contained'
- color='primary'
- onClick={onSave}
+ <Button onClick={onSave} variant="contained" color="primary"
disabled={!saveEnabled}>
Save changes
</Button>
</Grid>
}
<Grid item>
- <Button onClick={onClose}>
+ <Button onClick={() => {
+ onClose();
+ setWithExpiration(false);
+ }}>
Close
</Button>
</Grid>