import React, { PropTypes } from 'react';
import classNames from 'classnames';

export default class AsyncButton extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      isPending: false,
      isFulfilled: false,
      isRejected: false,
    };
  }

  resetState() {
    this.setState({
      isPending: false,
      isFulfilled: false,
      isRejected: false,
    });
  }

  handleClick(...args) {
    this.setState({
      isPending: true,
    });

    const promise = this.props.onClick(args);
    if (promise && promise.then) {
      promise.then(() => {
        this.setState({
          isPending: false,
          isRejected: false,
          isFulfilled: true,
        });
      }).catch((error) => {
        this.setState({
          isPending: false,
          isRejected: true,
          isFulfilled: false,
        });
        throw error;
      });
    } else {
      this.resetState();
    }
  }

  render() {
    const { isPending, isFulfilled, isRejected } = this.state;
    const { children, className, loadingClass, text, pendingText, fulFilledText, rejectedText } = this.props;
    const isDisabled = this.props.disabled || isPending;
    let buttonText;

    if (isPending) {
      buttonText = pendingText;
    } else if (isFulfilled) {
      buttonText = fulFilledText;
    } else if (isRejected) {
      buttonText = rejectedText;
    }
    buttonText = buttonText || text;
    const btnClasses = classNames(className, {
      [`${loadingClass || 'loading'}`]: isPending,
    });

    return (
      <button {...this.props} className={btnClasses} disabled={isDisabled} onClick={() => this.handleClick()}>
        {children || buttonText}
      </button>
		);
  }
}

AsyncButton.propTypes = {
  children: PropTypes.element,
  className: PropTypes.string,
  loadingClass: PropTypes.string,
  disabled: PropTypes.bool,
  text: PropTypes.string,
  pendingText: PropTypes.string,
  fulFilledText: PropTypes.string,
  rejectedText: PropTypes.string,
  onClick: PropTypes.func,
};

@@ -1028,16 +1028,22 @@
  const %7B
+%0A     
  childre
@@ -1048,39 +1048,26 @@
 ren,
- className, loadingClass, text,
+%0A      text,%0A     
  pen
@@ -1075,16 +1075,22 @@
 ingText,
+%0A     
  fulFill
@@ -1096,16 +1096,22 @@
 ledText,
+%0A     
  rejecte
@@ -1115,16 +1115,101 @@
 ctedText
+,%0A      className,%0A      loadingClass,%0A      fulFilledClass,%0A      rejectedClass,%0A   
  %7D = thi
@@ -1591,16 +1591,29 @@
 ass %7C%7C '
+AsyncButton--
 loading'
@@ -1628,16 +1628,153 @@
 ending,%0A
+      %5B%60$%7BfulFilledClass %7C%7C 'AsyncButton--fulfilled'%7D%60%5D: isFulfilled,%0A      %5B%60$%7BrejectedClass %7C%7C 'AsyncButton--rejected'%7D%60%5D: isRejected,%0A
     %7D);%0A
@@ -2047,16 +2047,16 @@
 string,%0A
-
   loadin
@@ -2081,16 +2081,87 @@
 string,%0A
+  fulFilledClass: PropTypes.string,%0A  rejectedClass: PropTypes.string,%0A
   disabl

Support for custom fulfilled & rejected class