1 // Copyright (C) The Arvados Authors. All rights reserved.
3 // SPDX-License-Identifier: AGPL-3.0
5 import React from 'react';
16 } from '@material-ui/core';
21 } from '@material-ui/core/styles';
22 import { DialogActions } from 'components/dialog-actions/dialog-actions';
23 import { SharingURLsContent } from './sharing-urls';
25 extractUuidObjectType,
27 } from 'models/resource';
28 import { SharingInvitationForm } from './sharing-invitation-form';
29 import { SharingManagementForm } from './sharing-management-form';
31 export interface SharingDialogDataProps {
35 sharedResourceUuid: string;
37 export interface SharingDialogActionProps {
40 onCreateSharingToken: () => void;
42 enum SharingDialogTab {
46 export default (props: SharingDialogDataProps & SharingDialogActionProps) => {
47 const { open, loading, saveEnabled, sharedResourceUuid,
48 onClose, onSave, onCreateSharingToken } = props;
49 const showTabs = extractUuidObjectType(sharedResourceUuid) === ResourceObjectType.COLLECTION;
50 const [tabNr, setTabNr] = React.useState<number>(SharingDialogTab.PERMISSIONS);
52 // Sets up the dialog depending on the resource type
53 if (!showTabs && tabNr !== SharingDialogTab.PERMISSIONS) {
54 setTabNr(SharingDialogTab.PERMISSIONS);
58 {...{ open, onClose }}
59 className="sharing-dialog"
62 disableBackdropClick={saveEnabled}
63 disableEscapeKeyDown={saveEnabled}>
68 <Tabs value={tabNr} onChange={(_, tb) => setTabNr(tb)}>
69 <Tab label="With users/groups" />
70 <Tab label="Sharing URLs" disabled={saveEnabled} />
74 { tabNr === SharingDialogTab.PERMISSIONS &&
75 <Grid container direction='column' spacing={24}>
77 <SharingManagementForm />
81 { tabNr === SharingDialogTab.URLS &&
82 <SharingURLsContent uuid={sharedResourceUuid} />
86 <Grid container spacing={8}>
87 { tabNr === SharingDialogTab.PERMISSIONS &&
89 <SharingInvitationForm />
92 { tabNr === SharingDialogTab.URLS &&
97 onClick={onCreateSharingToken}>
102 { tabNr === SharingDialogTab.PERMISSIONS &&
108 disabled={!saveEnabled}>
114 <Button onClick={onClose}>
121 loading && <LoadingIndicator />
126 const loadingIndicatorStyles: StyleRulesCallback<'root'> = theme => ({
128 position: 'absolute',
134 alignItems: 'center',
135 justifyContent: 'center',
136 backgroundColor: 'rgba(255, 255, 255, 0.8)',
140 const LoadingIndicator = withStyles(loadingIndicatorStyles)(
141 (props: WithStyles<'root'>) =>
142 <Paper classes={props.classes}>