chore: use debounce-input-decorator (#2608)

package.json

@@ -61,6 +61,7 @@
     "complex-matcher": "^0.2.1",
     "cookies-js": "^1.2.2",
     "d3": "^4.12.2",
+    "debounce-input-decorator": "^0.1.0",
     "dependency-check": "^3.0.0",
     "enzyme": "^3.3.0",
     "enzyme-adapter-react-15": "^1.0.5",

src/common/debounce-component-decorator.js

@@ -1,60 +0,0 @@
-import React from 'react'
-import { debounce } from 'lodash'
-
-import getEventValue from './get-event-value'
-
-const DEFAULT_DELAY = ({ debounceTimeout = 250 }) => debounceTimeout
-
-const debounceComponentDecorator = (delay = DEFAULT_DELAY) => Component =>
-  class DebouncedComponent extends React.Component {
-    constructor (props) {
-      super()
-      this.state = { value: props.value }
-
-      this._notify = debounce(event => {
-        this.props.onChange(event)
-      }, typeof delay === 'function' ? delay(props) : delay)
-
-      this._onChange = event => {
-        this.setState({ value: getEventValue(event) })
-
-        event.persist()
-        this._notify(event)
-      }
-
-      this._wrappedInstance = null
-      this._onRef = ref => {
-        this._wrappedInstance = ref
-      }
-    }
-
-    componentWillReceiveProps ({ value }) {
-      if (value !== this.props.value) {
-        this._notify.cancel()
-        this.setState({ value })
-      }
-    }
-
-    componentWillUnmount () {
-      this._notify.flush()
-    }
-
-    getWrappedInstance () {
-      return this._wrappedInstance
-    }
-
-    render () {
-      const props = {
-        ...this.props,
-        onChange: this._onChange,
-        ref: this._onRef,
-        value: this.state.value,
-      }
-      return <Component {...props} />
-    }
-  }
-export { debounceComponentDecorator as default }
-
-// common components
-export const Input = debounceComponentDecorator()('input')
-export const Textarea = debounceComponentDecorator()('textarea')

src/common/sorted-table/index.js

@@ -5,6 +5,7 @@ import DropdownMenu from 'react-bootstrap-4/lib/DropdownMenu' // https://phabric
 import DropdownToggle from 'react-bootstrap-4/lib/DropdownToggle' // https://phabricator.babeljs.io/T6662 so Dropdown.Toggle won't work https://react-bootstrap.github.io/components.html#btn-dropdowns-custom
 import React from 'react'
 import Shortcuts from 'shortcuts'
+import { Input as DebouncedInput } from 'debounce-input-decorator'
 import { Portal } from 'react-overlays'
 import { routerShape } from 'react-router/lib/PropTypes'
 import { Set } from 'immutable'
@@ -31,7 +32,6 @@ import SingleLineRow from '../single-line-row'
 import Tooltip from '../tooltip'
 import { BlockLink } from '../link'
 import { Container, Col } from '../grid'
-import { Input as DebouncedInput } from '../debounce-component-decorator'
 import {
   createCounter,
   createFilter,

src/xo-app/new-vm/index.js

@@ -18,7 +18,7 @@ import { injectIntl } from 'react-intl'
 import {
   Input as DebounceInput,
   Textarea as DebounceTextarea,
-} from 'debounce-component-decorator'
+} from 'debounce-input-decorator'
 import { Limits } from 'usage'
 import {
   clamp,

src/xo-app/settings/ips/index.js

@@ -12,7 +12,7 @@ import { Container, Row, Col } from 'grid'
 import { createGetObjectsOfType, createSelector } from 'selectors'
 import { formatIps, getNextIpV4, parseIpPattern } from 'ip'
 import { injectIntl } from 'react-intl'
-import { Input as DebounceInput } from 'debounce-component-decorator'
+import { Input as DebounceInput } from 'debounce-input-decorator'
 import { renderXoItemFromId } from 'render-xo-item'
 import { SelectNetwork } from 'select-objects'
 import { Text } from 'editable'

yarn.lock

@@ -2544,6 +2544,12 @@ dateformat@^2.0.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/dateformat/-/dateformat-2.2.0.tgz#4065e2013cf9fb916ddfd82efb506ad4c6769062"
 
+debounce-input-decorator@^0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/debounce-input-decorator/-/debounce-input-decorator-0.1.0.tgz#e1c4ca7f40fa2d63e7bc4e14ea5dc850fdabaeea"
+  dependencies:
+    lodash "^4.17.4"
+
 debug-fabulous@1.X:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/debug-fabulous/-/debug-fabulous-1.0.0.tgz#57f6648646097b1b0849dcda0017362c1ec00f8b"