Merge pull request #3405 from matrix-org/t3chguy/react16_11

Switch to createReactClass: *everything else*. React 16 :D

src/components/views/avatars/BaseAvatar.js

@@ -18,12 +18,13 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import { MatrixClient } from 'matrix-js-sdk';
 import AvatarLogic from '../../../Avatar';
 import SettingsStore from "../../../settings/SettingsStore";
 import AccessibleButton from '../elements/AccessibleButton';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'BaseAvatar',
 
     propTypes: {

src/components/views/avatars/GroupAvatar.js

@@ -16,10 +16,11 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import sdk from '../../../index';
 import MatrixClientPeg from '../../../MatrixClientPeg';
 
-export default React.createClass({
+export default createReactClass({
     displayName: 'GroupAvatar',
 
     propTypes: {

src/components/views/avatars/MemberAvatar.js

@@ -14,15 +14,14 @@ 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 PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 const Avatar = require('../../../Avatar');
 const sdk = require("../../../index");
 const dispatcher = require("../../../dispatcher");
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'MemberAvatar',
 
     propTypes: {

src/components/views/avatars/RoomAvatar.js

@@ -15,13 +15,14 @@ limitations under the License.
 */
 import React from "react";
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import {ContentRepo} from "matrix-js-sdk";
 import MatrixClientPeg from "../../../MatrixClientPeg";
 import Modal from '../../../Modal';
 import sdk from "../../../index";
 import Avatar from '../../../Avatar';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'RoomAvatar',
 
     // Room may be left unset here, but if it is,

src/components/views/context_menus/MessageContextMenu.js

@@ -17,6 +17,7 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import {EventStatus} from 'matrix-js-sdk';
 
 import MatrixClientPeg from '../../../MatrixClientPeg';
@@ -33,7 +34,7 @@ function canCancel(eventStatus) {
     return eventStatus === EventStatus.QUEUED || eventStatus === EventStatus.NOT_SENT;
 }
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'MessageContextMenu',
 
     propTypes: {

src/components/views/context_menus/RoomTileContextMenu.js

@@ -18,8 +18,9 @@ limitations under the License.
 
 import Promise from 'bluebird';
 import React from 'react';
-import classNames from 'classnames';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
+import classNames from 'classnames';
 import sdk from '../../../index';
 import { _t, _td } from '../../../languageHandler';
 import MatrixClientPeg from '../../../MatrixClientPeg';
@@ -31,7 +32,7 @@ import Modal from '../../../Modal';
 import RoomListActions from '../../../actions/RoomListActions';
 import RoomViewStore from '../../../stores/RoomViewStore';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'RoomTileContextMenu',
 
     propTypes: {

src/components/views/create_room/CreateRoomButton.js

@@ -14,12 +14,12 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-'use strict';
-
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import { _t } from '../../../languageHandler';
-module.exports = React.createClass({
+
+module.exports = createReactClass({
     displayName: 'CreateRoomButton',
     propTypes: {
         onCreateRoom: PropTypes.func,

src/components/views/create_room/Presets.js

@@ -14,10 +14,9 @@ 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 PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import { _t } from '../../../languageHandler';
 
 const Presets = {
@@ -26,7 +25,7 @@ const Presets = {
     Custom: "custom",
 };
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'CreateRoomPresets',
     propTypes: {
         onChange: PropTypes.func,

src/components/views/create_room/RoomAlias.js

@@ -14,11 +14,12 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-const React = require('react');
+import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import { _t } from '../../../languageHandler';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'RoomAlias',
     propTypes: {
         // Specifying a homeserver will make magical things happen when you,

src/components/views/globals/MatrixToolbar.js

@@ -14,14 +14,13 @@ 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 { _t } from '../../../languageHandler';
 import Notifier from '../../../Notifier';
 import AccessibleButton from '../../../components/views/elements/AccessibleButton';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'MatrixToolbar',
 
     hideToolbar: function() {

src/components/views/globals/NewVersionBar.js

@@ -17,6 +17,7 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import sdk from '../../../index';
 import Modal from '../../../Modal';
 import PlatformPeg from '../../../PlatformPeg';
@@ -31,7 +32,7 @@ function checkVersion(ver) {
     return parts.length == 5 && parts[1] == 'react' && parts[3] == 'js';
 }
 
-export default React.createClass({
+export default createReactClass({
     propTypes: {
         version: PropTypes.string.isRequired,
         newVersion: PropTypes.string.isRequired,

src/components/views/globals/PasswordNagBar.js

@@ -16,11 +16,12 @@ limitations under the License.
 */
 
 import React from 'react';
+import createReactClass from 'create-react-class';
 import sdk from '../../../index';
 import Modal from '../../../Modal';
 import { _t } from '../../../languageHandler';
 
-export default React.createClass({
+export default createReactClass({
     onUpdateClicked: function() {
         const SetPasswordDialog = sdk.getComponent('dialogs.SetPasswordDialog');
         Modal.createTrackedDialog('Set Password Dialog', 'Password Nag Bar', SetPasswordDialog);

src/components/views/globals/ServerLimitBar.js

@@ -16,11 +16,12 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import classNames from 'classnames';
 import { _td } from '../../../languageHandler';
 import { messageForResourceLimitError } from '../../../utils/ErrorUtils';
 
-export default React.createClass({
+export default createReactClass({
     propTypes: {
         // 'hard' if the logged in user has been locked out, 'soft' if they haven't
         kind: PropTypes.string,

src/components/views/globals/UpdateCheckBar.js

@@ -16,11 +16,12 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import { _t } from '../../../languageHandler';
 import PlatformPeg from '../../../PlatformPeg';
 import AccessibleButton from '../../../components/views/elements/AccessibleButton';
 
-export default React.createClass({
+export default createReactClass({
     propTypes: {
         status: PropTypes.string.isRequired,
         // Currently for error detail but will be usable for download progress

src/components/views/messages/MFileBody.js

@@ -15,10 +15,9 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-'use strict';
-
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import filesize from 'filesize';
 import MatrixClientPeg from '../../../MatrixClientPeg';
 import sdk from '../../../index';
@@ -195,7 +194,7 @@ function computedStyle(element) {
     return cssText;
 }
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'MFileBody',
 
     getInitialState: function() {

src/components/views/messages/MVideoBody.js

@@ -14,18 +14,17 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-'use strict';
-
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import MFileBody from './MFileBody';
 import MatrixClientPeg from '../../../MatrixClientPeg';
 import { decryptFile } from '../../../utils/DecryptFile';
 import Promise from 'bluebird';
 import { _t } from '../../../languageHandler';
 import SettingsStore from "../../../settings/SettingsStore";
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'MVideoBody',
 
     propTypes: {

src/components/views/messages/MessageEvent.js

@@ -14,13 +14,12 @@ 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 PropTypes from 'prop-types';
-const sdk = require('../../../index');
+import createReactClass from 'create-react-class';
+import sdk from '../../../index';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'MessageEvent',
 
     propTypes: {

src/components/views/messages/RoomAvatarEvent.js

@@ -17,13 +17,14 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import MatrixClientPeg from '../../../MatrixClientPeg';
 import { _t } from '../../../languageHandler';
 import sdk from '../../../index';
 import Modal from '../../../Modal';
 import AccessibleButton from '../elements/AccessibleButton';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'RoomAvatarEvent',
 
     propTypes: {

src/components/views/messages/RoomCreate.js

@@ -16,13 +16,14 @@ limitations under the License.
 
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 
 import dis from '../../../dispatcher';
 import { RoomPermalinkCreator } from '../../../matrix-to';
 import { _t } from '../../../languageHandler';
 import MatrixClientPeg from '../../../MatrixClientPeg';
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'RoomCreate',
 
     propTypes: {

src/components/views/messages/SenderProfile.js

@@ -14,17 +14,16 @@
  limitations under the License.
  */
 
-'use strict';
-
 import React from 'react';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import {MatrixClient} from 'matrix-js-sdk';
 import Flair from '../elements/Flair.js';
 import FlairStore from '../../../stores/FlairStore';
 import { _t } from '../../../languageHandler';
 import {getUserNameColorClass} from '../../../utils/FormattingUtils';
 
-export default React.createClass({
+export default createReactClass({
     displayName: 'SenderProfile',
     propTypes: {
         mxEvent: PropTypes.object.isRequired, // event whose sender we're showing

src/components/views/messages/TextualBody.js

@@ -16,17 +16,15 @@ See the License for the specific language governing permissions and
 limitations under the License.
 */
 
-'use strict';
-
 import React from 'react';
 import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 import highlight from 'highlight.js';
 import * as HtmlUtils from '../../../HtmlUtils';
 import {formatDate} from '../../../DateUtils';
 import sdk from '../../../index';
 import Modal from '../../../Modal';
-import SdkConfig from '../../../SdkConfig';
 import dis from '../../../dispatcher';
 import { _t } from '../../../languageHandler';
 import * as ContextualMenu from '../../structures/ContextualMenu';
@@ -36,7 +34,7 @@ import {host as matrixtoHost} from '../../../matrix-to';
 import {pillifyLinks} from '../../../utils/pillify';
 import {IntegrationManagers} from "../../../integrations/IntegrationManagers";
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'TextualBody',
 
     propTypes: {

src/components/views/messages/TextualEvent.js

@@ -14,14 +14,13 @@ 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 PropTypes from 'prop-types';
+import createReactClass from 'create-react-class';
 
 const TextForEvent = require('../../../TextForEvent');
 
-module.exports = React.createClass({
+module.exports = createReactClass({
     displayName: 'TextualEvent',
 
     propTypes: {