<commit_before>import React from 'react';

export default class PressAndHoldButton extends React.Component {
    componentWillMount() {
        this.timeout = null;
        this.interval = null;
    }
    componentWillUnmount() {
        this.handleRelease();
    }
    handleHoldDown() {
        let that = this;
        let delay = Number(this.props.delay) || 500;
        let throttle = Number(this.props.throttle) || 50;

        this.timeout = setTimeout(function() {
            that.handleRelease();

            that.interval = setInterval(function() {
                if (that.interval) {
                    that.props.onClick();
                }
            }, throttle);
        }, delay);
    }
    handleRelease() {
        if (this.timeout) {
            clearTimeout(this.timeout);
            this.timeout = null;
        }
        if (this.interval) {
            clearInterval(this.interval);
            this.interval = null;
        }
    }
    render() {
        let { type, className, onClick } = this.props;
        type = type || 'button';
        className = className || 'btn';

        return (
            <button
                type={type}
                className={className}
                onClick={onClick}
                onMouseDown={::this.handleHoldDown}<commit_msg>Use joinClasses() to join class with this.props.className<commit_after>import React from 'react';
import joinClasses from 'react/lib/joinClasses';

export default class PressAndHoldButton extends React.Component {
    componentWillMount() {
        this.timeout = null;
        this.interval = null;
    }
    componentWillUnmount() {
        this.handleRelease();
    }
    handleHoldDown() {
        let that = this;
        let delay = Number(this.props.delay) || 500;
        let throttle = Number(this.props.throttle) || 50;

        this.timeout = setTimeout(function() {
            that.handleRelease();

            that.interval = setInterval(function() {
                if (that.interval) {
                    that.props.onClick();
                }
            }, throttle);
        }, delay);
    }
    handleRelease() {
        if (this.timeout) {
            clearTimeout(this.timeout);
            this.timeout = null;
        }
        if (this.interval) {
            clearInterval(this.interval);
            this.interval = null;
        }
    }
    render() {
        let { type, className, onClick } = this.props;
        type = type || 'button';
        className = joinClasses('btn', className);

        return (
            <button
                type={type}
                className={className}
                onClick={onClick}
                onMouseDown={::this.handleHoldDown}
{'fraction_non_alphanumeric': 0.11331861662987491, 'fraction_numerical': 0.003679175864606328, 'mean_word_length': 1.6398058252427183, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4258180', 'n_tokens_mistral': 730, 'n_tokens_neox': 688, 'n_words': 145}