Remove create-react-class

src/components/views/groups/GroupRoomList.js

@@ -14,7 +14,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 import React from 'react';
-import createReactClass from 'create-react-class';
 import { _t } from '../../../languageHandler';
 import * as sdk from '../../../index';
 import GroupStore from '../../../stores/GroupStore';
@@ -25,34 +24,32 @@ import AutoHideScrollbar from "../../structures/AutoHideScrollbar";
 
 const INITIAL_LOAD_NUM_ROOMS = 30;
 
-export default createReactClass({
-    propTypes: {
+export default class GroupRoomList extends React.Component {
+    static propTypes = {
         groupId: PropTypes.string.isRequired,
-    },
+    };
 
-    getInitialState: function() {
-        return {
-            rooms: null,
-            truncateAt: INITIAL_LOAD_NUM_ROOMS,
-            searchQuery: "",
-        };
-    },
+    state = {
+        rooms: null,
+        truncateAt: INITIAL_LOAD_NUM_ROOMS,
+        searchQuery: "",
+    };
 
-    componentDidMount: function() {
+    componentDidMount() {
         this._unmounted = false;
         this._initGroupStore(this.props.groupId);
-    },
+    }
 
     componentWillUnmount() {
         this._unmounted = true;
         this._unregisterGroupStore();
-    },
+    }
 
     _unregisterGroupStore() {
         GroupStore.unregisterListener(this.onGroupStoreUpdated);
-    },
+    }
 
-    _initGroupStore: function(groupId) {
+    _initGroupStore(groupId) {
         GroupStore.registerListener(groupId, this.onGroupStoreUpdated);
         // XXX: This should be more fluxy - let's get the error from GroupStore .getError or something
         // XXX: This is also leaked - we should remove it when unmounting
@@ -62,16 +59,16 @@ export default createReactClass({
                 rooms: null,
             });
         });
-    },
+    }
 
-    onGroupStoreUpdated: function() {
+    onGroupStoreUpdated = () => {
         if (this._unmounted) return;
         this.setState({
             rooms: GroupStore.getGroupRooms(this.props.groupId),
         });
-    },
+    };
 
-    _createOverflowTile: function(overflowCount, totalCount) {
+    _createOverflowTile = (overflowCount, totalCount) => {
         // For now we'll pretend this is any entity. It should probably be a separate tile.
         const EntityTile = sdk.getComponent("rooms.EntityTile");
         const BaseAvatar = sdk.getComponent("avatars.BaseAvatar");
@@ -82,25 +79,25 @@ export default createReactClass({
             } name={text} presenceState="online" suppressOnHover={true}
             onClick={this._showFullRoomList} />
         );
-    },
+    };
 
-    _showFullRoomList: function() {
+    _showFullRoomList = () => {
         this.setState({
             truncateAt: -1,
         });
-    },
+    };
 
-    onSearchQueryChanged: function(ev) {
+    onSearchQueryChanged = ev => {
         this.setState({ searchQuery: ev.target.value });
-    },
+    };
 
-    onAddRoomToGroupButtonClick() {
+    onAddRoomToGroupButtonClick = () => {
         showGroupAddRoomDialog(this.props.groupId).then(() => {
             this.forceUpdate();
         });
-    },
+    };
 
-    makeGroupRoomTiles: function(query) {
+    makeGroupRoomTiles(query) {
         const GroupRoomTile = sdk.getComponent("groups.GroupRoomTile");
         query = (query || "").toLowerCase();
 
@@ -123,9 +120,9 @@ export default createReactClass({
         });
 
         return roomList;
-    },
+    }
 
-    render: function() {
+    render() {
         if (this.state.rooms === null) {
             return null;
         }
@@ -160,5 +157,5 @@ export default createReactClass({
                 { inputBox }
             </div>
         );
-    },
-});
+    }
+}