Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2023-09-12 15:36:22 +01:00
parent 159deec937
commit 89fa7b4b39
No known key found for this signature in database
GPG key ID: A2B008A5F49F5D0D
6 changed files with 39 additions and 57 deletions

View file

@ -130,7 +130,6 @@ import { isNotUndefined } from "../../Typeguards";
import { CancelAskToJoinPayload } from "../../dispatcher/payloads/CancelAskToJoinPayload"; import { CancelAskToJoinPayload } from "../../dispatcher/payloads/CancelAskToJoinPayload";
import { SubmitAskToJoinPayload } from "../../dispatcher/payloads/SubmitAskToJoinPayload"; import { SubmitAskToJoinPayload } from "../../dispatcher/payloads/SubmitAskToJoinPayload";
import RightPanelStore from "../../stores/right-panel/RightPanelStore"; import RightPanelStore from "../../stores/right-panel/RightPanelStore";
import { setPhase } from "../../utils/room/setPhase";
const DEBUG = false; const DEBUG = false;
const PREVENT_MULTIPLE_JITSI_WITHIN = 30_000; const PREVENT_MULTIPLE_JITSI_WITHIN = 30_000;
@ -1268,14 +1267,16 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
]); ]);
} }
} else { } else {
setPhase(RightPanelPhases.RoomMemberList); RightPanelStore.instance.setPhase(RightPanelPhases.RoomMemberList);
} }
break; break;
case "view_3pid_invite": case "view_3pid_invite":
if (payload.event) { if (payload.event) {
setPhase(RightPanelPhases.Room3pidMemberInfo, { memberInfoEvent: payload.event }); RightPanelStore.instance.setPhase(RightPanelPhases.Room3pidMemberInfo, {
memberInfoEvent: payload.event,
});
} else { } else {
setPhase(RightPanelPhases.RoomMemberList); RightPanelStore.instance.setPhase(RightPanelPhases.RoomMemberList);
} }
break; break;
} }

View file

@ -669,13 +669,14 @@ export default class SpaceRoomView extends React.PureComponent<IProps, IState> {
return; return;
} }
if (payload.action !== Action.ViewUser && payload.action !== "view_3pid_invite") return;
/** /**
* The rest of the `ViewUser` and `view_3pid_invite` exists in the `<RoomView />` * The rest of the `ViewUser` and `view_3pid_invite` exists in the `<RoomView />`
* component. This deals specifically with showing the space members list * 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({ RightPanelStore.instance.setCard({
phase: RightPanelPhases.SpaceMemberList, phase: RightPanelPhases.SpaceMemberList,
state: { spaceId: this.props.space.roomId }, state: { spaceId: this.props.space.roomId },

View file

@ -40,7 +40,6 @@ import { SummarizedNotificationState } from "../../../stores/notifications/Summa
import PosthogTrackers from "../../../PosthogTrackers"; import PosthogTrackers from "../../../PosthogTrackers";
import { ButtonEvent } from "../elements/AccessibleButton"; import { ButtonEvent } from "../elements/AccessibleButton";
import { doesRoomOrThreadHaveUnreadMessages } from "../../../Unread"; import { doesRoomOrThreadHaveUnreadMessages } from "../../../Unread";
import { setPhase } from "../../../utils/room/setPhase";
const ROOM_INFO_PHASES = [ const ROOM_INFO_PHASES = [
RightPanelPhases.RoomSummary, RightPanelPhases.RoomSummary,
@ -210,27 +209,27 @@ export default class LegacyRoomHeaderButtons extends HeaderButtons<IProps> {
const currentPhase = RightPanelStore.instance.currentCard.phase; const currentPhase = RightPanelStore.instance.currentCard.phase;
if (currentPhase && ROOM_INFO_PHASES.includes(currentPhase)) { if (currentPhase && ROOM_INFO_PHASES.includes(currentPhase)) {
if (this.state.phase === currentPhase) { if (this.state.phase === currentPhase) {
setPhase(currentPhase); RightPanelStore.instance.setPhase(currentPhase);
} else { } else {
setPhase(currentPhase, RightPanelStore.instance.currentCard.state); RightPanelStore.instance.setPhase(currentPhase, RightPanelStore.instance.currentCard.state);
} }
} else { } else {
// This toggles for us, if needed // This toggles for us, if needed
setPhase(RightPanelPhases.RoomSummary); RightPanelStore.instance.setPhase(RightPanelPhases.RoomSummary);
} }
}; };
private onNotificationsClicked = (): void => { private onNotificationsClicked = (): void => {
// This toggles for us, if needed // This toggles for us, if needed
setPhase(RightPanelPhases.NotificationPanel); RightPanelStore.instance.setPhase(RightPanelPhases.NotificationPanel);
}; };
private onPinnedMessagesClicked = (): void => { private onPinnedMessagesClicked = (): void => {
// This toggles for us, if needed // This toggles for us, if needed
setPhase(RightPanelPhases.PinnedMessages); RightPanelStore.instance.setPhase(RightPanelPhases.PinnedMessages);
}; };
private onTimelineCardClicked = (): void => { private onTimelineCardClicked = (): void => {
setPhase(RightPanelPhases.Timeline); RightPanelStore.instance.setPhase(RightPanelPhases.Timeline);
}; };
private onThreadsPanelClicked = (ev: ButtonEvent): void => { private onThreadsPanelClicked = (ev: ButtonEvent): void => {

View file

@ -45,10 +45,10 @@ import { placeCall } from "../../../utils/room/placeCall";
import { useEncryptionStatus } from "../../../hooks/useEncryptionStatus"; import { useEncryptionStatus } from "../../../hooks/useEncryptionStatus";
import { E2EStatus } from "../../../utils/ShieldUtils"; import { E2EStatus } from "../../../utils/ShieldUtils";
import FacePile from "../elements/FacePile"; import FacePile from "../elements/FacePile";
import { setPhase } from "../../../utils/room/setPhase";
import { useRoomState } from "../../../hooks/useRoomState"; import { useRoomState } from "../../../hooks/useRoomState";
import RoomAvatar from "../avatars/RoomAvatar"; import RoomAvatar from "../avatars/RoomAvatar";
import { formatCount } from "../../../utils/FormattingUtils"; 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 * 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)" gap="var(--cpd-space-3x)"
className="mx_RoomHeader light-panel" className="mx_RoomHeader light-panel"
onClick={() => { onClick={() => {
setPhase(RightPanelPhases.RoomSummary); RightPanelStore.instance.setPhase(RightPanelPhases.RoomSummary);
}} }}
> >
<RoomAvatar room={room} size="40px" /> <RoomAvatar room={room} size="40px" />
@ -195,7 +195,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
indicator={notificationColorToIndicator(threadNotifications)} indicator={notificationColorToIndicator(threadNotifications)}
onClick={(evt) => { onClick={(evt) => {
evt.stopPropagation(); evt.stopPropagation();
setPhase(RightPanelPhases.ThreadPanel); RightPanelStore.instance.setPhase(RightPanelPhases.ThreadPanel);
}} }}
title={_t("common|threads")} title={_t("common|threads")}
> >
@ -207,7 +207,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
indicator={notificationColorToIndicator(globalNotificationState.color)} indicator={notificationColorToIndicator(globalNotificationState.color)}
onClick={(evt) => { onClick={(evt) => {
evt.stopPropagation(); evt.stopPropagation();
setPhase(RightPanelPhases.NotificationPanel); RightPanelStore.instance.setPhase(RightPanelPhases.NotificationPanel);
}} }}
title={_t("Notifications")} title={_t("Notifications")}
> >
@ -222,7 +222,7 @@ export default function RoomHeader({ room }: { room: Room }): JSX.Element {
weight="medium" weight="medium"
aria-label={_t("%(count)s members", { count: memberCount })} aria-label={_t("%(count)s members", { count: memberCount })}
onClick={(e: React.MouseEvent) => { onClick={(e: React.MouseEvent) => {
setPhase(RightPanelPhases.RoomMemberList); RightPanelStore.instance.setPhase(RightPanelPhases.RoomMemberList);
e.stopPropagation(); e.stopPropagation();
}} }}
> >

View file

@ -29,6 +29,7 @@ import {
convertToStatePanel, convertToStatePanel,
convertToStorePanel, convertToStorePanel,
IRightPanelCard, IRightPanelCard,
IRightPanelCardState,
IRightPanelForRoom, IRightPanelForRoom,
} from "./RightPanelStoreIPanelState"; } from "./RightPanelStoreIPanelState";
import { ActionPayload } from "../../dispatcher/payloads"; 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<IRightPanelCardState>): 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 { private loadCacheFromSettings(): void {
if (this.viewedRoomId) { if (this.viewedRoomId) {
const room = this.mxClient?.getRoom(this.viewedRoomId); const room = this.mxClient?.getRoom(this.viewedRoomId);

View file

@ -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<IRightPanelCardState>): 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);
}
}