diff --git a/cypress/e2e/right-panel/notification-panel.spec.ts b/cypress/e2e/right-panel/notification-panel.spec.ts index 4068285070..75a80abaf3 100644 --- a/cypress/e2e/right-panel/notification-panel.spec.ts +++ b/cypress/e2e/right-panel/notification-panel.spec.ts @@ -38,6 +38,7 @@ describe("NotificationPanel", () => { }); it("should render empty state", () => { + cy.enableLabsFeature("feature_notifications"); cy.viewRoomByName(ROOM_NAME); cy.findByRole("button", { name: "Notifications" }).click(); diff --git a/cypress/e2e/room/room-header.spec.ts b/cypress/e2e/room/room-header.spec.ts index 835fb2bb3e..d92d505167 100644 --- a/cypress/e2e/room/room-header.spec.ts +++ b/cypress/e2e/room/room-header.spec.ts @@ -36,6 +36,7 @@ describe("Room Header", () => { }); it("should render default buttons properly", () => { + cy.enableLabsFeature("feature_notifications"); cy.createRoom({ name: "Test Room" }).viewRoomByName("Test Room"); cy.get(".mx_LegacyRoomHeader").within(() => { @@ -79,6 +80,7 @@ describe("Room Header", () => { }); it("should render a very long room name without collapsing the buttons", () => { + cy.enableLabsFeature("feature_notifications"); const LONG_ROOM_NAME = "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore " + "et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut " + @@ -109,6 +111,7 @@ describe("Room Header", () => { }); it("should have buttons highlighted by being clicked", () => { + cy.enableLabsFeature("feature_notifications"); cy.createRoom({ name: "Test Room" }).viewRoomByName("Test Room"); cy.get(".mx_LegacyRoomHeader").within(() => { @@ -142,6 +145,7 @@ describe("Room Header", () => { }; it("should render buttons for room options, beta pill, invite, chat, and room info", () => { + cy.enableLabsFeature("feature_notifications"); createVideoRoom(); cy.get(".mx_LegacyRoomHeader").within(() => { diff --git a/src/components/views/right_panel/HeaderButtons.tsx b/src/components/views/right_panel/HeaderButtons.tsx index 0fe075332a..dbdd2f10b5 100644 --- a/src/components/views/right_panel/HeaderButtons.tsx +++ b/src/components/views/right_panel/HeaderButtons.tsx @@ -25,6 +25,7 @@ import RightPanelStore from "../../../stores/right-panel/RightPanelStore"; import { RightPanelPhases } from "../../../stores/right-panel/RightPanelStorePhases"; import { UPDATE_EVENT } from "../../../stores/AsyncStore"; import { NotificationColor } from "../../../stores/notifications/NotificationColor"; +import SettingsStore from "../../../settings/SettingsStore"; export enum HeaderKind { Room = "room", @@ -35,6 +36,7 @@ interface IState { phase: RightPanelPhases | null; threadNotificationColor: NotificationColor; globalNotificationColor: NotificationColor; + notificationsEnabled?: boolean; } interface IProps {} @@ -42,6 +44,7 @@ interface IProps {} export default abstract class HeaderButtons

extends React.Component { private unmounted = false; private dispatcherRef?: string = undefined; + private readonly watcherRef: string; public constructor(props: IProps & P, kind: HeaderKind) { super(props); @@ -52,7 +55,11 @@ export default abstract class HeaderButtons

extends React.Component + this.setState({ notificationsEnabled: value }), + ); } public componentDidMount(): void { @@ -63,6 +70,7 @@ export default abstract class HeaderButtons

extends React.Component { , ); - rightPanelPhaseButtons.set( - RightPanelPhases.NotificationPanel, - - {this.globalNotificationState.color === NotificationColor.Red ? ( - - ) : null} - , - ); + if (this.state.notificationsEnabled) { + rightPanelPhaseButtons.set( + RightPanelPhases.NotificationPanel, + + {this.globalNotificationState.color === NotificationColor.Red ? ( + + ) : null} + , + ); + } rightPanelPhaseButtons.set( RightPanelPhases.RoomSummary, - - { - evt.stopPropagation(); - RightPanelStore.instance.showOrHidePanel(RightPanelPhases.NotificationPanel); - }} - title={_t("Notifications")} - > - - - + {notificationsEnabled && ( + + { + evt.stopPropagation(); + RightPanelStore.instance.showOrHidePanel(RightPanelPhases.NotificationPanel); + }} + title={_t("Notifications")} + > + + + + )} {!isDirectMessage && ( -

{ }); it("opens the notifications panel", async () => { + jest.spyOn(SettingsStore, "getValue").mockImplementation((name: string) => { + if (name === "feature_notifications") return true; + }); + const { container } = render( , withClientContextRenderOptions(MatrixClientPeg.get()!), diff --git a/test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap b/test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap index f8acfdfe0e..60f42b919d 100644 --- a/test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap +++ b/test/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap @@ -60,14 +60,6 @@ exports[`RoomHeader does not show the face pile for DMs 1`] = ` >
-