From dfcf662a85b4c235ac9b95a7404a7fd7a8a84211 Mon Sep 17 00:00:00 2001 From: Erik Michelson Date: Sun, 13 Aug 2023 23:56:41 +0200 Subject: [PATCH] enhancement(permissions): show alert when permission is overridden by another Signed-off-by: Erik Michelson --- frontend/locales/en.json | 3 +- .../permission-entry-special-group.tsx | 7 +++- .../permission-entry-user.tsx | 36 +++++++++++++------ .../permission-inconsistent-alert.tsx | 24 +++++++++++++ .../permission-section-special-groups.tsx | 12 ++++--- 5 files changed, 64 insertions(+), 18 deletions(-) create mode 100644 frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-inconsistent-alert.tsx diff --git a/frontend/locales/en.json b/frontend/locales/en.json index a924f3737..ae1e0d63e 100644 --- a/frontend/locales/en.json +++ b/frontend/locales/en.json @@ -423,7 +423,8 @@ "error": "There was an error changing the owner of this note.", "placeholder": "Enter username of new note owner", "button": "Change the owner of this note" - } + }, + "inconsistent": "This permission is overridden by another permission" }, "shareLink": { "title": "Share link", diff --git a/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-entry-special-group.tsx b/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-entry-special-group.tsx index 354d4ec5c..06fb19c08 100644 --- a/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-entry-special-group.tsx +++ b/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-entry-special-group.tsx @@ -15,10 +15,12 @@ import React, { useCallback, useMemo } from 'react' import { ToggleButtonGroup } from 'react-bootstrap' import { Eye as IconEye, Pencil as IconPencil, SlashCircle as IconSlashCircle } from 'react-bootstrap-icons' import { useTranslation } from 'react-i18next' +import { PermissionInconsistentAlert } from './permission-inconsistent-alert' export interface PermissionEntrySpecialGroupProps { level: AccessLevel type: SpecialGroup + inconsistent?: boolean } /** @@ -27,11 +29,13 @@ export interface PermissionEntrySpecialGroupProps { * @param level The access level that is currently set for the group. * @param type The type of the special group. Must be either {@link SpecialGroup.EVERYONE} or {@link SpecialGroup.LOGGED_IN}. * @param disabled If the user is not the owner, functionality is disabled. + * @param inconsistent Whether to show the inconsistency alert icon or not */ export const PermissionEntrySpecialGroup: React.FC = ({ level, type, - disabled + disabled, + inconsistent }) => { const noteId = useApplicationState((state) => state.noteDetails?.primaryAddress) const { t } = useTranslation() @@ -88,6 +92,7 @@ export const PermissionEntrySpecialGroup: React.FC {name}
+ { const noteId = useApplicationState((state) => state.noteDetails?.primaryAddress) const { showErrorNotification } = useUiNotifications() + const groupPermissions = useApplicationState((state) => state.noteDetails.permissions.sharedToGroups) + + const permissionInconsistent = useMemo(() => { + const everyonePermission = groupPermissions.find((group) => group.groupName === (SpecialGroup.EVERYONE as string)) + const loggedInPermission = groupPermissions.find((group) => group.groupName === (SpecialGroup.LOGGED_IN as string)) + return ( + (everyonePermission && everyonePermission.canEdit && !entry.canEdit) || + (loggedInPermission && loggedInPermission.canEdit && !entry.canEdit) + ) + }, [groupPermissions, entry]) const onRemoveEntry = useCallback(() => { if (!noteId) { @@ -79,15 +90,18 @@ export const PermissionEntryUser: React.FC
  • - +
    + + +
    • ) diff --git a/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-inconsistent-alert.tsx b/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-inconsistent-alert.tsx new file mode 100644 index 000000000..f1e81049a --- /dev/null +++ b/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-inconsistent-alert.tsx @@ -0,0 +1,24 @@ +/* + * SPDX-FileCopyrightText: 2023 The HedgeDoc developers (see AUTHORS file) + * + * SPDX-License-Identifier: AGPL-3.0-only + */ +import React from 'react' +import { UiIcon } from '../../../../../common/icons/ui-icon' +import { ExclamationTriangleFill as IconExclamationTriangleFill } from 'react-bootstrap-icons' +import type { SimpleAlertProps } from '../../../../../common/simple-alert/simple-alert-props' +import { useTranslatedText } from '../../../../../../hooks/common/use-translated-text' + +/** + * Alert that is shown when the permissions are inconsistent. + * + * @param show true to show the alert, false otherwise. + */ +export const PermissionInconsistentAlert: React.FC = ({ show }) => { + const message = useTranslatedText('editor.modal.permissions.inconsistent') + + if (!show) { + return null + } + return +} diff --git a/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-section-special-groups.tsx b/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-section-special-groups.tsx index a50159fc2..607bc34a5 100644 --- a/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-section-special-groups.tsx +++ b/frontend/src/components/editor-page/sidebar/specific-sidebar-entries/permissions-sidebar-entry/permissions-modal/permission-section-special-groups.tsx @@ -29,16 +29,17 @@ export const PermissionSectionSpecialGroups: React.FC = const groupLoggedIn = groupPermissions.find((entry) => entry.groupName === (SpecialGroup.LOGGED_IN as string)) return { - everyone: groupEveryone + everyoneLevel: groupEveryone ? groupEveryone.canEdit ? AccessLevel.WRITEABLE : AccessLevel.READ_ONLY : AccessLevel.NONE, - loggedIn: groupLoggedIn + loggedInLevel: groupLoggedIn ? groupLoggedIn.canEdit ? AccessLevel.WRITEABLE : AccessLevel.READ_ONLY - : AccessLevel.NONE + : AccessLevel.NONE, + loggedInInconsistentAlert: groupEveryone && (!groupLoggedIn || (groupEveryone.canEdit && !groupLoggedIn.canEdit)) } }, [groupPermissions]) @@ -53,12 +54,13 @@ export const PermissionSectionSpecialGroups: React.FC =