1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import React from 'react';
19 } from '@material-ui/core';
24 } from '@material-ui/core/styles';
25 import { DialogActions } from 'components/dialog-actions/dialog-actions';
26 import { SharingURLsContent } from './sharing-urls';
28 extractUuidObjectType,
30 } from 'models/resource';
31 import { SharingInvitationForm } from './sharing-invitation-form';
32 import { SharingManagementForm } from './sharing-management-form';
36 MuiPickersUtilsProvider,
38 } from 'material-ui-pickers';
39 import DateFnsUtils from "@date-io/date-fns";
40 import moment from 'moment';
41 import { SharingPublicAccessForm } from './sharing-public-access-form';
43 export interface SharingDialogDataProps {
47 sharedResourceUuid: string;
48 sharingURLsNr: number;
49 privateAccess: boolean;
51 export interface SharingDialogActionProps {
54 onCreateSharingToken: (d: Date | undefined) => () => void;
55 refreshPermissions: () => void;
57 enum SharingDialogTab {
61 export default (props: SharingDialogDataProps & SharingDialogActionProps) => {
62 const { open, loading, saveEnabled, sharedResourceUuid,
63 sharingURLsNr, privateAccess,
64 onClose, onSave, onCreateSharingToken, refreshPermissions } = props;
65 const showTabs = extractUuidObjectType(sharedResourceUuid) === ResourceObjectType.COLLECTION;
66 const [tabNr, setTabNr] = React.useState<number>(SharingDialogTab.PERMISSIONS);
67 const [expDate, setExpDate] = React.useState<Date>();
68 const [withExpiration, setWithExpiration] = React.useState<boolean>(false);
70 // Sets up the dialog depending on the resource type
71 if (!showTabs && tabNr !== SharingDialogTab.PERMISSIONS) {
72 setTabNr(SharingDialogTab.PERMISSIONS);
75 React.useEffect(() => {
76 if (!withExpiration) {
77 setExpDate(undefined);
79 setExpDate(moment().add(2, 'hour').minutes(0).seconds(0).toDate());
84 {...{ open, onClose }}
85 className="sharing-dialog"
88 disableBackdropClick={saveEnabled}
89 disableEscapeKeyDown={saveEnabled}>
95 onChange={(_, tb) => {
96 if (tb === SharingDialogTab.PERMISSIONS) {
101 <Tab label="With users/groups" />
102 <Tab label={`Sharing URLs ${sharingURLsNr > 0 ? '('+sharingURLsNr+')' : ''}`} disabled={saveEnabled} />
106 { tabNr === SharingDialogTab.PERMISSIONS &&
107 <Grid container direction='column' spacing={24}>
109 <SharingPublicAccessForm />
112 <SharingManagementForm />
116 { tabNr === SharingDialogTab.URLS &&
117 <SharingURLsContent uuid={sharedResourceUuid} />
121 <Grid container spacing={8}>
122 { tabNr === SharingDialogTab.PERMISSIONS &&
124 <SharingInvitationForm />
127 { tabNr === SharingDialogTab.URLS && withExpiration && <>
128 <Grid item container direction='row' md={12}>
129 <MuiPickersUtilsProvider utils={DateFnsUtils}>
130 <BasePicker autoOk value={expDate} onChange={setExpDate}>
131 {({ date, handleChange }) => (<>
133 <Calendar date={date} minDate={new Date()} maxDate={undefined}
134 onChange={handleChange} />
137 <TimePickerView type="hours" date={date} ampm={false}
138 onMinutesChange={() => {}}
139 onSecondsChange={() => {}}
140 onHourChange={handleChange}
145 </MuiPickersUtilsProvider>
148 <Typography variant='caption' align='center'>
149 Maximum expiration date may be limited by the cluster configuration.
154 { tabNr === SharingDialogTab.PERMISSIONS && privateAccess && sharingURLsNr > 0 &&
156 <Typography variant='caption' align='center' color='error'>
157 Although there aren't specific permissions set, this is publicly accessible via Sharing URL(s).
162 { tabNr === SharingDialogTab.URLS && <>
163 <Grid item><FormControlLabel
164 control={<Checkbox color="primary" checked={withExpiration}
165 onChange={(e) => setWithExpiration(e.target.checked)} />}
166 label="With expiration" />
169 <Button variant="contained" color="primary"
170 disabled={expDate !== undefined && expDate <= new Date()}
171 onClick={onCreateSharingToken(expDate)}>
177 { tabNr === SharingDialogTab.PERMISSIONS &&
179 <Button onClick={onSave} variant="contained" color="primary"
180 disabled={!saveEnabled}>
186 <Button onClick={() => {
188 setWithExpiration(false);
196 loading && <LoadingIndicator />
201 const loadingIndicatorStyles: StyleRulesCallback<'root'> = theme => ({
203 position: 'absolute',
209 alignItems: 'center',
210 justifyContent: 'center',
211 backgroundColor: 'rgba(255, 255, 255, 0.8)',
215 const LoadingIndicator = withStyles(loadingIndicatorStyles)(
216 (props: WithStyles<'root'>) =>
217 <Paper classes={props.classes}>