Make room name editable

This commit is contained in:
Erik Johnston 2015-07-16 17:42:33 +01:00
parent 03733e6a0f
commit ce3dab3c5b

View file

@ -17,14 +17,20 @@ limitations under the License.
'use strict'; 'use strict';
var React = require('react'); var React = require('react');
var ComponentBroker = require('../../../../src/ComponentBroker');
var MatrixClientPeg = require("../../../../src/MatrixClientPeg"); var MatrixClientPeg = require("../../../../src/MatrixClientPeg");
var RoomHeaderController = require("../../../../src/controllers/molecules/RoomHeader"); var RoomHeaderController = require("../../../../src/controllers/molecules/RoomHeader");
var EditableText = ComponentBroker.get("atoms/EditableText");
module.exports = React.createClass({ module.exports = React.createClass({
displayName: 'RoomHeader', displayName: 'RoomHeader',
mixins: [RoomHeaderController], mixins: [RoomHeaderController],
onNameChange: function(new_name) {
MatrixClientPeg.get().setRoomName(this.props.room.roomId, new_name);
},
render: function() { render: function() {
var topic = this.props.room.currentState.getStateEvents('m.room.topic', ''); var topic = this.props.room.currentState.getStateEvents('m.room.topic', '');
@ -52,7 +58,9 @@ module.exports = React.createClass({
<img src={ MatrixClientPeg.get().getAvatarUrlForRoom(this.props.room, 48, 48, "crop") } width="48" height="48"/> <img src={ MatrixClientPeg.get().getAvatarUrlForRoom(this.props.room, 48, 48, "crop") } width="48" height="48"/>
</div> </div>
<div className="mx_RoomHeader_info"> <div className="mx_RoomHeader_info">
<div className="mx_RoomHeader_name">{ this.props.room.name }</div> <div className="mx_RoomHeader_name">
<EditableText initalValue={this.props.room.name} onValueChanged={this.onNameChange} />
</div>
{ topic } { topic }
</div> </div>
</div> </div>
@ -76,4 +84,3 @@ module.exports = React.createClass({
); );
}, },
}); });