Remove deprecated features at React v15.5 (#1905)

* Remove deprecated features at React v15.5

- [x] React.PropTypes
- [x] react-addons-pure-render-mixin
- [x] react-addons-test-utils

* Uncommented out & Add browserify_rails options

* re-add react-addons-shallow

* Fix syntax error from resolve conflicts

* follow up 59a77923b3

app/assets/javascripts/components/features/notifications/components/clear_column_button.jsx

@@ -1,15 +1,11 @@
+import PropTypes from 'prop-types';
 import { defineMessages, injectIntl } from 'react-intl';
 
 const messages = defineMessages({
   clear: { id: 'notifications.clear', defaultMessage: 'Clear notifications' }
 });
 
-const ClearColumnButton = React.createClass({
-
-  propTypes: {
-    onClick: React.PropTypes.func.isRequired,
-    intl: React.PropTypes.object.isRequired
-  },
+class ClearColumnButton extends React.Component {
 
   render () {
     const { intl } = this.props;
@@ -20,6 +16,11 @@ const ClearColumnButton = React.createClass({
       </div>
     );
   }
-})
+}
+
+ClearColumnButton.propTypes = {
+  onClick: PropTypes.func.isRequired,
+  intl: PropTypes.object.isRequired
+};
 
 export default injectIntl(ClearColumnButton);

app/assets/javascripts/components/features/notifications/components/column_settings.jsx

@@ -1,4 +1,4 @@
-import PureRenderMixin from 'react-addons-pure-render-mixin';
+import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 import ColumnCollapsable from '../../../components/column_collapsable';
@@ -23,18 +23,7 @@ const rowStyle = {
 
 };
 
-const ColumnSettings = React.createClass({
-
-  propTypes: {
-    settings: ImmutablePropTypes.map.isRequired,
-    onChange: React.PropTypes.func.isRequired,
-    onSave: React.PropTypes.func.isRequired,
-    intl: React.PropTypes.shape({
-      formatMessage: React.PropTypes.func.isRequired
-    }).isRequired
-  },
-
-  mixins: [PureRenderMixin],
+class ColumnSettings extends React.PureComponent {
 
   render () {
     const { settings, intl, onChange, onSave } = this.props;
@@ -82,6 +71,15 @@ const ColumnSettings = React.createClass({
     );
   }
 
-});
+}
+
+ColumnSettings.propTypes = {
+  settings: ImmutablePropTypes.map.isRequired,
+  onChange: PropTypes.func.isRequired,
+  onSave: PropTypes.func.isRequired,
+  intl: PropTypes.shape({
+    formatMessage: PropTypes.func.isRequired
+  }).isRequired
+};
 
 export default injectIntl(ColumnSettings);

app/assets/javascripts/components/features/notifications/components/notification.jsx

@@ -1,4 +1,3 @@
-import PureRenderMixin from 'react-addons-pure-render-mixin';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import StatusContainer from '../../../containers/status_container';
 import AccountContainer from '../../../containers/account_container';
@@ -11,13 +10,7 @@ const linkStyle = {
   fontWeight: '500'
 };
 
-const Notification = React.createClass({
-
-  propTypes: {
-    notification: ImmutablePropTypes.map.isRequired
-  },
-
-  mixins: [PureRenderMixin],
+class Notification extends React.PureComponent {
 
   renderFollow (account, link) {
     return (
@@ -33,11 +26,11 @@ const Notification = React.createClass({
         <AccountContainer id={account.get('id')} withNote={false} />
       </div>
     );
-  },
+  }
 
   renderMention (notification) {
     return <StatusContainer id={notification.get('status')} />;
-  },
+  }
 
   renderFavourite (notification, link) {
     return (
@@ -53,7 +46,7 @@ const Notification = React.createClass({
         <StatusContainer id={notification.get('status')} muted={true} />
       </div>
     );
-  },
+  }
 
   renderReblog (notification, link) {
     return (
@@ -69,7 +62,7 @@ const Notification = React.createClass({
         <StatusContainer id={notification.get('status')} muted={true} />
       </div>
     );
-  },
+  }
 
   render () { // eslint-disable-line consistent-return
     const { notification } = this.props;
@@ -90,6 +83,10 @@ const Notification = React.createClass({
     }
   }
 
-});
+}
+
+Notification.propTypes = {
+  notification: ImmutablePropTypes.map.isRequired
+};
 
 export default Notification;

app/assets/javascripts/components/features/notifications/components/setting_toggle.jsx

@@ -1,3 +1,4 @@
+import PropTypes from 'prop-types';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import Toggle from 'react-toggle';
 
@@ -23,10 +24,10 @@ const SettingToggle = ({ settings, settingKey, label, onChange, htmlFor = '' })
 
 SettingToggle.propTypes = {
   settings: ImmutablePropTypes.map.isRequired,
-  settingKey: React.PropTypes.array.isRequired,
-  label: React.PropTypes.node.isRequired,
-  onChange: React.PropTypes.func.isRequired,
-  htmlFor: React.PropTypes.string
+  settingKey: PropTypes.array.isRequired,
+  label: PropTypes.node.isRequired,
+  onChange: PropTypes.func.isRequired,
+  htmlFor: PropTypes.string
 };
 
 export default SettingToggle;