Hide sticker picker for local rooms (#9174) (#9180)

* Disable stickers for local rooms

* Use prop

src/components/views/rooms/MessageComposer.tsx

@@ -51,6 +51,7 @@ import { SettingUpdatedPayload } from "../../../dispatcher/payloads/SettingUpdat
 import MessageComposerButtons from './MessageComposerButtons';
 import { ButtonEvent } from '../elements/AccessibleButton';
 import { ViewRoomPayload } from "../../../dispatcher/payloads/ViewRoomPayload";
+import { isLocalRoom } from '../../../utils/localRoom/isLocalRoom';
 
 let instanceCount = 0;
 
@@ -350,6 +351,10 @@ export default class MessageComposer extends React.Component<IProps, IState> {
         });
     };
 
+    private get showStickersButton(): boolean {
+        return this.state.showStickersButton && !isLocalRoom(this.props.room);
+    }
+
     public render() {
         const controls = [
             this.props.e2eStatus ?
@@ -475,7 +480,7 @@ export default class MessageComposer extends React.Component<IProps, IState> {
                             setStickerPickerOpen={this.setStickerPickerOpen}
                             showLocationButton={!window.electron}
                             showPollsButton={this.state.showPollsButton}
-                            showStickersButton={this.state.showStickersButton}
+                            showStickersButton={this.showStickersButton}
                             toggleButtonMenu={this.toggleButtonMenu}
                         /> }
                         { showSendButton && (

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

@@ -28,48 +28,66 @@ import RoomContext from "../../../../src/contexts/RoomContext";
 import { IRoomState } from "../../../../src/components/structures/RoomView";
 import ResizeNotifier from "../../../../src/utils/ResizeNotifier";
 import { RoomPermalinkCreator } from "../../../../src/utils/permalinks/Permalinks";
+import { LocalRoom } from "../../../../src/models/LocalRoom";
+import MessageComposerButtons from "../../../../src/components/views/rooms/MessageComposerButtons";
 
 describe("MessageComposer", () => {
     stubClient();
     const cli = createTestClient();
-    const room = mkStubRoom("!roomId:server", "Room 1", cli);
 
-    it("Renders a SendMessageComposer and MessageComposerButtons by default", () => {
+    describe("for a Room", () => {
-        const wrapper = wrapAndRender({ room });
+        const room = mkStubRoom("!roomId:server", "Room 1", cli);
 
-        expect(wrapper.find("SendMessageComposer")).toHaveLength(1);
+        it("Renders a SendMessageComposer and MessageComposerButtons by default", () => {
-        expect(wrapper.find("MessageComposerButtons")).toHaveLength(1);
+            const wrapper = wrapAndRender({ room });
+
+            expect(wrapper.find("SendMessageComposer")).toHaveLength(1);
+            expect(wrapper.find("MessageComposerButtons")).toHaveLength(1);
+        });
+
+        it("Does not render a SendMessageComposer or MessageComposerButtons when user has no permission", () => {
+            const wrapper = wrapAndRender({ room }, false);
+
+            expect(wrapper.find("SendMessageComposer")).toHaveLength(0);
+            expect(wrapper.find("MessageComposerButtons")).toHaveLength(0);
+            expect(wrapper.find(".mx_MessageComposer_noperm_error")).toHaveLength(1);
+        });
+
+        it("Does not render a SendMessageComposer or MessageComposerButtons when room is tombstoned", () => {
+            const wrapper = wrapAndRender({ room }, true, mkEvent({
+                event: true,
+                type: "m.room.tombstone",
+                room: room.roomId,
+                user: "@user1:server",
+                skey: "",
+                content: {},
+                ts: Date.now(),
+            }));
+
+            expect(wrapper.find("SendMessageComposer")).toHaveLength(0);
+            expect(wrapper.find("MessageComposerButtons")).toHaveLength(0);
+            expect(wrapper.find(".mx_MessageComposer_roomReplaced_header")).toHaveLength(1);
+        });
     });
 
-    it("Does not render a SendMessageComposer or MessageComposerButtons when user has no permission", () => {
+    describe("for a LocalRoom", () => {
-        const wrapper = wrapAndRender({ room }, false);
+        const localRoom = new LocalRoom("!room:example.com", cli, cli.getUserId());
 
-        expect(wrapper.find("SendMessageComposer")).toHaveLength(0);
+        it("should pass the sticker picker disabled prop", () => {
-        expect(wrapper.find("MessageComposerButtons")).toHaveLength(0);
+            const wrapper = wrapAndRender({ room: localRoom });
-        expect(wrapper.find(".mx_MessageComposer_noperm_error")).toHaveLength(1);
+            expect(wrapper.find(MessageComposerButtons).props().showStickersButton).toBe(false);
-    });
+        });
-
-    it("Does not render a SendMessageComposer or MessageComposerButtons when room is tombstoned", () => {
-        const wrapper = wrapAndRender({ room }, true, mkEvent({
-            event: true,
-            type: "m.room.tombstone",
-            room: room.roomId,
-            user: "@user1:server",
-            skey: "",
-            content: {},
-            ts: Date.now(),
-        }));
-
-        expect(wrapper.find("SendMessageComposer")).toHaveLength(0);
-        expect(wrapper.find("MessageComposerButtons")).toHaveLength(0);
-        expect(wrapper.find(".mx_MessageComposer_roomReplaced_header")).toHaveLength(1);
     });
 });
 
-function wrapAndRender(props = {}, canSendMessages = true, tombstone?: MatrixEvent): ReactWrapper {
+function wrapAndRender(
+    props: Partial<React.ComponentProps<typeof MessageComposer>> = {},
+    canSendMessages = true,
+    tombstone?: MatrixEvent,
+): ReactWrapper {
     const mockClient = MatrixClientPeg.get();
     const roomId = "myroomid";
-    const room: any = {
+    const room: any = props.room || {
         currentState: undefined,
         roomId,
         client: mockClient,