imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix right panel data flow (#7811)

Browse source
This commit is contained in:
J. Ryan Stinnett 2022-02-16 11:19:28 +00:00 • committed by GitHub
parent 78524bddce
commit 0dc1355441
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 254 additions and 74 deletions
Download patch file Download diff file Expand all files Collapse all files

44
src/components/structures/RightPanel.tsx
View file

@ -1,6 +1,6 @@
/*
Copyright 2019 Michael Telatynski <7t3chguy@gmail.com>
Copyright 2015 - 2021 The Matrix.org Foundation C.I.C.
Copyright 2015 - 2022 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.
@ -23,7 +23,6 @@ import { MatrixEvent } from "matrix-js-sdk/src/models/event";
import { throttle } from 'lodash';
import dis from '../../dispatcher/dispatcher';
import GroupStore from '../../stores/GroupStore';
import { RightPanelPhases } from '../../stores/right-panel/RightPanelStorePhases';
import RightPanelStore from "../../stores/right-panel/RightPanelStore";
import MatrixClientContext from "../../contexts/MatrixClientContext";
@ -59,8 +58,7 @@ interface IProps {
}
interface IState {
phase: RightPanelPhases;
isUserPrivilegedInGroup?: boolean;
phase?: RightPanelPhases;
searchQuery: string;
cardState?: IRightPanelCardState;
}
@ -73,9 +71,6 @@ export default class RightPanel extends React.Component<IProps, IState> {
super(props, context);
this.state = {
cardState: RightPanelStore.instance.currentCard?.state,
phase: RightPanelStore.instance.currentCard?.phase,
isUserPrivilegedInGroup: null,
searchQuery: "",
};
}
@ -88,7 +83,6 @@ export default class RightPanel extends React.Component<IProps, IState> {
const cli = this.context;
cli.on("RoomState.members", this.onRoomStateMember);
RightPanelStore.instance.on(UPDATE_EVENT, this.onRightPanelStoreUpdate);
this.initGroupStore(this.props.groupId);
}
public componentWillUnmount(): void {
@ -96,32 +90,16 @@ export default class RightPanel extends React.Component<IProps, IState> {
this.context.removeListener("RoomState.members", this.onRoomStateMember);
}
RightPanelStore.instance.off(UPDATE_EVENT, this.onRightPanelStoreUpdate);
this.unregisterGroupStore();
}
// TODO: [REACT-WARNING] Replace with appropriate lifecycle event
public UNSAFE_componentWillReceiveProps(newProps: IProps): void { // eslint-disable-line
if (newProps.groupId !== this.props.groupId) {
this.unregisterGroupStore();
this.initGroupStore(newProps.groupId);
}
public static getDerivedStateFromProps(props: IProps): Partial<IState> {
const currentCard = RightPanelStore.instance.currentCardForRoom(props.room.roomId);
return {
cardState: currentCard.state,
phase: currentCard.phase,
};
}
private initGroupStore(groupId: string) {
if (!groupId) return;
GroupStore.registerListener(groupId, this.onGroupStoreUpdated);
}
private unregisterGroupStore() {
GroupStore.unregisterListener(this.onGroupStoreUpdated);
}
private onGroupStoreUpdated = () => {
this.setState({
isUserPrivilegedInGroup: GroupStore.isUserPrivileged(this.props.groupId),
});
};
private onRoomStateMember = (ev: MatrixEvent, state: RoomState, member: RoomMember) => {
if (!this.props.room || member.roomId !== this.props.room.roomId) {
return;
@ -139,10 +117,10 @@ export default class RightPanel extends React.Component<IProps, IState> {
};
private onRightPanelStoreUpdate = () => {
const currentPanel = RightPanelStore.instance.currentCard;
const currentCard = RightPanelStore.instance.currentCardForRoom(this.props.room.roomId);
this.setState({
cardState: currentPanel.state,
phase: currentPanel.phase,
cardState: currentCard.state,
phase: currentCard.phase,
});
};

7
src/components/structures/RoomView.tsx
View file

@ -248,7 +248,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
canPeek: false,
showApps: false,
isPeeking: false,
showRightPanel: RightPanelStore.instance.isOpenForRoom,
showRightPanel: false,
joining: false,
atEndOfLiveTimeline: true,
atEndOfLiveTimelineInit: false,
@ -342,7 +342,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
// Show chat in right panel when a widget is maximised
RightPanelStore.instance.setCard({ phase: RightPanelPhases.Timeline });
} else if (
RightPanelStore.instance.isOpenForRoom &&
RightPanelStore.instance.isOpen &&
RightPanelStore.instance.roomPhaseHistory.some(card => (card.phase === RightPanelPhases.Timeline))
) {
// hide chat in right panel when the widget is minimized
@ -411,6 +411,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
showDisplaynameChanges: SettingsStore.getValue("showDisplaynameChanges", roomId),
wasContextSwitch: RoomViewStore.getWasContextSwitch(),
initialEventId: null, // default to clearing this, will get set later in the method if needed
showRightPanel: RightPanelStore.instance.isOpenForRoom(roomId),
};
const initialEventId = RoomViewStore.getInitialEventId();
@ -782,7 +783,7 @@ export class RoomView extends React.Component<IRoomProps, IRoomState> {
private onRightPanelStoreUpdate = () => {
this.setState({
showRightPanel: RightPanelStore.instance.isOpenForRoom,
showRightPanel: RightPanelStore.instance.isOpenForRoom(this.state.roomId),
});
};

4
src/components/structures/SpaceRoomView.tsx
View file

@ -809,7 +809,7 @@ export default class SpaceRoomView extends React.PureComponent<IProps, IState> {
this.state = {
phase,
showRightPanel: RightPanelStore.instance.isOpenForRoom,
showRightPanel: RightPanelStore.instance.isOpenForRoom(this.props.space.roomId),
myMembership: this.props.space.getMyMembership(),
};
@ -832,7 +832,7 @@ export default class SpaceRoomView extends React.PureComponent<IProps, IState> {
private onRightPanelStoreUpdate = () => {
this.setState({
showRightPanel: RightPanelStore.instance.isOpenForRoom,
showRightPanel: RightPanelStore.instance.isOpenForRoom(this.props.space.roomId),
});
};