Add customisation point to disable space creation (#7766)

* mock matchMedia in jest setup Signed-off-by: Kerry Archibald <kerrya@element.io> * use UIComponent.CreateSpaces in space panel Signed-off-by: Kerry Archibald <kerrya@element.io> * lint Signed-off-by: Kerry Archibald <kerrya@element.io> * hide add space in spacecontextmenu Signed-off-by: Kerry Archibald <kerrya@element.io> * use UIComponent customistations in space oom view add space button Signed-off-by: Kerry Archibald <kerrya@element.io> * copyright Signed-off-by: Kerry Archibald <kerrya@element.io>
2022-02-09 17:21:40 +01:00 · 2022-02-09 17:21:40 +01:00 · 818fddd72c
commit 818fddd72c
parent 6e8edbb418
11 changed files with 890 additions and 48 deletions
--- a/src/components/structures/SpaceRoomView.tsx
+++ b/src/components/structures/SpaceRoomView.tsx
@ -363,6 +363,8 @@ const SpacePreview = ({ space, onJoinButtonClicked, onRejectButtonClicked }: ISp

 const SpaceLandingAddButton = ({ space }) => {
    const [menuDisplayed, handle, openMenu, closeMenu] = useContextMenu();
+    const canCreateRoom = shouldShowComponent(UIComponent.CreateRooms);
+    const canCreateSpace = shouldShowComponent(UIComponent.CreateSpaces);

    let contextMenu;
    if (menuDisplayed) {
@ -376,7 +378,7 @@ const SpaceLandingAddButton = ({ space }) => {
            compact
        >
            <IconizedContextMenuOptionList first>
-                <IconizedContextMenuOption
+                { canCreateRoom && <IconizedContextMenuOption
                    label={_t("Create new room")}
                    iconClassName="mx_RoomList_iconPlus"
                    onClick={async (e) => {
@ -388,7 +390,7 @@ const SpaceLandingAddButton = ({ space }) => {
                            defaultDispatcher.fire(Action.UpdateSpaceHierarchy);
                        }
                    }}
-                />
+                /> }
                <IconizedContextMenuOption
                    label={_t("Add existing room")}
                    iconClassName="mx_RoomList_iconAddExistingRoom"
@ -399,18 +401,20 @@ const SpaceLandingAddButton = ({ space }) => {
                        showAddExistingRooms(space);
                    }}
                />
-                <IconizedContextMenuOption
-                    label={_t("Add space")}
-                    iconClassName="mx_RoomList_iconPlus"
-                    onClick={(e) => {
-                        e.preventDefault();
-                        e.stopPropagation();
-                        closeMenu();
-                        showCreateNewSubspace(space);
-                    }}
-                >
-                    <BetaPill />
-                </IconizedContextMenuOption>
+                { canCreateSpace &&
+                    <IconizedContextMenuOption
+                        label={_t("Add space")}
+                        iconClassName="mx_RoomList_iconPlus"
+                        onClick={(e) => {
+                            e.preventDefault();
+                            e.stopPropagation();
+                            closeMenu();
+                            showCreateNewSubspace(space);
+                        }}
+                    >
+                        <BetaPill />
+                    </IconizedContextMenuOption>
+                }
            </IconizedContextMenuOptionList>
        </IconizedContextMenu>;
    }
@ -449,10 +453,11 @@ const SpaceLanding = ({ space }: { space: Room }) => {
        );
    }

-    const canAddRooms = myMembership === "join" && space.currentState.maySendStateEvent(EventType.SpaceChild, userId);
+    const hasAddRoomPermissions = myMembership === "join" &&
+        space.currentState.maySendStateEvent(EventType.SpaceChild, userId);

    let addRoomButton;
-    if (canAddRooms) {
+    if (hasAddRoomPermissions) {
        addRoomButton = <SpaceLandingAddButton space={space} />;
    }

--- a/src/components/views/context_menus/SpaceContextMenu.tsx
+++ b/src/components/views/context_menus/SpaceContextMenu.tsx
@ -36,6 +36,8 @@ import defaultDispatcher from "../../../dispatcher/dispatcher";
 import { BetaPill } from "../beta/BetaCard";
 import SettingsStore from "../../../settings/SettingsStore";
 import { Action } from "../../../dispatcher/actions";
+import { shouldShowComponent } from "../../../customisations/helpers/UIComponents";
+import { UIComponent } from "../../../settings/UIFeature";

 interface IProps extends IContextMenuProps {
    space: Room;
@ -58,6 +60,7 @@ const SpaceContextMenu = ({ space, hideHeader, onFinished, ...props }: IProps) =

        inviteOption = (
            <IconizedContextMenuOption
+                data-test-id='invite-option'
                className="mx_SpacePanel_contextMenu_inviteButton"
                iconClassName="mx_SpacePanel_iconInvite"
                label={_t("Invite")}
@ -79,6 +82,7 @@ const SpaceContextMenu = ({ space, hideHeader, onFinished, ...props }: IProps) =

        settingsOption = (
            <IconizedContextMenuOption
+                data-test-id='settings-option'
                iconClassName="mx_SpacePanel_iconSettings"
                label={_t("Settings")}
                onClick={onSettingsClick}
@ -95,6 +99,7 @@ const SpaceContextMenu = ({ space, hideHeader, onFinished, ...props }: IProps) =

        leaveOption = (
            <IconizedContextMenuOption
+                data-test-id='leave-option'
                iconClassName="mx_SpacePanel_iconLeave"
                className="mx_IconizedContextMenu_option_red"
                label={_t("Leave space")}
@ -126,10 +131,12 @@ const SpaceContextMenu = ({ space, hideHeader, onFinished, ...props }: IProps) =
        );
    }

-    const canAddRooms = space.currentState.maySendStateEvent(EventType.SpaceChild, userId);
+    const hasPermissionToAddSpaceChild = space.currentState.maySendStateEvent(EventType.SpaceChild, userId);
+    const canAddRooms = hasPermissionToAddSpaceChild && shouldShowComponent(UIComponent.CreateRooms);
+    const canAddSubSpaces = hasPermissionToAddSpaceChild && shouldShowComponent(UIComponent.CreateSpaces);

    let newRoomSection: JSX.Element;
-    if (space.currentState.maySendStateEvent(EventType.SpaceChild, userId)) {
+    if (canAddRooms || canAddSubSpaces) {
        const onNewRoomClick = (ev: ButtonEvent) => {
            ev.preventDefault();
            ev.stopPropagation();
@ -147,21 +154,27 @@ const SpaceContextMenu = ({ space, hideHeader, onFinished, ...props }: IProps) =
        };

        newRoomSection = <>
-            <div className="mx_SpacePanel_contextMenu_separatorLabel">
+            <div data-test-id='add-to-space-header' className="mx_SpacePanel_contextMenu_separatorLabel">
                { _t("Add") }
            </div>
-            <IconizedContextMenuOption
-                iconClassName="mx_SpacePanel_iconPlus"
-                label={_t("Room")}
-                onClick={onNewRoomClick}
-            />
-            <IconizedContextMenuOption
-                iconClassName="mx_SpacePanel_iconPlus"
-                label={_t("Space")}
-                onClick={onNewSubspaceClick}
-            >
-                <BetaPill />
-            </IconizedContextMenuOption>
+            { canAddRooms &&
+                <IconizedContextMenuOption
+                    data-test-id='new-room-option'
+                    iconClassName="mx_SpacePanel_iconPlus"
+                    label={_t("Room")}
+                    onClick={onNewRoomClick}
+                />
+            }
+            { canAddSubSpaces &&
+                <IconizedContextMenuOption
+                    data-test-id='new-subspace-option'
+                    iconClassName="mx_SpacePanel_iconPlus"
+                    label={_t("Space")}
+                    onClick={onNewSubspaceClick}
+                >
+                    <BetaPill />
+                </IconizedContextMenuOption>
+            }
        </>;
    }

--- a/src/components/views/rooms/RoomList.tsx
+++ b/src/components/views/rooms/RoomList.tsx
@ -191,6 +191,8 @@ const DmAuxButton = ({ tabIndex, dispatcher = defaultDispatcher }: IAuxButtonPro
            title={_t("Start chat")}
        />;
    }
+
+    return null;
 };

 const UntaggedAuxButton = ({ tabIndex }: IAuxButtonProps) => {
--- a/src/components/views/spaces/SpacePanel.tsx
+++ b/src/components/views/spaces/SpacePanel.tsx
@ -70,6 +70,8 @@ import { ActionPayload } from "../../../dispatcher/payloads";
 import { Action } from "../../../dispatcher/actions";
 import { NotificationState } from "../../../stores/notifications/NotificationState";
 import { ALTERNATE_KEY_NAME } from "../../../accessibility/KeyboardShortcuts";
+import { shouldShowComponent } from "../../../customisations/helpers/UIComponents";
+import { UIComponent } from "../../../settings/UIFeature";

 const useSpaces = (): [Room[], MetaSpace[], Room[], SpaceKey] => {
    const invites = useEventEmitterState<Room[]>(SpaceStore.instance, UPDATE_INVITED_SPACES, () => {
@ -235,6 +237,7 @@ const CreateSpaceButton = ({
        role="treeitem"
    >
        <SpaceButton
+            data-test-id='create-space-button'
            className={classNames("mx_SpaceButton_new", {
                mx_SpaceButton_newCancel: menuDisplayed,
            })}
@ -316,7 +319,11 @@ const InnerSpacePanel = React.memo<IInnerSpacePanelProps>(({
            </Draggable>
        )) }
        { children }
-        <CreateSpaceButton isPanelCollapsed={isPanelCollapsed} setPanelCollapsed={setPanelCollapsed} />
+        {
+            shouldShowComponent(UIComponent.CreateSpaces) &&
+            <CreateSpaceButton isPanelCollapsed={isPanelCollapsed} setPanelCollapsed={setPanelCollapsed} />
+        }
+
    </IndicatorScrollbar>;
 });

--- a/src/settings/UIFeature.ts
+++ b/src/settings/UIFeature.ts
@ -38,4 +38,5 @@ export enum UIFeature {
 export enum UIComponent {
    InviteUsers = "UIComponent.sendInvites",
    CreateRooms = "UIComponent.roomCreation",
+    CreateSpaces = "UIComponent.spaceCreation",
 }