import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
// Copyright 1999-2020. Plesk International GmbH. All rights reserved.
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import Dialog from '../Dialog';
import { CLS_PREFIX } from '../../constants';
import Translate from '../Translate';
import { safeInvoke } from '../utils';
import { STATUS_DONE, STATUS_ERROR } from '../ProgressStep';
import Progress from '../Progress';

/**
 * `ProgressDialog` is a [Dialog](#!/Dialog) combined with of [Progress](#!/Progress) component.
 * @since 1.2.0
 */
class ProgressDialog extends Component {
  constructor(...args) {
    super(...args);

    _defineProperty(this, "state", {
      isOpen: false,
      isFinished: false,
      isFailed: false
    });

    _defineProperty(this, "closeTimeout", null);

    _defineProperty(this, "handleStatusChange", status => {
      this.setState({
        isFinished: status === STATUS_DONE,
        isFailed: status === STATUS_ERROR
      });
    });

    _defineProperty(this, "handleClose", () => {
      const {
        onClose,
        onCancel,
        onFinish,
        onFail,
        cancelable
      } = this.props;
      const {
        isOpen,
        isFinished,
        isFailed
      } = this.state;
      clearTimeout(this.closeTimeout);

      if (!isOpen) {
        return;
      }

      if (isFinished) {
        safeInvoke(onFinish);
      } else if (isFailed) {
        safeInvoke(onFail);
      } else if (cancelable) {
        safeInvoke(onCancel);
      }

      this.setState({
        isOpen: false
      }, () => safeInvoke(onClose));
    });
  }

  static getDerivedStateFromProps({
    isOpen
  }) {
    return {
      isOpen
    };
  }

  componentDidUpdate(prevProps, prevState) {
    const {
      isFinished
    } = this.state;
    const {
      autoCloseTimeout
    } = this.props;

    if (prevState.isFinished === false && isFinished === true) {
      clearTimeout(this.closeTimeout);

      if (autoCloseTimeout) {
        this.closeTimeout = setTimeout(this.handleClose, autoCloseTimeout);
      }
    }
  }

  componentWillUnmount() {
    clearTimeout(this.closeTimeout);
  }

  render() {
    const {
      baseClassName,
      className,
      children,
      description,
      cancelable,
      autoCloseTimeout,
      onCancel,
      onClose,
      onFinish,
      onFail,
      ...props
    } = this.props;
    const {
      isOpen,
      isFinished,
      isFailed
    } = this.state;
    const canClose = isFinished || isFailed;
    const canCancel = cancelable && !canClose;
    const cancelTitle = canClose ? /*#__PURE__*/React.createElement(Translate, {
      content: "ProgressDialog.closeButton",
      fallback: "Close"
    }) : /*#__PURE__*/React.createElement(Translate, {
      content: "ProgressDialog.cancelButton",
      fallback: "Cancel"
    });
    return /*#__PURE__*/React.createElement(Dialog, _extends({
      className: classNames(baseClassName, className),
      size: "xs",
      cancelTitle: cancelTitle
    }, props, {
      isOpen: isOpen,
      onClose: this.handleClose,
      closable: canClose || canCancel,
      canClose: canClose
    }), description && /*#__PURE__*/React.createElement("div", {
      className: `${baseClassName}__description`
    }, description), /*#__PURE__*/React.createElement(Progress, {
      className: `${baseClassName}__content`,
      onStatusChange: this.handleStatusChange
    }, children));
  }

}

ProgressDialog.propTypes = {
  /**
   * Toggles visibility.
   * @since 1.2.0
   */
  isOpen: PropTypes.bool,

  /**
   * Banner. Renders in front of content as wide as dialog.
   * @since 1.2.0
   */
  banner: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.element]),

  /**
   * Image. Renders into content.
   * @since 1.2.0
   */
  image: PropTypes.oneOfType([PropTypes.string, PropTypes.object, PropTypes.element]),

  /**
   * Title
   * @since 1.2.0
   */
  title: PropTypes.node,

  /**
   * Description of the `ProgressDialog`.
   * @since 1.2.0
   */
  description: PropTypes.node,

  /**
   * Actions which will be shown in Dialog header.
   * @since 1.2.0
   */
  actions: PropTypes.node,

  /**
   * Whether the dialog should be canceled with the cancel button.
   * @since 1.2.0
   */
  cancelable: PropTypes.bool,

  /**
   * The interval of time to auto close dialog when it successful finished.
   * Set `null` for disable auto close.
   * @since 1.2.0
   */
  autoCloseTimeout: PropTypes.number,

  /**
   * On cancel event handler.
   * @since 1.2.0
   */
  onCancel: PropTypes.func,

  /**
   * On close event handler.
   * @since 1.2.0
   */
  onClose: PropTypes.func,

  /**
   * On finish event handler.
   * @since 1.2.0
   */
  onFinish: PropTypes.func,

  /**
   * On fail event handler.
   * @since 1.2.0
   */
  onFail: PropTypes.func,

  /**
   * Content of the `ProgressDialog`.
   * @since 1.2.0
   */
  children: PropTypes.node,

  /**
   * @ignore
   */
  className: PropTypes.string,

  /**
   * @ignore
   */
  baseClassName: PropTypes.string
};
ProgressDialog.defaultProps = {
  isOpen: false,
  banner: null,
  image: null,
  title: null,
  description: null,
  actions: null,
  cancelable: false,
  autoCloseTimeout: 3000,
  onCancel: null,
  onClose: null,
  onFinish: null,
  onFail: null,
  children: null,
  className: null,
  baseClassName: `${CLS_PREFIX}progress-dialog`
};
export default ProgressDialog;