Skip to content

Commit b3bb2d2

Browse files
committed
Merge branch 'develop' into luke/fix-scrollbars-on-jump-to-first
2 parents 85c0b8d + 8c1d2a4 commit b3bb2d2

File tree

11 files changed

+311
-325
lines changed

11 files changed

+311
-325
lines changed

docs/translating.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@ Head to the explanations under Steb 2b
3535
## Step 2b: Adding a new language
3636

3737
1. Go to one of the projects listed https://translate.riot.im/projects/riot-web/
38-
2. Click the ``Start new language`` button at the bottom
38+
2. Click the ``Start new translation`` button at the bottom
3939
3. Select a language
4040
4. Start translating like in 2a.3
4141
5. Repeat these steps for the other projects which are listed at the link of step 2b.1

src/components/structures/LeftPanel.js

Lines changed: 86 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 {
@@ -183,16 +238,33 @@ var LeftPanel = React.createClass({
183238
}
184239
);
185240

241+
const tagPanelEnabled = SettingsStore.isFeatureEnabled("feature_tag_panel");
242+
const tagPanel = tagPanelEnabled ? <TagPanel /> : <div />;
243+
244+
const containerClasses = classNames(
245+
"mx_LeftPanel_container",
246+
{
247+
"mx_LeftPanel_container_collapsed": this.props.collapsed,
248+
"mx_LeftPanel_container_hasTagPanel": tagPanelEnabled,
249+
},
250+
);
251+
186252
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>
253+
<DragDropContext onDragEnd={this.onDragEnd}>
254+
<div className={containerClasses}>
255+
{ tagPanel }
256+
<aside className={classes} onKeyDown={ this._onKeyDown } onFocus={ this._onFocus } onBlur={ this._onBlur }>
257+
{ topBox }
258+
<CallPreview ConferenceHandler={VectorConferenceHandler} />
259+
<RoomList
260+
ref={this.collectRoomList}
261+
collapsed={this.props.collapsed}
262+
searchFilter={this.state.searchFilter}
263+
ConferenceHandler={VectorConferenceHandler} />
264+
<BottomLeftMenu collapsed={this.props.collapsed}/>
265+
</aside>
266+
</div>
267+
</DragDropContext>
196268
);
197269
}
198270
});

0 commit comments

Comments
 (0)