⚰️ front: deleted unused update access dialog rows eg. inheritance (#50)
This commit is contained in:
committed by
ericlinagora
parent
3a0e0a9085
commit
1924eca688
-74
@@ -1,74 +0,0 @@
|
|||||||
import { Subtitle } from '@atoms/text';
|
|
||||||
import { useDriveItem, getPublicLink } from '@features/drive/hooks/use-drive-item';
|
|
||||||
import { Input } from 'app/atoms/input/input-text';
|
|
||||||
import { useState } from 'react';
|
|
||||||
import { AccessLevelDropdown } from '../../components/access-level-dropdown';
|
|
||||||
import Languages from 'features/global/services/languages-service';
|
|
||||||
import { UserGroupIcon } from '@heroicons/react/outline';
|
|
||||||
import type { DriveFileAccessLevelForPublicLink } from 'app/features/drive/types';
|
|
||||||
import { changePublicLink } from '@features/files/utils/access-info-helpers';
|
|
||||||
import { CopyLinkButton } from './copy-link-button';
|
|
||||||
|
|
||||||
export const PublicLinkManager = ({ id, disabled }: { id: string; disabled?: boolean }) => {
|
|
||||||
const { item, loading, update } = useDriveItem(id);
|
|
||||||
const publicLink = getPublicLink(item);
|
|
||||||
const defaultPublicLinkLevel = 'read';
|
|
||||||
const publicLinkLevel = item?.access_info?.public?.level || 'none';
|
|
||||||
const havePublicLink = publicLinkLevel !== 'none';
|
|
||||||
const [publicLinkCreationLevel, setPublicLinkCreationLevel] = useState<DriveFileAccessLevelForPublicLink>(defaultPublicLinkLevel);
|
|
||||||
const publicLinkCreationLevelSafe = havePublicLink ? publicLinkLevel || defaultPublicLinkLevel : publicLinkCreationLevel;
|
|
||||||
const updatePublicLinkLevel = (level: DriveFileAccessLevelForPublicLink) => {
|
|
||||||
item && update(changePublicLink(item, { level }));
|
|
||||||
if (level === 'none')
|
|
||||||
setPublicLinkCreationLevel(defaultPublicLinkLevel);
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<hr />
|
|
||||||
<Subtitle className="block mt-2 mb-1">
|
|
||||||
{Languages.t('components.public-link-acess.public_link_access')}
|
|
||||||
</Subtitle>
|
|
||||||
<div className="rounded-md border dark:border-zinc-700">
|
|
||||||
<div className="p-4 flex flex-row items-center justify-center">
|
|
||||||
<div className="grow relative">
|
|
||||||
<Input
|
|
||||||
className={'w-full'}
|
|
||||||
disabled={disabled || !havePublicLink}
|
|
||||||
readOnly={true}
|
|
||||||
onFocus={({target}) => target.select()}
|
|
||||||
theme={havePublicLink ? "blue" : "outline"}
|
|
||||||
value={havePublicLink ? publicLink : Languages.t('components.public-link-acess.public-link-placeholder')}
|
|
||||||
/>
|
|
||||||
<CopyLinkButton
|
|
||||||
textToCopy={havePublicLink && publicLink}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="p-4 flex flex-row items-center justify-center text-zinc-800 dark:text-white">
|
|
||||||
<div className="shrink-0">
|
|
||||||
<UserGroupIcon className="w-6 mr-2" />
|
|
||||||
</div>
|
|
||||||
<div className="grow">
|
|
||||||
{Languages.t('components.public-link-access-level-' + (havePublicLink ? 'update' : 'create'))}
|
|
||||||
</div>
|
|
||||||
<div className="shrink-0">
|
|
||||||
<AccessLevelDropdown
|
|
||||||
hiddenLevels={['manage', 'remove'].concat(havePublicLink ? [] : ['none'])}
|
|
||||||
disabled={loading || disabled}
|
|
||||||
level={publicLinkCreationLevelSafe}
|
|
||||||
labelOverrides={{'none': Languages.t('components.public-link-access-level-delete')}}
|
|
||||||
onChange={level => {
|
|
||||||
if (havePublicLink) {
|
|
||||||
updatePublicLinkLevel(level);
|
|
||||||
} else {
|
|
||||||
setPublicLinkCreationLevel(level);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
-30
@@ -1,30 +0,0 @@
|
|||||||
import { Base } from '@atoms/text';
|
|
||||||
import { FolderIcon } from '@heroicons/react/outline';
|
|
||||||
import { DocumentIcon } from '@views/client/body/drive/documents/document-icon';
|
|
||||||
import type { DriveItem } from 'app/features/drive/types';
|
|
||||||
|
|
||||||
export const CuteDepictionOfFolderHierarchy = (props: {
|
|
||||||
file?: DriveItem,
|
|
||||||
parent?: DriveItem,
|
|
||||||
}) =>
|
|
||||||
<>
|
|
||||||
<Base className="p-4 pb-0 flex flex-row items-center justify-center">
|
|
||||||
<div className="shrink">
|
|
||||||
<FolderIcon className="w-7 mr-2" />
|
|
||||||
</div>
|
|
||||||
<div className="grow">
|
|
||||||
{props.parent?.name}
|
|
||||||
</div>
|
|
||||||
</Base>
|
|
||||||
<Base className="pl-5 flex flex-row items-center justify-center">
|
|
||||||
<div className="shrink text-2xl text-zinc-500">
|
|
||||||
└
|
|
||||||
</div>
|
|
||||||
<div className="shrink pl-2">
|
|
||||||
<DocumentIcon className="w-5 mr-2" item={props.file} />
|
|
||||||
</div>
|
|
||||||
<div className="grow">
|
|
||||||
{props.file?.name}
|
|
||||||
</div>
|
|
||||||
</Base>
|
|
||||||
</>;
|
|
||||||
@@ -1,20 +1,13 @@
|
|||||||
import A from '@atoms/link';
|
|
||||||
import { Info } from '@atoms/text';
|
|
||||||
import { Modal, ModalContent } from '@atoms/modal';
|
import { Modal, ModalContent } from '@atoms/modal';
|
||||||
import { useDriveItem } from '@features/drive/hooks/use-drive-item';
|
import { useDriveItem } from '@features/drive/hooks/use-drive-item';
|
||||||
import { useState, useEffect } from 'react';
|
import { useEffect } from 'react';
|
||||||
import { atom, useRecoilState } from 'recoil';
|
import { atom, useRecoilState } from 'recoil';
|
||||||
import { InternalAccessManager } from './internal-access';
|
import { InternalAccessManager } from './internal-access';
|
||||||
import { PublicLinkManager } from '../public-link/public-link-access';
|
|
||||||
import { useCurrentCompany } from '@features/companies/hooks/use-companies';
|
import { useCurrentCompany } from '@features/companies/hooks/use-companies';
|
||||||
import Languages from 'features/global/services/languages-service';
|
import Languages from 'features/global/services/languages-service';
|
||||||
import FeatureTogglesService, {
|
import FeatureTogglesService, {
|
||||||
FeatureNames,
|
FeatureNames,
|
||||||
} from '@features/global/services/feature-toggles-service';
|
} from '@features/global/services/feature-toggles-service';
|
||||||
import { ArrowLeftIcon, LockClosedIcon } from '@heroicons/react/outline';
|
|
||||||
import { PublicLinkAccessOptions } from '../public-link/public-link-access-options';
|
|
||||||
import { CuteDepictionOfFolderHierarchy } from './cute-depiction-of-folder-hierarchy';
|
|
||||||
import { InheritAccessOptions } from './inherit-access-options';
|
|
||||||
import { changePublicLink, hasAnyPublicLinkAccess } from '@features/files/utils/access-info-helpers';
|
import { changePublicLink, hasAnyPublicLinkAccess } from '@features/files/utils/access-info-helpers';
|
||||||
|
|
||||||
export type AccessModalType = {
|
export type AccessModalType = {
|
||||||
@@ -32,60 +25,22 @@ export const AccessModalAtom = atom<AccessModalType>({
|
|||||||
|
|
||||||
export const AccessModal = () => {
|
export const AccessModal = () => {
|
||||||
const [state, setState] = useRecoilState(AccessModalAtom);
|
const [state, setState] = useRecoilState(AccessModalAtom);
|
||||||
const [isOnAdvancedScreen, setIsOnAdvancedScreen] = useState(false);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Modal
|
<Modal
|
||||||
open={state.open}
|
open={state.open}
|
||||||
onClose={() => {
|
onClose={() => setState({ ...state, open: false })}
|
||||||
if (isOnAdvancedScreen)
|
|
||||||
setIsOnAdvancedScreen(false);
|
|
||||||
else
|
|
||||||
setState({ ...state, open: false });
|
|
||||||
}}
|
|
||||||
closeIcon={isOnAdvancedScreen && <ArrowLeftIcon className="w-5 dark:text-zinc-500" />}
|
|
||||||
>
|
>
|
||||||
{!!state.id &&
|
{!!state.id &&
|
||||||
<AccessModalContent
|
<AccessModalContent
|
||||||
id={state.id}
|
id={state.id}
|
||||||
isOnAdvancedScreen={isOnAdvancedScreen}
|
/>}
|
||||||
onShowAdvancedScreen={(active) => setIsOnAdvancedScreen(active)}
|
|
||||||
/>}
|
|
||||||
</Modal>
|
</Modal>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const SwitchToAdvancedSettingsPanel = (props: {
|
|
||||||
disabled: boolean,
|
|
||||||
onShowAdvancedScreen: (active: boolean) => void,
|
|
||||||
}) =>
|
|
||||||
<div className="p-4 flex flex-row items-center justify-center text-zinc-800 dark:text-white">
|
|
||||||
<div className="shrink-0">
|
|
||||||
<LockClosedIcon className="w-5 mr-2" />
|
|
||||||
</div>
|
|
||||||
<div className="grow">
|
|
||||||
<div>Advanced security settings</div>
|
|
||||||
<div><Info>Set password, expiration date, etc.</Info></div>
|
|
||||||
</div>
|
|
||||||
<div className="shrink-0">
|
|
||||||
<A
|
|
||||||
className={"inline-block" + (props.disabled ? ' !text-zinc-500' : '')}
|
|
||||||
disabled={props.disabled}
|
|
||||||
noColor={props.disabled}
|
|
||||||
onClick={() => {
|
|
||||||
if (!props.disabled)
|
|
||||||
props.onShowAdvancedScreen(true);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
Change
|
|
||||||
</A>
|
|
||||||
</div>
|
|
||||||
</div>;
|
|
||||||
|
|
||||||
const AccessModalContent = (props: {
|
const AccessModalContent = (props: {
|
||||||
id: string,
|
id: string,
|
||||||
isOnAdvancedScreen: boolean,
|
|
||||||
onShowAdvancedScreen: (active: boolean) => void,
|
|
||||||
}) => {
|
}) => {
|
||||||
const { id } = props;
|
const { id } = props;
|
||||||
const { item, access, loading, update, refresh } = useDriveItem(id);
|
const { item, access, loading, update, refresh } = useDriveItem(id);
|
||||||
@@ -95,25 +50,21 @@ const AccessModalContent = (props: {
|
|||||||
refresh(id);
|
refresh(id);
|
||||||
refreshCompany();
|
refreshCompany();
|
||||||
}, []);
|
}, []);
|
||||||
const havePublicLink = hasAnyPublicLinkAccess(item);
|
|
||||||
const haveAdvancedSettings = parentItem?.parent_id !== null || havePublicLink;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ModalContent
|
<ModalContent
|
||||||
title={
|
title={
|
||||||
<>
|
<>
|
||||||
{Languages.t(props.isOnAdvancedScreen
|
{Languages.t('components.internal-access_manage_title') + ' '}
|
||||||
? 'components.item_context_menu.manage_access_advanced_to'
|
|
||||||
: 'components.item_context_menu.manage_access_to') + ' '}
|
|
||||||
<strong>{item?.name}</strong>
|
<strong>{item?.name}</strong>
|
||||||
</>
|
</>
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
<PublicLinkManager id={id} disabled={access !== 'manage'} />
|
<div className={loading ? 'opacity-50' : ''}>
|
||||||
|
{FeatureTogglesService.isActiveFeatureName(FeatureNames.COMPANY_SEARCH_USERS) && (
|
||||||
{FeatureTogglesService.isActiveFeatureName(FeatureNames.COMPANY_SEARCH_USERS) && (
|
<InternalAccessManager id={id} disabled={access !== 'manage'} />
|
||||||
<InternalAccessManager id={id} disabled={access !== 'manage'} />
|
)}
|
||||||
)}
|
</div>
|
||||||
</ModalContent>
|
</ModalContent>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
-105
@@ -1,105 +0,0 @@
|
|||||||
import Languages from 'features/global/services/languages-service';
|
|
||||||
|
|
||||||
import type { DriveItem } from 'app/features/drive/types';
|
|
||||||
import {
|
|
||||||
changeAllChannelAccessLevels,
|
|
||||||
changeCompanyAccessLevel,
|
|
||||||
changeInheritedAccess,
|
|
||||||
getCompanyAccessLevel,
|
|
||||||
getFirstChannelAccessLevel,
|
|
||||||
getInheritedAccessLevel,
|
|
||||||
} from '@features/files/utils/access-info-helpers';
|
|
||||||
|
|
||||||
import { Base, Info, Subtitle } from '@atoms/text';
|
|
||||||
import { Checkbox } from '@atoms/input/input-checkbox';
|
|
||||||
import { AccessLevelDropdown } from '../../components/access-level-dropdown';
|
|
||||||
import AlertManager from '@features/global/services/alert-manager-service';
|
|
||||||
|
|
||||||
export const InheritAccessOptions = (props: {
|
|
||||||
item?: DriveItem,
|
|
||||||
disabled: boolean,
|
|
||||||
onUpdate: (item: Partial<DriveItem>) => void,
|
|
||||||
}) => {
|
|
||||||
// TODO: The default to 'manage' surprises me but it's what previous code did, as this commit is a refactoring, aim is to not affect function
|
|
||||||
const folderEntityLevel = getInheritedAccessLevel(props.item) || 'manage';
|
|
||||||
const companyEntityLevel = getCompanyAccessLevel(props.item);
|
|
||||||
const channelEntitiesLevel = getFirstChannelAccessLevel(props.item);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
{(companyEntityLevel || folderEntityLevel === 'none' || channelEntitiesLevel) &&
|
|
||||||
<Subtitle className="block mt-4 mb-1">{Languages.t('components.internal-access_access_manage')}</Subtitle>}
|
|
||||||
|
|
||||||
{ <div className="p-4 flex flex-row items-center justify-center">
|
|
||||||
<div className="grow">
|
|
||||||
<Base>{Languages.t('components.internal-access_inherit_parent')}</Base>
|
|
||||||
<br />
|
|
||||||
<Info>{Languages.t('components.internal-access_inherit_parent_perm')}</Info>
|
|
||||||
</div>
|
|
||||||
<div className="shrink-0 ml-2">
|
|
||||||
<Checkbox
|
|
||||||
disabled={props.disabled}
|
|
||||||
onChange={status => {
|
|
||||||
props.item && props.onUpdate(changeInheritedAccess(props.item, status ? 'manage' : 'none'));
|
|
||||||
}}
|
|
||||||
value={folderEntityLevel === 'manage'}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
}
|
|
||||||
|
|
||||||
{ companyEntityLevel && folderEntityLevel === 'none' && (
|
|
||||||
<div className="p-4 flex flex-row items-center justify-center">
|
|
||||||
<div className="grow">
|
|
||||||
<Base>{Languages.t('components.internal-access_company_member')}</Base>
|
|
||||||
</div>
|
|
||||||
<div className="shrink-0 ml-2">
|
|
||||||
<AccessLevelDropdown
|
|
||||||
hiddenLevels={['remove']}
|
|
||||||
disabled={props.disabled}
|
|
||||||
onChange={level => {
|
|
||||||
props.item && props.onUpdate(changeCompanyAccessLevel(props.item, level === 'remove' ? false : level));
|
|
||||||
}}
|
|
||||||
level={companyEntityLevel}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{channelEntitiesLevel && (
|
|
||||||
<div className="p-4 border-b flex flex-row items-center justify-center">
|
|
||||||
<div className="grow">
|
|
||||||
<Base>{Languages.t('components.internal-access_cannal')}</Base>
|
|
||||||
<br />
|
|
||||||
<Info>
|
|
||||||
{channelEntitiesLevel.length} {Languages.t('components.internal-access_cannal_info')}
|
|
||||||
</Info>
|
|
||||||
</div>
|
|
||||||
<div className="shrink-0 ml-2">
|
|
||||||
<AccessLevelDropdown
|
|
||||||
disabled={props.disabled}
|
|
||||||
hiddenLevels={['none']}
|
|
||||||
onChange={level => {
|
|
||||||
if (level === 'remove')
|
|
||||||
AlertManager.confirm(
|
|
||||||
async () => {
|
|
||||||
//Remove channel access
|
|
||||||
props.item && props.onUpdate(changeAllChannelAccessLevels(props.item, false));
|
|
||||||
},
|
|
||||||
() => { /* Do nothing */ },
|
|
||||||
{
|
|
||||||
text: Languages.t('components.internal-access_cannal_info_give_back'),
|
|
||||||
},
|
|
||||||
);
|
|
||||||
else
|
|
||||||
props.item && props.onUpdate(changeAllChannelAccessLevels(props.item, level));
|
|
||||||
}}
|
|
||||||
level={channelEntitiesLevel}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
</>);
|
|
||||||
};
|
|
||||||
|
|
||||||
Reference in New Issue
Block a user