Break the right panel completely

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.

src/components/structures/GroupView.js

@@ -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() }

src/components/structures/LoggedInView.js

@@ -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;
         }

src/components/structures/MainSplit.js

@@ -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

src/components/structures/MatrixChat.js

@@ -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 = '';

src/components/structures/RightPanel.js

@@ -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() {

src/components/structures/RoomView.js

@@ -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 &&
+        const showRightPanel = !forceHideRightPanel && this.state.room
-            <RightPanel roomId={this.state.room.roomId} resizeNotifier={this.props.resizeNotifier} />;
+            && RightPanelStore.getSharedInstance().isOpenForRoom;
-        const collapsedRhs = hideRightPanel || this.props.collapsedRhs;
+        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}>

src/components/views/right_panel/RoomHeaderButtons.js

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

src/components/views/rooms/RoomHeader.js

@@ -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>
         );

src/settings/Settings.js

@@ -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/RightPanelStorePhases";
-import {RIGHT_PANEL_PHASES} from "../stores/RightPanelStore";
 
 // 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'];

src/stores/RightPanelStore.js

@@ -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"));
 
 /**

src/stores/RightPanelStorePhases.js

@@ -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',
+});