remove legacy decorators, use lodash.debounce (#2830)

.babelrc

@@ -11,7 +11,6 @@
     ]
   ],
   "plugins": [
-    "transform-decorators-legacy",
     "transform-object-rest-spread",
     [
       "react-intl",

app/javascript/mastodon/features/compose/components/compose_form.js

@@ -5,7 +5,7 @@ import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
 import ReplyIndicatorContainer from '../containers/reply_indicator_container';
 import AutosuggestTextarea from '../../../components/autosuggest_textarea';
-import { debounce } from 'react-decoration';
+import { debounce } from 'lodash';
 import UploadButtonContainer from '../containers/upload_button_container';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 import Toggle from 'react-toggle';
@@ -33,7 +33,7 @@ class ComposeForm extends ImmutablePureComponent {
     this.handleKeyDown = this.handleKeyDown.bind(this);
     this.handleSubmit = this.handleSubmit.bind(this);
     this.onSuggestionsClearRequested = this.onSuggestionsClearRequested.bind(this);
-    this.onSuggestionsFetchRequested = this.onSuggestionsFetchRequested.bind(this);
+    this.onSuggestionsFetchRequested = debounce(this.onSuggestionsFetchRequested.bind(this), 500);
     this.onSuggestionSelected = this.onSuggestionSelected.bind(this);
     this.handleChangeSpoilerText = this.handleChangeSpoilerText.bind(this);
     this.setAutosuggestTextarea = this.setAutosuggestTextarea.bind(this);
@@ -59,7 +59,6 @@ class ComposeForm extends ImmutablePureComponent {
     this.props.onClearSuggestions();
   }
 
-  @debounce(500)
   onSuggestionsFetchRequested (token) {
     this.props.onFetchSuggestions(token);
   }

app/javascript/mastodon/features/ui/containers/status_list_container.js

@@ -3,7 +3,7 @@ import StatusList from '../../../components/status_list';
 import { expandTimeline, scrollTopTimeline } from '../../../actions/timelines';
 import Immutable from 'immutable';
 import { createSelector } from 'reselect';
-import { debounce } from 'react-decoration';
+import { debounce } from 'lodash';
 
 const makeGetStatusIds = () => createSelector([
   (state, { type }) => state.getIn(['settings', type], Immutable.Map()),
@@ -53,21 +53,18 @@ const makeMapStateToProps = () => {
 
 const mapDispatchToProps = (dispatch, { type, id }) => ({
 
-  @debounce(300, true)
-  onScrollToBottom () {
+  onScrollToBottom: debounce(() => {
     dispatch(scrollTopTimeline(type, false));
     dispatch(expandTimeline(type, id));
-  },
+  }, 300, {leading: true}),
 
-  @debounce(100)
-  onScrollToTop () {
+  onScrollToTop: debounce(() => {
     dispatch(scrollTopTimeline(type, true));
-  },
+  }, 100),
 
-  @debounce(100)
-  onScroll () {
+  onScroll: debounce(() => {
     dispatch(scrollTopTimeline(type, false));
-  }
+  }, 100)
 
 });
 

app/javascript/mastodon/features/ui/index.js

@@ -10,7 +10,7 @@ import ModalContainer from './containers/modal_container';
 import Notifications from '../notifications';
 import { connect } from 'react-redux';
 import { isMobile } from '../../is_mobile';
-import { debounce } from 'react-decoration';
+import { debounce } from 'lodash';
 import { uploadCompose } from '../../actions/compose';
 import { refreshTimeline } from '../../actions/timelines';
 import { refreshNotifications } from '../../actions/notifications';
@@ -26,7 +26,7 @@ class UI extends React.PureComponent {
       width: window.innerWidth,
       draggingOver: false
     };
-    this.handleResize = this.handleResize.bind(this);
+    this.handleResize = debounce(this.handleResize.bind(this), 500);
     this.handleDragEnter = this.handleDragEnter.bind(this);
     this.handleDragOver = this.handleDragOver.bind(this);
     this.handleDrop = this.handleDrop.bind(this);
@@ -36,7 +36,6 @@ class UI extends React.PureComponent {
     this.setRef = this.setRef.bind(this);
   }
 
-  @debounce(500)
   handleResize () {
     this.setState({ width: window.innerWidth });
   }

package.json

@@ -25,7 +25,6 @@
     "babel-plugin-lodash": "^3.2.11",
     "babel-plugin-react-intl": "^2.3.1",
     "babel-plugin-react-transform": "^2.0.2",
-    "babel-plugin-transform-decorators-legacy": "^1.3.4",
     "babel-plugin-transform-object-rest-spread": "^6.23.0",
     "babel-plugin-transform-react-constant-elements": "^6.23.0",
     "babel-plugin-transform-react-inline-elements": "^6.22.0",
@@ -58,6 +57,7 @@
     "intl": "^1.2.5",
     "jquery-ujs": "^1.2.2",
     "js-yaml": "^3.8.3",
+    "lodash": "^4.17.4",
     "node-sass": "^4.5.2",
     "npmlog": "^4.0.2",
     "path-complete-extname": "^0.1.0",
@@ -72,7 +72,6 @@
     "react-addons-perf": "^15.4.2",
     "react-addons-shallow-compare": "^15.5.2",
     "react-autosuggest": "^7.0.1",
-    "react-decoration": "^1.4.0",
     "react-dom": "^15.5.4",
     "react-imageloader": "^2.1.0",
     "react-immutable-proptypes": "^2.1.0",

yarn.lock

@@ -364,10 +364,6 @@ asynckit@^0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/asynckit/-/asynckit-0.4.0.tgz#c79ed97f7f34cb8f2ba1bc9790bcc366474b4b79"
 
-autobind-decorator@1.3.3:
-  version "1.3.3"
-  resolved "https://registry.yarnpkg.com/autobind-decorator/-/autobind-decorator-1.3.3.tgz#41b1915ee742859c872b5d1743d10745254b83b4"
-
 autoprefixer@^6.3.1, autoprefixer@^6.3.7, autoprefixer@^6.7.7:
   version "6.7.7"
   resolved "https://registry.yarnpkg.com/autoprefixer/-/autoprefixer-6.7.7.tgz#1dbd1c835658e35ce3f9984099db00585c782014"
@@ -668,7 +664,7 @@ babel-plugin-syntax-class-properties@^6.8.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-class-properties/-/babel-plugin-syntax-class-properties-6.13.0.tgz#d7eb23b79a317f8543962c505b827c7d6cac27de"
 
-babel-plugin-syntax-decorators@^6.1.18, babel-plugin-syntax-decorators@^6.13.0:
+babel-plugin-syntax-decorators@^6.13.0:
   version "6.13.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-syntax-decorators/-/babel-plugin-syntax-decorators-6.13.0.tgz#312563b4dbde3cc806cee3e416cceeaddd11ac0b"
 
@@ -729,14 +725,6 @@ babel-plugin-transform-class-properties@^6.22.0:
     babel-runtime "^6.22.0"
     babel-template "^6.22.0"
 
-babel-plugin-transform-decorators-legacy:
-  version "1.3.4"
-  resolved "https://registry.yarnpkg.com/babel-plugin-transform-decorators-legacy/-/babel-plugin-transform-decorators-legacy-1.3.4.tgz#741b58f6c5bce9e6027e0882d9c994f04f366925"
-  dependencies:
-    babel-plugin-syntax-decorators "^6.1.18"
-    babel-runtime "^6.2.0"
-    babel-template "^6.3.0"
-
 babel-plugin-transform-decorators@^6.22.0:
   version "6.22.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-transform-decorators/-/babel-plugin-transform-decorators-6.22.0.tgz#c03635b27a23b23b7224f49232c237a73988d27c"
@@ -1285,7 +1273,7 @@ babel-runtime@^6.2.0, babel-runtime@^6.22.0:
     core-js "^2.4.0"
     regenerator-runtime "^0.10.0"
 
-babel-template@^6.16.0, babel-template@^6.22.0, babel-template@^6.24.1, babel-template@^6.3.0:
+babel-template@^6.16.0, babel-template@^6.22.0, babel-template@^6.24.1:
   version "6.24.1"
   resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.24.1.tgz#04ae514f1f93b3a2537f2a0f60a5a45fb8308333"
   dependencies:
@@ -5465,12 +5453,6 @@ react-autowhatever@^7.0.0:
     react-themeable "^1.1.0"
     section-iterator "^2.0.0"
 
-react-decoration@^1.4.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/react-decoration/-/react-decoration-1.4.0.tgz#54c30aed3aa81d1fe8f844b37db0a536e4190da9"
-  dependencies:
-    autobind-decorator "1.3.3"
-
 react-deep-force-update@^1.0.0:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/react-deep-force-update/-/react-deep-force-update-1.0.1.tgz#f911b5be1d2a6fe387507dd6e9a767aa2924b4c7"