function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

/*
Copyright (c) Uber Technologies, Inc.

This source code is licensed under the MIT license found in the
LICENSE file in the root directory of this source tree.
*/
import * as React from 'react';
import { Button, SIZE, KIND, SHAPE } from '../button';
import { StyledBaseButtonTimed, StyledTimerContainer } from './styled-components';
import { formatTime } from './utils';
import { getOverrides, mergeOverrides } from '../helpers/overrides';

const ButtonTimed = props => {
  const {
    initialTime,
    // in seconds
    paused = false,
    onClick: onClickProp,
    disabled,
    children,
    overrides = {},
    ...restProps
  } = props;
  const [startTime, setStartTime] = React.useState(Date.now());
  const [timeRemaining, setTimeRemaining] = React.useState(initialTime * 1000);
  React.useEffect(() => {
    if (!paused) {
      setStartTime(Date.now() - (initialTime * 1000 - timeRemaining));
    } // eslint-disable-next-line react-hooks/exhaustive-deps

  }, [paused, initialTime]);
  React.useEffect(() => {
    const intervalId = setInterval(() => {
      if (!paused) {
        const elapsed = Date.now() - startTime;
        const remaining = Math.max(initialTime * 1000 - elapsed, 0);
        setTimeRemaining(remaining);

        if (remaining === 0) {
          onClickProp();
        }
      }
    }, 100);
    return () => clearInterval(intervalId);
  }, [startTime, paused, onClickProp, initialTime]);

  const onClick = () => {
    setTimeRemaining(0);
    onClickProp();
  };

  const {
    TimerContainer: TimerContainerOverride,
    ...buttonOverrides
  } = overrides;
  const [TimerContainer, timerContainerProps] = getOverrides(TimerContainerOverride, StyledTimerContainer);
  const buttonMergedOverrides = mergeOverrides({
    BaseButton: {
      component: StyledBaseButtonTimed,
      props: {
        $initialTime: initialTime,
        $timeElapsed: (initialTime * 1000 - timeRemaining) / 1000
      },
      style: {
        ':after': {
          animationPlayState: paused ? 'paused' : 'running'
        }
      }
    }
  }, {
    Root: buttonOverrides.Root || {},
    // @ts-ignore
    BaseButton: buttonOverrides.BaseButton,
    StartEnhancer: buttonOverrides.StartEnhancer || {},
    EndEnhancer: buttonOverrides.EndEnhancer || {},
    LoadingSpinnerContainer: buttonOverrides.LoadingSpinnerContainer || {},
    LoadingSpinner: buttonOverrides.LoadingSpinner || {}
  });
  return /*#__PURE__*/React.createElement(Button, _extends({}, restProps, {
    overrides: buttonMergedOverrides,
    onClick: onClick,
    size: SIZE.large,
    kind: KIND.primary,
    shape: SHAPE.default,
    disabled: disabled || timeRemaining === 0
  }), children, /*#__PURE__*/React.createElement(TimerContainer, timerContainerProps, `(${formatTime(timeRemaining)})`));
};

export default ButtonTimed;