Move and merge MemberInfo to React SDK

src/skins/vector/skindex.js

@@ -39,6 +39,7 @@ skin['elements.EditableText'] = require('matrix-react-sdk/lib/components/views/e
 skin['elements.ProgressBar'] = require('matrix-react-sdk/lib/components/views/elements/ProgressBar');
 skin['elements.UserSelector'] = require('matrix-react-sdk/lib/components/views/elements/UserSelector');
 skin['messages.MessageComposer'] = require('matrix-react-sdk/lib/components/views/messages/MessageComposer');
+skin['rooms.MemberInfo'] = require('matrix-react-sdk/lib/components/views/rooms/MemberInfo');
 skin['create_room.CreateRoomButton'] = require('matrix-react-sdk/lib/components/views/create_room/CreateRoomButton');
 skin['create_room.Presets'] = require('matrix-react-sdk/lib/components/views/create_room/Presets');
 skin['create_room.RoomAlias'] = require('matrix-react-sdk/lib/components/views/create_room/RoomAlias');
@@ -61,7 +62,6 @@ skin['molecules.MRoomMemberTile'] = require('./views/molecules/MRoomMemberTile')
 skin['molecules.MTextTile'] = require('./views/molecules/MTextTile');
 skin['molecules.MVideoTile'] = require('./views/molecules/MVideoTile');
 skin['molecules.MatrixToolbar'] = require('./views/molecules/MatrixToolbar');
-skin['molecules.MemberInfo'] = require('./views/molecules/MemberInfo');
 skin['molecules.MemberTile'] = require('./views/molecules/MemberTile');
 skin['molecules.MessageContextMenu'] = require('./views/molecules/MessageContextMenu');
 skin['molecules.MessageTile'] = require('./views/molecules/MessageTile');

src/skins/vector/views/molecules/MemberInfo.js

@@ -1,101 +0,0 @@
-/*
-Copyright 2015 OpenMarket Ltd
-
-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.
-*/
-
-'use strict';
-
-var React = require('react');
-
-var MatrixClientPeg = require('matrix-react-sdk/lib/MatrixClientPeg');
-var sdk = require('matrix-react-sdk')
-var dis = require('matrix-react-sdk/lib/dispatcher');
-var MemberInfoController = require('matrix-react-sdk/lib/controllers/molecules/MemberInfo')
-
-// FIXME: this should probably be an organism, to match with MemberList, not a molecule
-
-module.exports = React.createClass({
-    displayName: 'MemberInfo',
-    mixins: [MemberInfoController],
-
-    onCancel: function(e) {
-        dis.dispatch({
-            action: "view_user",
-            member: null
-        });
-    },
-
-    render: function() {
-        var interactButton, kickButton, banButton, muteButton, giveModButton, spinner;
-        if (this.props.member.userId === MatrixClientPeg.get().credentials.userId) {
-            interactButton = <div className="mx_MemberInfo_field" onClick={this.onLeaveClick}>Leave room</div>;
-        }
-        else {
-            interactButton = <div className="mx_MemberInfo_field" onClick={this.onChatClick}>Start chat</div>;
-        }
-
-        if (this.state.creatingRoom) {
-            var Loader = sdk.getComponent("elements.Spinner");
-            spinner = <Loader imgClassName="mx_ContextualMenu_spinner"/>;
-        }
-
-        if (this.state.can.kick) {
-            kickButton = <div className="mx_MemberInfo_field" onClick={this.onKick}>
-                Kick
-            </div>;
-        }
-        if (this.state.can.ban) {
-            banButton = <div className="mx_MemberInfo_field" onClick={this.onBan}>
-                Ban
-            </div>;
-        }
-        if (this.state.can.mute) {
-            var muteLabel = this.state.muted ? "Unmute" : "Mute";
-            muteButton = <div className="mx_MemberInfo_field" onClick={this.onMuteToggle}>
-                {muteLabel}
-            </div>;
-        }
-        if (this.state.can.modifyLevel) {
-            var giveOpLabel = this.state.isTargetMod ? "Revoke Mod" : "Make Mod";
-            giveModButton = <div className="mx_MemberInfo_field" onClick={this.onModToggle}>
-                {giveOpLabel}
-            </div>
-        }
-
-        var MemberAvatar = sdk.getComponent('avatars.MemberAvatar');
-        return (
-            <div className="mx_MemberInfo">
-                <img className="mx_MemberInfo_cancel" src="img/cancel-black.png" width="18" height="18" onClick={this.onCancel}/>
-                <div className="mx_MemberInfo_avatar">
-                    <MemberAvatar member={this.props.member} width={48} height={48} />
-                </div>
-                <h2>{ this.props.member.name }</h2>
-                <div className="mx_MemberInfo_profileField">
-                    { this.props.member.userId }
-                </div>
-                <div className="mx_MemberInfo_profileField">
-                    power: { this.props.member.powerLevelNorm }%
-                </div>
-                <div className="mx_MemberInfo_buttons">
-                    {interactButton}
-                    {muteButton}
-                    {kickButton}
-                    {banButton}
-                    {giveModButton}
-                    {spinner}
-                </div>
-            </div>
-        );
-    }
-});

src/skins/vector/views/organisms/RightPanel.js

@@ -137,7 +137,7 @@ module.exports = React.createClass({
                     panel = <MemberList roomId={this.props.roomId} key={this.props.roomId} />
                 }
                 else if(this.state.phase == this.Phase.MemberInfo) {
-                    var MemberInfo = sdk.getComponent('molecules.MemberInfo');
+                    var MemberInfo = sdk.getComponent('rooms.MemberInfo');
                     panel = <MemberInfo roomId={this.props.roomId} member={this.state.member} key={this.props.roomId} />
                 }
             }

src/skins/vector/views/pages/MatrixChat.js

@@ -56,7 +56,7 @@ module.exports = React.createClass({
 
     onUserClick: function(event, userId) {
         event.preventDefault();
-        var MemberInfo = sdk.getComponent('molecules.MemberInfo');
+        var MemberInfo = sdk.getComponent('rooms.MemberInfo');
         var member = new Matrix.RoomMember(null, userId);
         ContextualMenu.createMenu(MemberInfo, {
             member: member,