diff --git a/src/components/structures/CompatibilityPage.js b/src/components/structures/CompatibilityPage.js
index 9241f9e1f4..28c86f8dd8 100644
--- a/src/components/structures/CompatibilityPage.js
+++ b/src/components/structures/CompatibilityPage.js
@@ -16,10 +16,11 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import { _t } from '../../languageHandler';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'CompatibilityPage',
     propTypes: {
         onAccept: PropTypes.func,
diff --git a/src/components/structures/FilePanel.js b/src/components/structures/FilePanel.js
index e35a39a107..2b9594581e 100644
--- a/src/components/structures/FilePanel.js
+++ b/src/components/structures/FilePanel.js
@@ -15,6 +15,7 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 
 import Matrix from 'matrix-js-sdk';
@@ -25,7 +26,7 @@ import { _t } from '../../languageHandler';
 /*
  * Component which shows the filtered file using a TimelinePanel
  */
-const FilePanel = React.createClass({
+const FilePanel = createReactClass({
     displayName: 'FilePanel',
 
     propTypes: {
diff --git a/src/components/structures/GroupView.js b/src/components/structures/GroupView.js
index d5fa8fa5ae..ed18f0f463 100644
--- a/src/components/structures/GroupView.js
+++ b/src/components/structures/GroupView.js
@@ -17,6 +17,7 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import Promise from 'bluebird';
 import MatrixClientPeg from '../../MatrixClientPeg';
@@ -67,7 +68,7 @@ const UserSummaryType = PropTypes.shape({
     }).isRequired,
 });
 
-const CategoryRoomList = React.createClass({
+const CategoryRoomList = createReactClass({
     displayName: 'CategoryRoomList',
 
     props: {
@@ -156,7 +157,7 @@ const CategoryRoomList = React.createClass({
     },
 });
 
-const FeaturedRoom = React.createClass({
+const FeaturedRoom = createReactClass({
     displayName: 'FeaturedRoom',
 
     props: {
@@ -244,7 +245,7 @@ const FeaturedRoom = React.createClass({
     },
 });
 
-const RoleUserList = React.createClass({
+const RoleUserList = createReactClass({
     displayName: 'RoleUserList',
 
     props: {
@@ -327,7 +328,7 @@ const RoleUserList = React.createClass({
     },
 });
 
-const FeaturedUser = React.createClass({
+const FeaturedUser = createReactClass({
     displayName: 'FeaturedUser',
 
     props: {
@@ -399,7 +400,7 @@ const FeaturedUser = React.createClass({
 const GROUP_JOINPOLICY_OPEN = "open";
 const GROUP_JOINPOLICY_INVITE = "invite";
 
-export default React.createClass({
+export default createReactClass({
     displayName: 'GroupView',
 
     propTypes: {
diff --git a/src/components/structures/InteractiveAuth.js b/src/components/structures/InteractiveAuth.js
index ccc906601c..5e06d124c4 100644
--- a/src/components/structures/InteractiveAuth.js
+++ b/src/components/structures/InteractiveAuth.js
@@ -19,13 +19,14 @@ import Matrix from 'matrix-js-sdk';
 const InteractiveAuth = Matrix.InteractiveAuth;
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 
 import {getEntryComponentForLoginType} from '../views/auth/InteractiveAuthEntryComponents';
 
 import sdk from '../../index';
 
-export default React.createClass({
+export default createReactClass({
     displayName: 'InteractiveAuth',
 
     propTypes: {
diff --git a/src/components/structures/LeftPanel.js b/src/components/structures/LeftPanel.js
index 2581319d75..f083e5ab38 100644
--- a/src/components/structures/LeftPanel.js
+++ b/src/components/structures/LeftPanel.js
@@ -14,9 +14,8 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-'use strict';
-
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { MatrixClient } from 'matrix-js-sdk';
@@ -30,7 +29,7 @@ import {_t} from "../../languageHandler";
 import Analytics from "../../Analytics";
 
 
-const LeftPanel = React.createClass({
+const LeftPanel = createReactClass({
     displayName: 'LeftPanel',
 
     // NB. If you add props, don't forget to update
diff --git a/src/components/structures/LoggedInView.js b/src/components/structures/LoggedInView.js
index 17c8e91cb9..bcbf9f8155 100644
--- a/src/components/structures/LoggedInView.js
+++ b/src/components/structures/LoggedInView.js
@@ -18,6 +18,7 @@ limitations under the License.
 
 import { MatrixClient } from 'matrix-js-sdk';
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import { DragDropContext } from 'react-beautiful-dnd';
 
@@ -58,7 +59,7 @@ function canElementReceiveInput(el) {
  *
  * Components mounted below us can access the matrix client via the react context.
  */
-const LoggedInView = React.createClass({
+const LoggedInView = createReactClass({
     displayName: 'LoggedInView',
 
     propTypes: {
diff --git a/src/components/structures/MatrixChat.js b/src/components/structures/MatrixChat.js
index aeffff9717..d205326d0d 100644
--- a/src/components/structures/MatrixChat.js
+++ b/src/components/structures/MatrixChat.js
@@ -20,6 +20,7 @@ limitations under the License.
 import Promise from 'bluebird';
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import Matrix from "matrix-js-sdk";
 
@@ -106,7 +107,7 @@ const ONBOARDING_FLOW_STARTERS = [
     'view_create_group',
 ];
 
-export default React.createClass({
+export default createReactClass({
     // we export this so that the integration tests can use it :-S
     statics: {
         VIEWS: VIEWS,
diff --git a/src/components/structures/MessagePanel.js b/src/components/structures/MessagePanel.js
index 1fb0d6c725..33ae0c3f74 100644
--- a/src/components/structures/MessagePanel.js
+++ b/src/components/structures/MessagePanel.js
@@ -18,6 +18,7 @@ limitations under the License.
 /* global Velocity */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
@@ -35,7 +36,7 @@ const isMembershipChange = (e) => e.getType() === 'm.room.member' || e.getType()
 
 /* (almost) stateless UI component which builds the event tiles in the room timeline.
  */
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'MessagePanel',
 
     propTypes: {
diff --git a/src/components/structures/MyGroups.js b/src/components/structures/MyGroups.js
index aec4767e7b..2de15a5444 100644
--- a/src/components/structures/MyGroups.js
+++ b/src/components/structures/MyGroups.js
@@ -16,6 +16,7 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import { MatrixClient } from 'matrix-js-sdk';
 import sdk from '../../index';
@@ -23,7 +24,7 @@ import { _t } from '../../languageHandler';
 import dis from '../../dispatcher';
 import AccessibleButton from '../views/elements/AccessibleButton';
 
-export default React.createClass({
+export default createReactClass({
     displayName: 'MyGroups',
 
     getInitialState: function() {
diff --git a/src/components/structures/NotificationPanel.js b/src/components/structures/NotificationPanel.js
index 50f2683138..f9ce0e008e 100644
--- a/src/components/structures/NotificationPanel.js
+++ b/src/components/structures/NotificationPanel.js
@@ -15,7 +15,8 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-const React = require('react');
+import React from 'react';
+import createReactClass from 'create-react-class';
 import { _t } from '../../languageHandler';
 const sdk = require('../../index');
 const MatrixClientPeg = require("../../MatrixClientPeg");
@@ -23,7 +24,7 @@ const MatrixClientPeg = require("../../MatrixClientPeg");
 /*
  * Component which shows the global notification list using a TimelinePanel
  */
-const NotificationPanel = React.createClass({
+const NotificationPanel = createReactClass({
     displayName: 'NotificationPanel',
 
     propTypes: {
diff --git a/src/components/structures/RoomDirectory.js b/src/components/structures/RoomDirectory.js
index 8d8ad96ff6..aa2e56d3c2 100644
--- a/src/components/structures/RoomDirectory.js
+++ b/src/components/structures/RoomDirectory.js
@@ -15,9 +15,8 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-'use strict';
-
-const React = require('react');
+import React from 'react';
+import createReactClass from 'create-react-class';
 
 const MatrixClientPeg = require('../../MatrixClientPeg');
 const ContentRepo = require("matrix-js-sdk").ContentRepo;
@@ -39,7 +38,7 @@ function track(action) {
     Analytics.trackEvent('RoomDirectory', action);
 }
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'RoomDirectory',
 
     propTypes: {
diff --git a/src/components/structures/RoomStatusBar.js b/src/components/structures/RoomStatusBar.js
index 7ef080e235..21dd06767c 100644
--- a/src/components/structures/RoomStatusBar.js
+++ b/src/components/structures/RoomStatusBar.js
@@ -16,13 +16,12 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import Matrix from 'matrix-js-sdk';
 import { _t, _td } from '../../languageHandler';
 import sdk from '../../index';
-import WhoIsTyping from '../../WhoIsTyping';
 import MatrixClientPeg from '../../MatrixClientPeg';
-import MemberAvatar from '../views/avatars/MemberAvatar';
 import Resend from '../../Resend';
 import * as cryptodevices from '../../cryptodevices';
 import dis from '../../dispatcher';
@@ -39,7 +38,7 @@ function getUnsentMessages(room) {
     });
 }
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'RoomStatusBar',
 
     propTypes: {
diff --git a/src/components/structures/RoomSubList.js b/src/components/structures/RoomSubList.js
index fa74180a2c..5a90beb06f 100644
--- a/src/components/structures/RoomSubList.js
+++ b/src/components/structures/RoomSubList.js
@@ -17,6 +17,7 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import classNames from 'classnames';
 import sdk from '../../index';
 import dis from '../../dispatcher';
@@ -34,7 +35,7 @@ import {_t} from "../../languageHandler";
 // turn this on for drop & drag console debugging galore
 const debug = false;
 
-const RoomSubList = React.createClass({
+const RoomSubList = createReactClass({
     displayName: 'RoomSubList',
 
     debug: debug,
diff --git a/src/components/structures/RoomView.js b/src/components/structures/RoomView.js
index 5edf19f3ef..543b35eaf8 100644
--- a/src/components/structures/RoomView.js
+++ b/src/components/structures/RoomView.js
@@ -24,6 +24,7 @@ limitations under the License.
 import shouldHideEvent from '../../shouldHideEvent';
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
 import Promise from 'bluebird';
@@ -70,7 +71,7 @@ const RoomContext = PropTypes.shape({
     room: PropTypes.instanceOf(Room),
 });
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'RoomView',
     propTypes: {
         ConferenceHandler: PropTypes.any,
diff --git a/src/components/structures/ScrollPanel.js b/src/components/structures/ScrollPanel.js
index 40caa627af..cb29305dd3 100644
--- a/src/components/structures/ScrollPanel.js
+++ b/src/components/structures/ScrollPanel.js
@@ -14,7 +14,8 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-const React = require("react");
+import React from "react";
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import Promise from 'bluebird';
 import { KeyCode } from '../../Keyboard';
@@ -84,7 +85,7 @@ if (DEBUG_SCROLL) {
  * offset as normal.
  */
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'ScrollPanel',
 
     propTypes: {
diff --git a/src/components/structures/SearchBox.js b/src/components/structures/SearchBox.js
index a66cfb17b6..d8ff08adbf 100644
--- a/src/components/structures/SearchBox.js
+++ b/src/components/structures/SearchBox.js
@@ -16,13 +16,14 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import { KeyCode } from '../../Keyboard';
 import dis from '../../dispatcher';
 import { throttle } from 'lodash';
 import AccessibleButton from '../../components/views/elements/AccessibleButton';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'SearchBox',
 
     propTypes: {
diff --git a/src/components/structures/TagPanel.js b/src/components/structures/TagPanel.js
index f5d1464070..a758092dc8 100644
--- a/src/components/structures/TagPanel.js
+++ b/src/components/structures/TagPanel.js
@@ -15,6 +15,7 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import { MatrixClient } from 'matrix-js-sdk';
 import TagOrderStore from '../../stores/TagOrderStore';
@@ -28,7 +29,7 @@ import { _t } from '../../languageHandler';
 import { Droppable } from 'react-beautiful-dnd';
 import classNames from 'classnames';
 
-const TagPanel = React.createClass({
+const TagPanel = createReactClass({
     displayName: 'TagPanel',
 
     contextTypes: {
diff --git a/src/components/structures/TagPanelButtons.js b/src/components/structures/TagPanelButtons.js
index bbd9d28576..a850e8c34c 100644
--- a/src/components/structures/TagPanelButtons.js
+++ b/src/components/structures/TagPanelButtons.js
@@ -15,12 +15,13 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import sdk from '../../index';
 import dis from '../../dispatcher';
 import Modal from '../../Modal';
 import { _t } from '../../languageHandler';
 
-const TagPanelButtons = React.createClass({
+const TagPanelButtons = createReactClass({
     displayName: 'TagPanelButtons',
 
 
diff --git a/src/components/structures/TimelinePanel.js b/src/components/structures/TimelinePanel.js
index 5c18267637..cdeea78204 100644
--- a/src/components/structures/TimelinePanel.js
+++ b/src/components/structures/TimelinePanel.js
@@ -19,8 +19,9 @@ limitations under the License.
 
 import SettingsStore from "../../settings/SettingsStore";
 
-const React = require('react');
-const ReactDOM = require("react-dom");
+import React from 'react';
+import createReactClass from 'create-react-class';
+import ReactDOM from "react-dom";
 import PropTypes from 'prop-types';
 import Promise from 'bluebird';
 
@@ -58,7 +59,7 @@ if (DEBUG) {
  *
  * Also responsible for handling and sending read receipts.
  */
-const TimelinePanel = React.createClass({
+const TimelinePanel = createReactClass({
     displayName: 'TimelinePanel',
 
     propTypes: {
diff --git a/src/components/structures/UploadBar.js b/src/components/structures/UploadBar.js
index 6f26f0af35..da0ca7fe99 100644
--- a/src/components/structures/UploadBar.js
+++ b/src/components/structures/UploadBar.js
@@ -14,14 +14,16 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-const React = require('react');
+import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import ContentMessages from '../../ContentMessages';
 const dis = require('../../dispatcher');
 const filesize = require('filesize');
 import { _t } from '../../languageHandler';
 
-module.exports = React.createClass({displayName: 'UploadBar',
+module.exports = createReactClass({
+    displayName: 'UploadBar',
     propTypes: {
         room: PropTypes.object,
     },
diff --git a/src/components/structures/ViewSource.js b/src/components/structures/ViewSource.js
index fd35fdbeef..ef4ede517a 100644
--- a/src/components/structures/ViewSource.js
+++ b/src/components/structures/ViewSource.js
@@ -16,13 +16,14 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import PropTypes from 'prop-types';
 import SyntaxHighlight from '../views/elements/SyntaxHighlight';
 import {_t} from "../../languageHandler";
 import sdk from "../../index";
 
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'ViewSource',
 
     propTypes: {