Matrix/element-web-Github
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2024-11-17 05:55:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

Break the right panel completely

Browse Source 
This lays a foundation for redirecting all the traffic through the new store, but for now the core parts of the app need to stop caring if the right panel is open.
This commit is contained in:
Travis Ralston 2019-12-05 17:47:18 -07:00
parent 5253f29928
commit 6e882251bd
11 changed files with 52 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/structures/GroupView.js
View File

@ -38,6 +38,7 @@ import { showGroupAddRoomDialog } from '../../GroupAddressPicker';
import {makeGroupPermalink, makeUserPermalink} from "../../utils/permalinks/Permalinks";
import {Group} from "matrix-js-sdk";
import {allSettled, sleep} from "../../utils/promise";
import RightPanelStore from "../../stores/RightPanelStore";
const LONG_DESC_PLACEHOLDER = _td(
`<h1>HTML for your community's page</h1>
@ -1298,7 +1299,9 @@ export default createReactClass({
);
}
const rightPanel = !this.props.collapsedRhs ? <RightPanel groupId={this.props.groupId} /> : undefined;
const rightPanel = !RightPanelStore.getSharedInstance().isOpenForGroup
? <RightPanel groupId={this.props.groupId} />
: undefined;
const headerClasses = {
"mx_GroupView_header": true,
@ -1326,9 +1329,9 @@ export default createReactClass({
<div className="mx_GroupView_header_rightCol">
{ rightButtons }
</div>
<GroupHeaderButtons collapsedRhs={this.props.collapsedRhs} />
<GroupHeaderButtons />
</div>
<MainSplit collapsedRhs={this.props.collapsedRhs} panel={rightPanel}>
<MainSplit panel={rightPanel}>
<GeminiScrollbarWrapper className="mx_GroupView_body">
{ this._getMembershipSection() }
{ this._getGroupSection() }

3
src/components/structures/LoggedInView.js
View File

@ -70,7 +70,6 @@ const LoggedInView = createReactClass({
// Called with the credentials of a registered user (if they were a ROU that
// transitioned to PWLU)
onRegistered: PropTypes.func,
collapsedRhs: PropTypes.bool,
// Used by the RoomView to handle joining rooms
viaServers: PropTypes.arrayOf(PropTypes.string),
@ -552,7 +551,6 @@ const LoggedInView = createReactClass({
eventPixelOffset={this.props.initialEventPixelOffset}
key={this.props.currentRoomId || 'roomview'}
disabled={this.props.middleDisabled}
collapsedRhs={this.props.collapsedRhs}
ConferenceHandler={this.props.ConferenceHandler}
resizeNotifier={this.props.resizeNotifier}
/>;
@ -583,7 +581,6 @@ const LoggedInView = createReactClass({
pageElement = <GroupView
groupId={this.props.currentGroupId}
isNew={this.props.currentGroupIsNew}
collapsedRhs={this.props.collapsedRhs}
/>;
break;
}

4
src/components/structures/MainSplit.js
View File

@ -62,7 +62,7 @@ export default class MainSplit extends React.Component {
}
componentDidMount() {
if (this.props.panel && !this.props.collapsedRhs) {
if (this.props.panel) {
this._createResizer();
}
}
@ -80,6 +80,8 @@ export default class MainSplit extends React.Component {
const wasPanelSet = this.props.panel && !prevProps.panel;
const wasPanelCleared = !this.props.panel && prevProps.panel;
// TODO: TravisR - fix this logic
if (this.resizeContainer && (wasExpanded || wasPanelSet)) {
// The resizer can only be created when **both** expanded and the panel is
// set. Once both are true, the container ref will mount, which is required

15
src/components/structures/MatrixChat.js
View File

@ -175,7 +175,6 @@ export default createReactClass({
viewUserId: null,
// this is persisted as mx_lhs_size, loaded in LoggedInView
collapseLhs: false,
collapsedRhs: window.localStorage.getItem("mx_rhs_collapsed") === "true",
leftDisabled: false,
middleDisabled: false,
rightDisabled: false,
@ -657,18 +656,6 @@ export default createReactClass({
collapseLhs: false,
});
break;
case 'hide_right_panel':
window.localStorage.setItem("mx_rhs_collapsed", true);
this.setState({
collapsedRhs: true,
});
break;
case 'show_right_panel':
window.localStorage.setItem("mx_rhs_collapsed", false);
this.setState({
collapsedRhs: false,
});
break;
case 'panel_disable': {
this.setState({
leftDisabled: payload.leftDisabled || payload.sideDisabled || false,
@ -1245,7 +1232,6 @@ export default createReactClass({
view: VIEWS.LOGIN,
ready: false,
collapseLhs: false,
collapsedRhs: false,
currentRoomId: null,
});
this.subTitleStatus = '';
@ -1261,7 +1247,6 @@ export default createReactClass({
view: VIEWS.SOFT_LOGOUT,
ready: false,
collapseLhs: false,
collapsedRhs: false,
currentRoomId: null,
});
this.subTitleStatus = '';

2
src/components/structures/RightPanel.js
View File

@ -28,7 +28,7 @@ import RateLimitedFunc from '../../ratelimitedfunc';
import { showGroupInviteDialog, showGroupAddRoomDialog } from '../../GroupAddressPicker';
import GroupStore from '../../stores/GroupStore';
import SettingsStore from "../../settings/SettingsStore";
import {RIGHT_PANEL_PHASES} from "../../stores/RightPanelStore";
import {RIGHT_PANEL_PHASES} from "../../stores/RightPanelStorePhases";
export default class RightPanel extends React.Component {
static get propTypes() {

18
src/components/structures/RoomView.js
View File

@ -54,6 +54,7 @@ import WidgetEchoStore from '../../stores/WidgetEchoStore';
import SettingsStore, {SettingLevel} from "../../settings/SettingsStore";
import WidgetUtils from '../../utils/WidgetUtils';
import AccessibleButton from "../views/elements/AccessibleButton";
import RightPanelStore from "../../stores/RightPanelStore";
const DEBUG = false;
let debuglog = function() {};
@ -98,9 +99,6 @@ module.exports = createReactClass({
// * invited us to the room
oobData: PropTypes.object,
// is the RightPanel collapsed?
collapsedRhs: PropTypes.bool,
// Servers the RoomView can use to try and assist joins
viaServers: PropTypes.arrayOf(PropTypes.string),
},
@ -1714,7 +1712,7 @@ module.exports = createReactClass({
let aux = null;
let previewBar;
let hideCancel = false;
let hideRightPanel = false;
let forceHideRightPanel = false;
if (this.state.forwardingEvent !== null) {
aux = <ForwardMessage onCancelClick={this.onCancelClick} />;
} else if (this.state.searching) {
@ -1760,7 +1758,7 @@ module.exports = createReactClass({
</div>
);
} else {
hideRightPanel = true;
forceHideRightPanel = true;
}
} else if (hiddenHighlightCount > 0) {
aux = (
@ -1947,9 +1945,11 @@ module.exports = createReactClass({
},
);
const rightPanel = !hideRightPanel && this.state.room &&
<RightPanel roomId={this.state.room.roomId} resizeNotifier={this.props.resizeNotifier} />;
const collapsedRhs = hideRightPanel || this.props.collapsedRhs;
const showRightPanel = !forceHideRightPanel && this.state.room
&& RightPanelStore.getSharedInstance().isOpenForRoom;
const rightPanel = showRightPanel
? <RightPanel roomId={this.state.room.roomId} resizeNotifier={this.props.resizeNotifier} />
: null;
return (
<main className={"mx_RoomView" + (inCall ? " mx_RoomView_inCall" : "")} ref="roomView">
@ -1957,7 +1957,6 @@ module.exports = createReactClass({
<RoomHeader ref="header" room={this.state.room} searchInfo={searchInfo}
oobData={this.props.oobData}
inRoom={myMembership === 'join'}
collapsedRhs={collapsedRhs}
onSearchClick={this.onSearchClick}
onSettingsClick={this.onSettingsClick}
onPinnedClick={this.onPinnedClick}
@ -1968,7 +1967,6 @@ module.exports = createReactClass({
/>
<MainSplit
panel={rightPanel}
collapsedRhs={collapsedRhs}
resizeNotifier={this.props.resizeNotifier}
>
<div className={fadableSectionClasses}>

2
src/components/views/right_panel/RoomHeaderButtons.js
View File

@ -45,8 +45,6 @@ export default class RoomHeaderButtons extends HeaderButtons {
} else {
this.setPhase(RightPanel.Phase.RoomMemberList);
}
} else if (payload.action === "view_room" && !this.props.collapsedRhs) {
this.setPhase(RightPanel.Phase.RoomMemberList);
} else if (payload.action === "view_3pid_invite") {
if (payload.event) {
this.setPhase(RightPanel.Phase.Room3pidMemberInfo, {event: payload.event});

3
src/components/views/rooms/RoomHeader.js
View File

@ -39,7 +39,6 @@ module.exports = createReactClass({
room: PropTypes.object,
oobData: PropTypes.object,
inRoom: PropTypes.bool,
collapsedRhs: PropTypes.bool,
onSettingsClick: PropTypes.func,
onPinnedClick: PropTypes.func,
onSearchClick: PropTypes.func,
@ -304,7 +303,7 @@ module.exports = createReactClass({
{ topicElement }
{ cancelButton }
{ rightRow }
<RoomHeaderButtons collapsedRhs={this.props.collapsedRhs} />
<RoomHeaderButtons />
</div>
</div>
);

3
src/settings/Settings.js
View File

@ -25,8 +25,7 @@ import {
import CustomStatusController from "./controllers/CustomStatusController";
import ThemeController from './controllers/ThemeController';
import ReloadOnChangeController from "./controllers/ReloadOnChangeController";
import RightPanel from "../components/structures/RightPanel";
import {RIGHT_PANEL_PHASES} from "../stores/RightPanelStore";
import {RIGHT_PANEL_PHASES} from "../stores/RightPanelStorePhases";
// These are just a bunch of helper arrays to avoid copy/pasting a bunch of times
const LEVELS_ROOM_SETTINGS = ['device', 'room-device', 'room-account', 'account', 'config'];

16
src/stores/RightPanelStore.js
View File

@ -17,6 +17,7 @@ limitations under the License.
import dis from '../dispatcher';
import {Store} from 'flux/utils';
import SettingsStore, {SettingLevel} from "../settings/SettingsStore";
import {RIGHT_PANEL_PHASES} from "./RightPanelStorePhases";
const INITIAL_STATE = {
// Whether or not to show the right panel at all. We split out rooms and groups
@ -29,21 +30,6 @@ const INITIAL_STATE = {
lastGroupPhase: SettingsStore.getValue("lastRightPanelPhaseForGroup"),
};
export const RIGHT_PANEL_PHASES = Object.freeze({
// Room stuff
RoomMemberList: 'RoomMemberList',
FilePanel: 'FilePanel',
NotificationPanel: 'NotificationPanel',
RoomMemberInfo: 'RoomMemberInfo',
Room3pidMemberInfo: 'Room3pidMemberInfo',
// Group stuff
GroupMemberList: 'GroupMemberList',
GroupRoomList: 'GroupRoomList',
GroupRoomInfo: 'GroupRoomInfo',
GroupMemberInfo: 'GroupMemberInfo',
});
const GROUP_PHASES = Object.keys(RIGHT_PANEL_PHASES).filter(k => k.startsWith("Group"));
/**

31
src/stores/RightPanelStorePhases.js Normal file
View File

@ -0,0 +1,31 @@
/*
Copyright 2019 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.
*/
// These are in their own file because of circular imports being a problem.
export const RIGHT_PANEL_PHASES = Object.freeze({
// Room stuff
RoomMemberList: 'RoomMemberList',
FilePanel: 'FilePanel',
NotificationPanel: 'NotificationPanel',
RoomMemberInfo: 'RoomMemberInfo',
Room3pidMemberInfo: 'Room3pidMemberInfo',
// Group stuff
GroupMemberList: 'GroupMemberList',
GroupRoomList: 'GroupRoomList',
GroupRoomInfo: 'GroupRoomInfo',
GroupMemberInfo: 'GroupMemberInfo',
});