Show room options menu if "UIComponent.roomOptionsMenu" is enabled

src/components/views/dialogs/spotlight/RoomResultContextMenus.tsx

@@ -27,6 +27,8 @@ import { RoomNotificationContextMenu } from "../../context_menus/RoomNotificatio
 import SpaceContextMenu from "../../context_menus/SpaceContextMenu";
 import { ButtonEvent } from "../../elements/AccessibleButton";
 import { contextMenuBelow } from "../../rooms/RoomTile";
+import { shouldShowComponent } from "../../../../customisations/helpers/UIComponents";
+import { UIComponent } from "../../../../settings/UIFeature";
 
 interface Props {
  room: Room;
@@ -80,18 +82,20 @@ export function RoomResultContextMenus({ room }: Props): JSX.Element {
 
  return (
  <Fragment>
- <ContextMenuTooltipButton
- className="mx_SpotlightDialog_option--menu"
- onClick={(ev: ButtonEvent) => {
- ev.preventDefault();
- ev.stopPropagation();
+ {shouldShowComponent(UIComponent.RoomOptionsMenu) && (
+ <ContextMenuTooltipButton
+ className="mx_SpotlightDialog_option--menu"
+ onClick={(ev: ButtonEvent) => {
+ ev.preventDefault();
+ ev.stopPropagation();
 
- const target = ev.target as HTMLElement;
- setGeneralMenuPosition(target.getBoundingClientRect());
- }}
- title={room.isSpaceRoom() ? _t("Space options") : _t("Room options")}
- isExpanded={generalMenuPosition !== null}
- />
+ const target = ev.target as HTMLElement;
+ setGeneralMenuPosition(target.getBoundingClientRect());
+ }}
+ title={room.isSpaceRoom() ? _t("Space options") : _t("Room options")}
+ isExpanded={generalMenuPosition !== null}
+ />
+ )}
  {!room.isSpaceRoom() && (
  <ContextMenuTooltipButton
  className={notificationMenuClasses}

src/components/views/rooms/RoomHeader.tsx

@@ -69,6 +69,8 @@ import { ViewRoomPayload } from "../../../dispatcher/payloads/ViewRoomPayload";
 import { GroupCallDuration } from "../voip/CallDuration";
 import { Alignment } from "../elements/Tooltip";
 import RoomCallBanner from "../beacon/RoomCallBanner";
+import { shouldShowComponent } from "../../../customisations/helpers/UIComponents";
+import { UIComponent } from "../../../settings/UIFeature";
 
 class DisabledWithReason {
  public constructor(public readonly reason: string) {}
@@ -696,7 +698,7 @@ export default class RoomHeader extends React.Component<IProps, IState> {
  </RoomName>
  );
 
- if (this.props.enableRoomOptionsMenu) {
+ if (this.props.enableRoomOptionsMenu && shouldShowComponent(UIComponent.RoomOptionsMenu)) {
  return (
  <ContextMenuTooltipButton
  className="mx_RoomHeader_name"

src/components/views/rooms/RoomTile.tsx

@@ -49,6 +49,8 @@ import { RoomGeneralContextMenu } from "../context_menus/RoomGeneralContextMenu"
 import { CallStore, CallStoreEvent } from "../../../stores/CallStore";
 import { SdkContextClass } from "../../../contexts/SDKContext";
 import { useHasRoomLiveVoiceBroadcast, VoiceBroadcastRoomSubtitle } from "../../../voice-broadcast";
+import { shouldShowComponent } from "../../../customisations/helpers/UIComponents";
+import { UIComponent } from "../../../settings/UIFeature";
 
 interface Props {
  room: Room;
@@ -118,7 +120,7 @@ export class RoomTile extends React.PureComponent<ClassProps, State> {
  };
 
  private get showContextMenu(): boolean {
- return this.props.tag !== DefaultTagID.Invite;
+ return this.props.tag !== DefaultTagID.Invite && shouldShowComponent(UIComponent.RoomOptionsMenu);
  }
 
  private get showMessagePreview(): boolean {

src/settings/UIFeature.ts

@@ -69,4 +69,9 @@ export enum UIComponent {
  * Component that lead to the user being able to search, dial, explore rooms
  */
  FilterContainer = "UIComponent.filterContainer",
+
+ /**
+ * Components that lead the user to room options menu.
+ */
+ RoomOptionsMenu = "UIComponent.roomOptionsMenu",
 }

test/components/views/dialogs/spotlight/RoomResultContextMenus-test.tsx

@@ -0,0 +1,66 @@
+/*
+Copyright 2023 Mikhail Aheichyk
+Copyright 2023 Nordeck IT + Consulting GmbH.
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.
+*/
+
+import React from "react";
+import { render, screen, RenderResult } from "@testing-library/react";
+import { mocked } from "jest-mock";
+import { Room } from "matrix-js-sdk/src/models/room";
+import { MatrixClient, PendingEventOrdering } from "matrix-js-sdk/src/client";
+
+import { RoomResultContextMenus } from "../../../../../src/components/views/dialogs/spotlight/RoomResultContextMenus";
+import { filterConsole, stubClient } from "../../../../test-utils";
+import { shouldShowComponent } from "../../../../../src/customisations/helpers/UIComponents";
+import { UIComponent } from "../../../../../src/settings/UIFeature";
+
+jest.mock("../../../../../src/customisations/helpers/UIComponents", () => ({
+ shouldShowComponent: jest.fn(),
+}));
+
+describe("RoomResultContextMenus", () => {
+ let client: MatrixClient;
+ let room: Room;
+
+ const renderRoomResultContextMenus = (): RenderResult => {
+ return render(<RoomResultContextMenus room={room} />);
+ };
+
+ filterConsole(
+ // irrelevant for this test
+ "Room !1:example.org does not have an m.room.create event",
+ );
+
+ beforeEach(() => {
+ client = stubClient();
+ room = new Room("!1:example.org", client, "@alice:example.org", {
+ pendingEventOrdering: PendingEventOrdering.Detached,
+ });
+ });
+
+ it("does not render the room options context menu when UIComponent customisations disable room options", () => {
+ mocked(shouldShowComponent).mockReturnValue(false);
+ renderRoomResultContextMenus();
+ expect(shouldShowComponent).toHaveBeenCalledWith(UIComponent.RoomOptionsMenu);
+ expect(screen.queryByRole("button", { name: "Room options" })).not.toBeInTheDocument();
+ });
+
+ it("renders the room options context menu when UIComponent customisations enable room options", () => {
+ mocked(shouldShowComponent).mockReturnValue(true);
+ renderRoomResultContextMenus();
+ expect(shouldShowComponent).toHaveBeenCalledWith(UIComponent.RoomOptionsMenu);
+ expect(screen.queryByRole("button", { name: "Room options" })).toBeInTheDocument();
+ });
+});

test/components/views/rooms/RoomHeader-test.tsx

@@ -57,6 +57,12 @@ import { WidgetMessagingStore } from "../../../../src/stores/widgets/WidgetMessa
 import WidgetUtils from "../../../../src/utils/WidgetUtils";
 import { ElementWidgetActions } from "../../../../src/stores/widgets/ElementWidgetActions";
 import MediaDeviceHandler, { MediaDeviceKindEnum } from "../../../../src/MediaDeviceHandler";
+import { shouldShowComponent } from "../../../../src/customisations/helpers/UIComponents";
+import { UIComponent } from "../../../../src/settings/UIFeature";
+
+jest.mock("../../../../src/customisations/helpers/UIComponents", () => ({
+ shouldShowComponent: jest.fn(),
+}));
 
 describe("RoomHeader", () => {
  let client: Mocked<MatrixClient>;
@@ -729,17 +735,26 @@ describe("RoomHeader", () => {
  expect(wrapper.container.querySelector(".mx_RoomHeader_button")).toBeFalsy();
  });
 
- it("should render the room options context menu if not passing enableRoomOptionsMenu (default true)", () => {
+ it("should render the room options context menu if not passing enableRoomOptionsMenu (default true) and UIComponent customisations room options enabled", () => {
+ mocked(shouldShowComponent).mockReturnValue(true);
  const room = createRoom({ name: "Room", isDm: false, userIds: [] });
  const wrapper = mountHeader(room);
+ expect(shouldShowComponent).toHaveBeenCalledWith(UIComponent.RoomOptionsMenu);
  expect(wrapper.container.querySelector(".mx_RoomHeader_name.mx_AccessibleButton")).toBeDefined();
  });
 
- it("should not render the room options context menu if passing enableRoomOptionsMenu = false", () => {
- const room = createRoom({ name: "Room", isDm: false, userIds: [] });
- const wrapper = mountHeader(room, { enableRoomOptionsMenu: false });
- expect(wrapper.container.querySelector(".mx_RoomHeader_name.mx_AccessibleButton")).toBeFalsy();
- });
+ it.each([
+ [false, true],
+ [true, false],
+ ])(
+ "should not render the room options context menu if passing enableRoomOptionsMenu = %s and UIComponent customisations room options enable = %s",
+ (enableRoomOptionsMenu, showRoomOptionsMenu) => {
+ mocked(shouldShowComponent).mockReturnValue(showRoomOptionsMenu);
+ const room = createRoom({ name: "Room", isDm: false, userIds: [] });
+ const wrapper = mountHeader(room, { enableRoomOptionsMenu });
+ expect(wrapper.container.querySelector(".mx_RoomHeader_name.mx_AccessibleButton")).toBeFalsy();
+ },
+ );
 });
 
 interface IRoomCreationInfo {

test/components/views/rooms/RoomTile-test.tsx

@@ -45,6 +45,12 @@ import { VoiceBroadcastInfoState } from "../../../../src/voice-broadcast";
 import { mkVoiceBroadcastInfoStateEvent } from "../../../voice-broadcast/utils/test-utils";
 import { TestSdkContext } from "../../../TestSdkContext";
 import { SDKContext } from "../../../../src/contexts/SDKContext";
+import { shouldShowComponent } from "../../../../src/customisations/helpers/UIComponents";
+import { UIComponent } from "../../../../src/settings/UIFeature";
+
+jest.mock("../../../../src/customisations/helpers/UIComponents", () => ({
+ shouldShowComponent: jest.fn(),
+}));
 
 describe("RoomTile", () => {
  jest.spyOn(PlatformPeg, "get").mockReturnValue({
@@ -66,8 +72,8 @@ describe("RoomTile", () => {
  });
  };
 
- const renderRoomTile = (): void => {
- renderResult = render(
+ const renderRoomTile = (): RenderResult => {
+ return render(
  <SDKContext.Provider value={sdkContext}>
  <RoomTile room={room} showMessagePreview={false} isMinimized={false} tag={DefaultTagID.Untagged} />
  </SDKContext.Provider>,
@@ -77,7 +83,6 @@ describe("RoomTile", () => {
  let client: Mocked<MatrixClient>;
  let voiceBroadcastInfoEvent: MatrixEvent;
  let room: Room;
- let renderResult: RenderResult;
  let sdkContext: TestSdkContext;
 
  filterConsole(
@@ -99,18 +104,32 @@ describe("RoomTile", () => {
  client.getRoom.mockImplementation((roomId) => (roomId === room.roomId ? room : null));
  client.getRooms.mockReturnValue([room]);
  client.reEmitter.reEmit(room, [RoomStateEvent.Events]);
-
- renderRoomTile();
  });
 
  afterEach(() => {
  jest.clearAllMocks();
  });
 
  it("should render the room", () => {
+ mocked(shouldShowComponent).mockReturnValue(true);
+ const renderResult: RenderResult = renderRoomTile();
  expect(renderResult.container).toMatchSnapshot();
  });
 
+ it("does not render the room options context menu when UIComponent customisations disable room options", () => {
+ mocked(shouldShowComponent).mockReturnValue(false);
+ renderRoomTile();
+ expect(shouldShowComponent).toHaveBeenCalledWith(UIComponent.RoomOptionsMenu);
+ expect(screen.queryByRole("button", { name: "Room options" })).not.toBeInTheDocument();
+ });
+
+ it("renders the room options context menu when UIComponent customisations enable room options", () => {
+ mocked(shouldShowComponent).mockReturnValue(true);
+ renderRoomTile();
+ expect(shouldShowComponent).toHaveBeenCalledWith(UIComponent.RoomOptionsMenu);
+ expect(screen.queryByRole("button", { name: "Room options" })).toBeInTheDocument();
+ });
+
  describe("when a call starts", () => {
  let call: MockedCall;
  let widget: Widget;
@@ -131,13 +150,13 @@ describe("RoomTile", () => {
  });
 
  afterEach(() => {
- renderResult.unmount();
  call.destroy();
  client.reEmitter.stopReEmitting(room, [RoomStateEvent.Events]);
  WidgetMessagingStore.instance.stopMessaging(widget, room.roomId);
  });
 
  it("tracks connection state", async () => {
+ renderRoomTile();
  screen.getByText("Video");
 
  // Insert an await point in the connection method so we can inspect
@@ -160,6 +179,7 @@ describe("RoomTile", () => {
  });
 
  it("tracks participants", () => {
+ renderRoomTile();
  const alice: [RoomMember, Set<string>] = [mkRoomMember(room.roomId, "@alice:example.org"), new Set(["a"])];
  const bob: [RoomMember, Set<string>] = [
  mkRoomMember(room.roomId, "@bob:example.org"),
@@ -187,6 +207,7 @@ describe("RoomTile", () => {
 
  describe("and a live broadcast starts", () => {
  beforeEach(async () => {
+ renderRoomTile();
  await setUpVoiceBroadcast(VoiceBroadcastInfoState.Started);
  });
 
@@ -199,6 +220,7 @@ describe("RoomTile", () => {
 
  describe("when a live voice broadcast starts", () => {
  beforeEach(async () => {
+ renderRoomTile();
  await setUpVoiceBroadcast(VoiceBroadcastInfoState.Started);
  });