diff --git a/src/components/structures/RoomView.tsx b/src/components/structures/RoomView.tsx index 7c6fdf906c..bb2e9e502c 100644 --- a/src/components/structures/RoomView.tsx +++ b/src/components/structures/RoomView.tsx @@ -130,7 +130,6 @@ import { isNotUndefined } from "../../Typeguards"; import { CancelAskToJoinPayload } from "../../dispatcher/payloads/CancelAskToJoinPayload"; import { SubmitAskToJoinPayload } from "../../dispatcher/payloads/SubmitAskToJoinPayload"; import RightPanelStore from "../../stores/right-panel/RightPanelStore"; -import { setPhase } from "../../utils/room/setPhase"; const DEBUG = false; const PREVENT_MULTIPLE_JITSI_WITHIN = 30_000; @@ -1268,14 +1267,16 @@ export class RoomView extends React.Component { ]); } } else { - setPhase(RightPanelPhases.RoomMemberList); + RightPanelStore.instance.setPhase(RightPanelPhases.RoomMemberList); } break; case "view_3pid_invite": if (payload.event) { - setPhase(RightPanelPhases.Room3pidMemberInfo, { memberInfoEvent: payload.event }); + RightPanelStore.instance.setPhase(RightPanelPhases.Room3pidMemberInfo, { + memberInfoEvent: payload.event, + }); } else { - setPhase(RightPanelPhases.RoomMemberList); + RightPanelStore.instance.setPhase(RightPanelPhases.RoomMemberList); } break; } diff --git a/src/components/structures/SpaceRoomView.tsx b/src/components/structures/SpaceRoomView.tsx index e502430ea2..5ae9bec82b 100644 --- a/src/components/structures/SpaceRoomView.tsx +++ b/src/components/structures/SpaceRoomView.tsx @@ -669,13 +669,14 @@ export default class SpaceRoomView extends React.PureComponent { return; } - if (payload.action !== Action.ViewUser && payload.action !== "view_3pid_invite") return; - /** * The rest of the `ViewUser` and `view_3pid_invite` exists in the `` * component. This deals specifically with showing the space members list */ - if (!payload.member && !payload.event) { + if ( + (payload.action === Action.ViewUser && !payload.member) || + (payload.action === "view_3pid_invite" && payload.event === null) + ) { RightPanelStore.instance.setCard({ phase: RightPanelPhases.SpaceMemberList, state: { spaceId: this.props.space.roomId }, diff --git a/src/components/views/right_panel/LegacyRoomHeaderButtons.tsx b/src/components/views/right_panel/LegacyRoomHeaderButtons.tsx index 5364e30b6c..61594eb66d 100644 --- a/src/components/views/right_panel/LegacyRoomHeaderButtons.tsx +++ b/src/components/views/right_panel/LegacyRoomHeaderButtons.tsx @@ -40,7 +40,6 @@ import { SummarizedNotificationState } from "../../../stores/notifications/Summa import PosthogTrackers from "../../../PosthogTrackers"; import { ButtonEvent } from "../elements/AccessibleButton"; import { doesRoomOrThreadHaveUnreadMessages } from "../../../Unread"; -import { setPhase } from "../../../utils/room/setPhase"; const ROOM_INFO_PHASES = [ RightPanelPhases.RoomSummary, @@ -210,27 +209,27 @@ export default class LegacyRoomHeaderButtons extends HeaderButtons { const currentPhase = RightPanelStore.instance.currentCard.phase; if (currentPhase && ROOM_INFO_PHASES.includes(currentPhase)) { if (this.state.phase === currentPhase) { - setPhase(currentPhase); + RightPanelStore.instance.setPhase(currentPhase); } else { - setPhase(currentPhase, RightPanelStore.instance.currentCard.state); + RightPanelStore.instance.setPhase(currentPhase, RightPanelStore.instance.currentCard.state); } } else { // This toggles for us, if needed - setPhase(RightPanelPhases.RoomSummary); + RightPanelStore.instance.setPhase(RightPanelPhases.RoomSummary); } }; private onNotificationsClicked = (): void => { // This toggles for us, if needed - setPhase(RightPanelPhases.NotificationPanel); + RightPanelStore.instance.setPhase(RightPanelPhases.NotificationPanel); }; private onPinnedMessagesClicked = (): void => { // This toggles for us, if needed - setPhase(RightPanelPhases.PinnedMessages); + RightPanelStore.instance.setPhase(RightPanelPhases.PinnedMessages); }; private onTimelineCardClicked = (): void => { - setPhase(RightPanelPhases.Timeline); + RightPanelStore.instance.setPhase(RightPanelPhases.Timeline); }; private onThreadsPanelClicked = (ev: ButtonEvent): void => { diff --git a/src/components/views/rooms/RoomHeader.tsx b/src/components/views/rooms/RoomHeader.tsx index eadbca94ae..7b690d8e28 100644 --- a/src/components/views/rooms/RoomHeader.tsx +++ b/src/components/views/rooms/RoomHeader.tsx @@ -45,10 +45,10 @@ import { placeCall } from "../../../utils/room/placeCall"; import { useEncryptionStatus } from "../../../hooks/useEncryptionStatus"; import { E2EStatus } from "../../../utils/ShieldUtils"; import FacePile from "../elements/FacePile"; -import { setPhase } from "../../../utils/room/setPhase"; import { useRoomState } from "../../../hooks/useRoomState"; import RoomAvatar from "../avatars/RoomAvatar"; import { formatCount } from "../../../utils/FormattingUtils"; +import RightPanelStore from "../../../stores/right-panel/RightPanelStore"; /** * A helper to transform a notification color to the what the Compound Icon Button @@ -107,7 +107,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element { gap="var(--cpd-space-3x)" className="mx_RoomHeader light-panel" onClick={() => { - setPhase(RightPanelPhases.RoomSummary); + RightPanelStore.instance.setPhase(RightPanelPhases.RoomSummary); }} > @@ -195,7 +195,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element { indicator={notificationColorToIndicator(threadNotifications)} onClick={(evt) => { evt.stopPropagation(); - setPhase(RightPanelPhases.ThreadPanel); + RightPanelStore.instance.setPhase(RightPanelPhases.ThreadPanel); }} title={_t("common|threads")} > @@ -207,7 +207,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element { indicator={notificationColorToIndicator(globalNotificationState.color)} onClick={(evt) => { evt.stopPropagation(); - setPhase(RightPanelPhases.NotificationPanel); + RightPanelStore.instance.setPhase(RightPanelPhases.NotificationPanel); }} title={_t("Notifications")} > @@ -222,7 +222,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element { weight="medium" aria-label={_t("%(count)s members", { count: memberCount })} onClick={(e: React.MouseEvent) => { - setPhase(RightPanelPhases.RoomMemberList); + RightPanelStore.instance.setPhase(RightPanelPhases.RoomMemberList); e.stopPropagation(); }} > diff --git a/src/stores/right-panel/RightPanelStore.ts b/src/stores/right-panel/RightPanelStore.ts index 60e16d3bbd..d975bd9a3b 100644 --- a/src/stores/right-panel/RightPanelStore.ts +++ b/src/stores/right-panel/RightPanelStore.ts @@ -29,6 +29,7 @@ import { convertToStatePanel, convertToStorePanel, IRightPanelCard, + IRightPanelCardState, IRightPanelForRoom, } from "./RightPanelStoreIPanelState"; import { ActionPayload } from "../../dispatcher/payloads"; @@ -226,6 +227,24 @@ export default class RightPanelStore extends ReadyWatchingStore { } } + /** + * Helper to show a right panel phase. + * If the UI is already showing that phase, the right panel will be hidden. + * + * Calling the same phase twice with a different state will update the current + * phase and push the old state in the right panel history. + * @param phase The right panel phase. + * @param cardState The state within the phase. + */ + public setPhase(phase: RightPanelPhases, cardState?: Partial): void { + if (this.currentCard.phase == phase && !cardState && this.isOpen) { + this.togglePanel(null); + } else { + this.setCard({ phase, state: cardState }); + if (!this.isOpen) this.togglePanel(null); + } + } + private loadCacheFromSettings(): void { if (this.viewedRoomId) { const room = this.mxClient?.getRoom(this.viewedRoomId); diff --git a/src/utils/room/setPhase.ts b/src/utils/room/setPhase.ts deleted file mode 100644 index 2d2941286c..0000000000 --- a/src/utils/room/setPhase.ts +++ /dev/null @@ -1,38 +0,0 @@ -/* -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 RightPanelStore from "../../stores/right-panel/RightPanelStore"; -import { IRightPanelCardState } from "../../stores/right-panel/RightPanelStoreIPanelState"; -import { RightPanelPhases } from "../../stores/right-panel/RightPanelStorePhases"; - -/** - * Helper to show a right panel phase. - * If the UI is already showing that phase, the right panel will be hidden. - * - * Calling the same phase twice with a different state will update the current - * phase and push the old state in the right panel history. - * @param phase The right panel phase. - * @param cardState The state within the phase. - */ -export function setPhase(phase: RightPanelPhases, cardState?: Partial): void { - const rps = RightPanelStore.instance; - if (rps.currentCard.phase == phase && !cardState && rps.isOpen) { - rps.togglePanel(null); - } else { - RightPanelStore.instance.setCard({ phase, state: cardState }); - if (!rps.isOpen) rps.togglePanel(null); - } -}