import React from 'react';
import PropTypes from 'prop-types';
import debounce from 'lodash/debounce';

const withDebounce = (Touchable) => {
  class DebouncedComponent extends React.PureComponent {
    constructor(props) {
      super(props);
      const { onPress } = props;
      this.onPress = debounce(() => onPress && onPress(), 300, {
        leading: true,
        trailing: false,
      });
    }

    render() {
      return <Touchable {...this.props} onPress={this.onPress} />;
    }
  }

  DebouncedComponent.defaultProps = {
    onPress: null,
  };

  DebouncedComponent.propTypes = {
    onPress: PropTypes.func,
  };

  return DebouncedComponent;
};

export default withDebounce;