Right panel: view third party invite info without clearing history (#11934)

* add View3pidInvite to actions enum, replace uses

* extract out action handler

* push card instead, test

* comment

Author: Kerry

src/components/structures/RoomView.tsx

@@ -131,6 +131,7 @@ import { isNotUndefined } from "../../Typeguards";
 import { CancelAskToJoinPayload } from "../../dispatcher/payloads/CancelAskToJoinPayload";
 import { SubmitAskToJoinPayload } from "../../dispatcher/payloads/SubmitAskToJoinPayload";
 import RightPanelStore from "../../stores/right-panel/RightPanelStore";
+import { onView3pidInvite } from "../../stores/right-panel/action-handlers";
 
 const DEBUG = false;
 const PREVENT_MULTIPLE_JITSI_WITHIN = 30_000;
@@ -1272,14 +1273,8 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
                     RightPanelStore.instance.showOrHidePanel(RightPanelPhases.RoomMemberList);
                 }
                 break;
-            case "view_3pid_invite":
-                if (payload.event) {
-                    RightPanelStore.instance.showOrHidePanel(RightPanelPhases.Room3pidMemberInfo, {
-                        memberInfoEvent: payload.event,
-                    });
-                } else {
-                    RightPanelStore.instance.showOrHidePanel(RightPanelPhases.RoomMemberList);
-                }
+            case Action.View3pidInvite:
+                onView3pidInvite(payload, RightPanelStore.instance);
                 break;
         }
     };

src/components/views/rooms/MemberList.tsx

@@ -55,6 +55,7 @@ import PosthogTrackers from "../../../PosthogTrackers";
 import { SDKContext } from "../../../contexts/SDKContext";
 import { canInviteTo } from "../../../utils/room/canInviteTo";
 import { inviteToRoom } from "../../../utils/room/inviteToRoom";
+import { Action } from "../../../dispatcher/actions";
 
 const INITIAL_LOAD_NUM_MEMBERS = 30;
 const INITIAL_LOAD_NUM_INVITED = 5;
@@ -275,7 +276,7 @@ export default class MemberList extends React.Component<IProps, IState> {
 
     private onPending3pidInviteClick = (inviteEvent: MatrixEvent): void => {
         dis.dispatch({
-            action: "view_3pid_invite",
+            action: Action.View3pidInvite,
             event: inviteEvent,
         });
     };

src/components/views/rooms/ThirdPartyMemberInfo.tsx

@@ -27,6 +27,7 @@ import RoomAvatar from "../avatars/RoomAvatar";
 import RoomName from "../elements/RoomName";
 import ErrorDialog from "../dialogs/ErrorDialog";
 import AccessibleButton from "../elements/AccessibleButton";
+import { Action } from "../../../dispatcher/actions";
 
 interface IProps {
     event: MatrixEvent;
@@ -91,7 +92,7 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
 
     public onCancel = (): void => {
         dis.dispatch({
-            action: "view_3pid_invite",
+            action: Action.View3pidInvite,
             event: null,
         });
     };

src/dispatcher/actions.ts

@@ -376,4 +376,9 @@ export enum Action {
      * Fired when the room loaded.
      */
     RoomLoaded = "room_loaded",
+
+    /**
+     * Opens right panel with 3pid invite information
+     */
+    View3pidInvite = "view_3pid_invite",
 }

src/stores/right-panel/action-handlers/View3pidInvite.ts

@@ -0,0 +1,37 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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 { ActionPayload } from "../../../dispatcher/payloads";
+import RightPanelStore from "../RightPanelStore";
+import { RightPanelPhases } from "../RightPanelStorePhases";
+
+/**
+ * Handle an Action.View3pidInvite action.
+ * Where payload has an event, open the right panel with 3pid room member info without clearing right panel history.
+ * Otherwise, 'close' the 3pid member info by displaying the room member list in the right panel.
+ * @param payload
+ * @param rightPanelStore store instance
+ */
+export const onView3pidInvite = (payload: ActionPayload, rightPanelStore: RightPanelStore): void => {
+    if (payload.event) {
+        rightPanelStore.pushCard({
+            phase: RightPanelPhases.Room3pidMemberInfo,
+            state: { memberInfoEvent: payload.event },
+        });
+    } else {
+        rightPanelStore.showOrHidePanel(RightPanelPhases.RoomMemberList);
+    }
+};

src/stores/right-panel/action-handlers/index.ts

@@ -0,0 +1,17 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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.
+*/
+
+export * from "./View3pidInvite";

test/stores/right-panel/action-handlers/View3pidInvite-test.ts

@@ -0,0 +1,58 @@
+/*
+Copyright 2023 The Matrix.org Foundation C.I.C.
+
+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 { MockedObject } from "jest-mock";
+import { EventType, MatrixEvent } from "matrix-js-sdk/src/matrix";
+
+import { Action } from "../../../../src/dispatcher/actions";
+import { onView3pidInvite } from "../../../../src/stores/right-panel/action-handlers";
+import RightPanelStore from "../../../../src/stores/right-panel/RightPanelStore";
+import { RightPanelPhases } from "../../../../src/stores/right-panel/RightPanelStorePhases";
+
+describe("onView3pidInvite()", () => {
+    let rightPanelStore!: MockedObject<RightPanelStore>;
+
+    beforeEach(() => {
+        rightPanelStore = {
+            pushCard: jest.fn(),
+            showOrHidePanel: jest.fn(),
+        } as unknown as MockedObject<RightPanelStore>;
+    });
+
+    it("should display room member list when payload has a falsy event", () => {
+        const payload = {
+            action: Action.View3pidInvite,
+        };
+        onView3pidInvite(payload, rightPanelStore);
+
+        expect(rightPanelStore.showOrHidePanel).toHaveBeenCalledWith(RightPanelPhases.RoomMemberList);
+        expect(rightPanelStore.pushCard).not.toHaveBeenCalled();
+    });
+
+    it("should push a 3pid member card on the right panel stack when payload has an event", () => {
+        const payload = {
+            action: Action.View3pidInvite,
+            event: new MatrixEvent({ type: EventType.RoomThirdPartyInvite }),
+        };
+        onView3pidInvite(payload, rightPanelStore);
+
+        expect(rightPanelStore.showOrHidePanel).not.toHaveBeenCalled();
+        expect(rightPanelStore.pushCard).toHaveBeenCalledWith({
+            phase: RightPanelPhases.Room3pidMemberInfo,
+            state: { memberInfoEvent: payload.event },
+        });
+    });
+});