emit focus_composer after updating the active room in GroupGridView

also change the active room from there so RoomView is oblivious
to grid view stuff

src/components/structures/GroupGridView.js

@@ -28,10 +28,22 @@ export default class RoomGridView extends React.Component {
         super(props);
         this.state = {
             roomStores: OpenRoomsStore.getRoomStores(),
+            activeRoomStore: OpenRoomsStore.getActiveRoomStore(),
         };
         this.onRoomsChanged = this.onRoomsChanged.bind(this);
     }
 
+    componentDidUpdate(_, prevState) {
+        const store = this.state.activeRoomStore;
+        if (store) {
+            store.getDispatcher().dispatch({action: 'focus_composer'});
+        }
+    }
+
+    componentDidMount() {
+        this.componentDidUpdate();
+    }
+
     componentWillMount() {
         this._unmounted = false;
         this._openRoomsStoreRegistration = OpenRoomsStore.addListener(this.onRoomsChanged);
@@ -61,6 +73,16 @@ export default class RoomGridView extends React.Component {
         }
     }
 
+    _setActive(i) {
+        const store = OpenRoomsStore.getRoomStoreAt(i);
+        if (store !== this.state.activeRoomStore) {
+            dis.dispatch({
+                action: 'group_grid_set_active',
+                room_id: store.getRoomId(),
+            });
+        }
+    }
+
     render() {
         let roomStores = this.state.roomStores.slice(0, 6);
         const emptyCount = 6 - roomStores.length;
@@ -76,10 +98,11 @@ export default class RoomGridView extends React.Component {
                         "mx_GroupGridView_tile": true,
                         "mx_GroupGridView_activeTile": isActive,
                     });
-                    return (<section key={roomStore.getRoomId()} className={tileClasses}>
+                    return (<section onClick={() => {this._setActive(i)}} key={roomStore.getRoomId()} className={tileClasses}>
                         <RoomView
                             collapsedRhs={true}
                             roomViewStore={roomStore}
+                            isActive={isActive}
                         />
                     </section>);
                 } else {

src/components/structures/RoomView.js

@@ -1470,10 +1470,6 @@ module.exports = React.createClass({
         }
     },
 
-    _onMainClicked: function() {
-        dis.dispatch({action: 'group_grid_set_active', room_id: this.state.room.roomId });
-    },
-
     render: function() {
         const RoomHeader = sdk.getComponent('rooms.RoomHeader');
         const MessageComposer = sdk.getComponent('rooms.MessageComposer');
@@ -1821,7 +1817,7 @@ module.exports = React.createClass({
         const rightPanel = this.state.room ? <RightPanel roomId={this.state.room.roomId} /> : undefined;
 
         return (
-            <main className={"mx_RoomView" + (inCall ? " mx_RoomView_inCall" : "")} ref="roomView" onClick={this._onMainClicked}>
+            <main className={"mx_RoomView" + (inCall ? " mx_RoomView_inCall" : "")} ref="roomView">
                 <RoomHeader ref="header" room={this.state.room} searchInfo={searchInfo}
                     oobData={this.props.oobData}
                     editing={this.state.editingRoomSettings}

src/stores/OpenRoomsStore.js

@@ -60,6 +60,12 @@ class OpenRoomsStore extends Store {
         }
     }
 
+    getRoomStoreAt(index) {
+        if (index >= 0 && index < this._state.rooms.length) {
+            return this._state.rooms[index].store;
+        }
+    }
+
     _getActiveOpenRoom() {
         const index = this._state.currentIndex;
         if (index !== null && index < this._state.rooms.length) {