Skip to content

Commit 11b0cc8

Browse files
committed
Merge branch 'develop' into luke/feature-tag-panel-tile-context-menu
2 parents d47c9d8 + e671472 commit 11b0cc8

6 files changed

Lines changed: 139 additions & 315 deletions

File tree

src/components/structures/BottomLeftMenu.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -167,7 +167,6 @@ module.exports = React.createClass({
167167
const StartChatButton = sdk.getComponent('elements.StartChatButton');
168168
const RoomDirectoryButton = sdk.getComponent('elements.RoomDirectoryButton');
169169
const CreateRoomButton = sdk.getComponent('elements.CreateRoomButton');
170-
const GroupsButton = sdk.getComponent('elements.GroupsButton');
171170
const SettingsButton = sdk.getComponent('elements.SettingsButton');
172171

173172
return (
@@ -183,7 +182,6 @@ module.exports = React.createClass({
183182
<div ref={this._collectCreateRoomButton}>
184183
<CreateRoomButton tooltip={true} />
185184
</div>
186-
<GroupsButton tooltip={true} />
187185
<span className="mx_BottomLeftMenu_settings">
188186
<SettingsButton tooltip={true} />
189187
</span>

src/components/structures/LeftPanel.js

Lines changed: 75 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -17,22 +17,31 @@ limitations under the License.
1717
'use strict';
1818

1919
import React from 'react';
20+
import PropTypes from 'prop-types';
2021
import classNames from 'classnames';
22+
import { DragDropContext } from 'react-beautiful-dnd';
23+
import { MatrixClient } from 'matrix-js-sdk';
2124
import { KeyCode } from 'matrix-react-sdk/lib/Keyboard';
2225
import sdk from 'matrix-react-sdk';
2326
import dis from 'matrix-react-sdk/lib/dispatcher';
24-
import MatrixClientPeg from 'matrix-react-sdk/lib/MatrixClientPeg';
25-
import CallHandler from 'matrix-react-sdk/lib/CallHandler';
26-
import AccessibleButton from 'matrix-react-sdk/lib/components/views/elements/AccessibleButton';
2727
import VectorConferenceHandler from '../../VectorConferenceHandler';
2828

29+
import SettingsStore from 'matrix-react-sdk/lib/settings/SettingsStore';
30+
import TagOrderActions from 'matrix-react-sdk/lib/actions/TagOrderActions';
31+
import RoomListActions from 'matrix-react-sdk/lib/actions/RoomListActions';
32+
33+
2934
var LeftPanel = React.createClass({
3035
displayName: 'LeftPanel',
3136

3237
// NB. If you add props, don't forget to update
3338
// shouldComponentUpdate!
3439
propTypes: {
35-
collapsed: React.PropTypes.bool.isRequired,
40+
collapsed: PropTypes.bool.isRequired,
41+
},
42+
43+
contextTypes: {
44+
matrixClient: PropTypes.instanceOf(MatrixClient),
3645
},
3746

3847
getInitialState: function() {
@@ -161,13 +170,59 @@ var LeftPanel = React.createClass({
161170
this.setState({ searchFilter: term });
162171
},
163172

173+
onDragEnd: function(result) {
174+
// Dragged to an invalid destination, not onto a droppable
175+
if (!result.destination) {
176+
return;
177+
}
178+
179+
const dest = result.destination.droppableId;
180+
181+
if (dest === 'tag-panel-droppable') {
182+
// Dispatch synchronously so that the TagPanel receives an
183+
// optimistic update from TagOrderStore before the previous
184+
// state is shown.
185+
dis.dispatch(TagOrderActions.moveTag(
186+
this.context.matrixClient,
187+
result.draggableId,
188+
result.destination.index,
189+
), true);
190+
} else {
191+
this.onRoomTileEndDrag(result);
192+
}
193+
},
194+
195+
onRoomTileEndDrag: function(result) {
196+
let newTag = result.destination.droppableId.split('_')[1];
197+
let prevTag = result.source.droppableId.split('_')[1];
198+
if (newTag === 'undefined') newTag = undefined;
199+
if (prevTag === 'undefined') prevTag = undefined;
200+
201+
const roomId = result.draggableId.split('_')[1];
202+
203+
const oldIndex = result.source.index;
204+
const newIndex = result.destination.index;
205+
206+
dis.dispatch(RoomListActions.tagRoom(
207+
this.context.matrixClient,
208+
this.context.matrixClient.getRoom(roomId),
209+
prevTag, newTag,
210+
oldIndex, newIndex,
211+
), true);
212+
},
213+
214+
collectRoomList: function(ref) {
215+
this._roomList = ref;
216+
},
217+
164218
render: function() {
165219
const RoomList = sdk.getComponent('rooms.RoomList');
220+
const TagPanel = sdk.getComponent('structures.TagPanel');
166221
const BottomLeftMenu = sdk.getComponent('structures.BottomLeftMenu');
167222
const CallPreview = sdk.getComponent('voip.CallPreview');
168223

169224
let topBox;
170-
if (MatrixClientPeg.get().isGuest()) {
225+
if (this.context.matrixClient.isGuest()) {
171226
const LoginBox = sdk.getComponent('structures.LoginBox');
172227
topBox = <LoginBox collapsed={ this.props.collapsed }/>;
173228
} else {
@@ -184,15 +239,21 @@ var LeftPanel = React.createClass({
184239
);
185240

186241
return (
187-
<aside className={classes} onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }>
188-
{ topBox }
189-
<CallPreview ConferenceHandler={VectorConferenceHandler} />
190-
<RoomList
191-
collapsed={this.props.collapsed}
192-
searchFilter={this.state.searchFilter}
193-
ConferenceHandler={VectorConferenceHandler} />
194-
<BottomLeftMenu collapsed={this.props.collapsed}/>
195-
</aside>
242+
<DragDropContext onDragEnd={this.onDragEnd}>
243+
<div className="mx_LeftPanel_container">
244+
{ SettingsStore.isFeatureEnabled("feature_tag_panel") ? <TagPanel /> : <div /> }
245+
<aside className={classes} onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }>
246+
{ topBox }
247+
<CallPreview ConferenceHandler={VectorConferenceHandler} />
248+
<RoomList
249+
ref={this.collectRoomList}
250+
collapsed={this.props.collapsed}
251+
searchFilter={this.state.searchFilter}
252+
ConferenceHandler={VectorConferenceHandler} />
253+
<BottomLeftMenu collapsed={this.props.collapsed}/>
254+
</aside>
255+
</div>
256+
</DragDropContext>
196257
);
197258
}
198259
});

0 commit comments

Comments
 (0)