Update room header when room name changes

src/controllers/atoms/EditableText.js

@@ -21,7 +21,7 @@ var React = require('react');
 module.exports = {
     propTypes: {
         onValueChanged: React.PropTypes.func,
-        initalValue: React.PropTypes.string,
+        initialValue: React.PropTypes.string,
         placeHolder: React.PropTypes.string,
     },
 
@@ -33,18 +33,24 @@ module.exports = {
     getDefaultProps: function() {
         return {
             onValueChanged: function() {},
-            initalValue: '',
+            initialValue: '',
             placeHolder: 'Click to set',
         };
     },
 
     getInitialState: function() {
         return {
-            value: this.props.initalValue,
+            value: this.props.initialValue,
             phase: this.Phases.Display,
         }
     },
 
+    componentWillReceiveProps: function(nextProps) {
+        this.setState({
+            value: nextProps.initialValue
+        });
+    },
+
     getValue: function() {
         return this.state.value;
     },

src/controllers/organisms/RoomView.js

@@ -49,6 +49,7 @@ module.exports = {
     componentWillMount: function() {
         this.dispatcherRef = dis.register(this.onAction);
         MatrixClientPeg.get().on("Room.timeline", this.onRoomTimeline);
+        MatrixClientPeg.get().on("Room.name", this.onRoomName);
         this.atBottom = true;
     },
 
@@ -60,6 +61,7 @@ module.exports = {
         dis.unregister(this.dispatcherRef);
         if (MatrixClientPeg.get()) {
             MatrixClientPeg.get().removeListener("Room.timeline", this.onRoomTimeline);
+            MatrixClientPeg.get().removeListener("Room.name", this.onRoomName);
         }
     },
 
@@ -106,6 +108,14 @@ module.exports = {
         }
     },
 
+    onRoomName: function(room) {
+        if (room.roomId == this.props.roomId) {
+            this.setState({
+                room: room
+            });
+        }
+    },
+
     componentDidMount: function() {
         if (this.refs.messageWrapper) {
             var messageWrapper = this.refs.messageWrapper.getDOMNode();