From 57804f4e02995b0a4b895a5e18f6d03063e592f1 Mon Sep 17 00:00:00 2001 From: David Baker Date: Fri, 9 Sep 2016 16:15:45 +0100 Subject: [PATCH] Support for common rooms in MemberInfo Renames RoomDNDView to DNDRoomTile which now provides a separate DNDRoomTile component rather than clobberring RoomTile, so we can use a draggable one where we want a draggable one and a non-draggable one where we don't want it to be draggable. RoomTile main is still polluted with DND stuff, but is now optional. Remove BottomLeftMenuTile because it was no longer used in the bottom left menu. Just include the equivalent markup directly in the one place we now use it (in MemberTile in react-sdk). --- src/component-index.js | 3 +- src/components/structures/BottomLeftMenu.js | 1 - src/components/structures/RoomSubList.js | 4 +- .../views/rooms/BottomLeftMenuTile.js | 57 ------------------- .../rooms/{RoomDNDView.js => DNDRoomTile.js} | 8 ++- .../views/rooms/MemberInfo.css | 9 +++ .../matrix-react-sdk/views/rooms/RoomTile.css | 4 ++ 7 files changed, 23 insertions(+), 63 deletions(-) delete mode 100644 src/components/views/rooms/BottomLeftMenuTile.js rename src/components/views/rooms/{RoomDNDView.js => DNDRoomTile.js} (97%) diff --git a/src/component-index.js b/src/component-index.js index dfe549930a..a2ee1ad4eb 100644 --- a/src/component-index.js +++ b/src/component-index.js @@ -48,8 +48,7 @@ module.exports.components['views.login.VectorLoginFooter'] = require('./componen module.exports.components['views.login.VectorLoginHeader'] = require('./components/views/login/VectorLoginHeader'); module.exports.components['views.messages.DateSeparator'] = require('./components/views/messages/DateSeparator'); module.exports.components['views.messages.MessageTimestamp'] = require('./components/views/messages/MessageTimestamp'); -module.exports.components['views.rooms.BottomLeftMenuTile'] = require('./components/views/rooms/BottomLeftMenuTile'); -module.exports.components['views.rooms.RoomDNDView'] = require('./components/views/rooms/RoomDNDView'); +module.exports.components['views.rooms.DNDRoomTile'] = require('./components/views/rooms/DNDRoomTile'); module.exports.components['views.rooms.RoomDropTarget'] = require('./components/views/rooms/RoomDropTarget'); module.exports.components['views.rooms.RoomTooltip'] = require('./components/views/rooms/RoomTooltip'); module.exports.components['views.rooms.SearchBar'] = require('./components/views/rooms/SearchBar'); diff --git a/src/components/structures/BottomLeftMenu.js b/src/components/structures/BottomLeftMenu.js index d36966d297..875d927621 100644 --- a/src/components/structures/BottomLeftMenu.js +++ b/src/components/structures/BottomLeftMenu.js @@ -46,7 +46,6 @@ module.exports = React.createClass({ }, render: function() { - var BottomLeftMenuTile = sdk.getComponent('rooms.BottomLeftMenuTile'); var TintableSvg = sdk.getComponent('elements.TintableSvg'); return (
diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js index 63b340563f..651ffae379 100644 --- a/src/components/structures/RoomSubList.js +++ b/src/components/structures/RoomSubList.js @@ -368,12 +368,12 @@ var RoomSubList = React.createClass({ makeRoomTiles: function() { var self = this; - var RoomTile = sdk.getComponent("rooms.RoomTile"); + var DNDRoomTile = sdk.getComponent("rooms.DNDRoomTile"); return this.state.sortedList.map(function(room) { var selected = room.roomId == self.props.selectedRoom; // XXX: is it evil to pass in self as a prop to RoomTile? return ( - { this.props.label }
; - } - else if (this.state.hover) { - var RoomTooltip = sdk.getComponent("rooms.RoomTooltip"); - label = ; - } - - return ( -
-
- -
- { label } -
- ); - } -}); diff --git a/src/components/views/rooms/RoomDNDView.js b/src/components/views/rooms/DNDRoomTile.js similarity index 97% rename from src/components/views/rooms/RoomDNDView.js rename to src/components/views/rooms/DNDRoomTile.js index e06af69e89..233fb8bbf1 100644 --- a/src/components/views/rooms/RoomDNDView.js +++ b/src/components/views/rooms/DNDRoomTile.js @@ -25,6 +25,13 @@ var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg'); var sdk = require('matrix-react-sdk'); var RoomTile = require('matrix-react-sdk/lib/components/views/rooms/RoomTile'); +/** + * Defines a new Component, DNDRoomTile that wraps RoomTile, making it draggable. + * Requires extra props: + * roomSubList: React.PropTypes.object.isRequired, + * refreshSubList: React.PropTypes.func.isRequired, + */ + /** * Specifies the drag source contract. * Only `beginDrag` function is required. @@ -202,4 +209,3 @@ DragSource('RoomTile', roomTileSource, function(connect, monitor) { }; })(RoomTile)); -module.exports.replaces = 'RoomTile'; diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css index 4c60881561..c05efd26db 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/MemberInfo.css @@ -73,3 +73,12 @@ limitations under the License. margin-left: 8px; line-height: 23px; } + +.mx_MemberInfo_createRoom { + cursor: pointer; +} + +.mx_MemberInfo_createRoom_label { + width: 160px ! important; +} + diff --git a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css index 2545650350..ff302baac6 100644 --- a/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css +++ b/src/skins/vector/css/matrix-react-sdk/views/rooms/RoomTile.css @@ -28,6 +28,10 @@ limitations under the License. height: 24px; } +.mx_RightPanel .mx_RoomTile_nameContainer { + width: 170px; +} + .mx_RoomTile_avatar { display: inline-block; padding-top: 5px;