import { Button as AntButton } from 'antd';
import { ACTION_DELAY } from 'core/constants/debounce';
import { throttle } from 'lodash';
import { ElementStatus } from 'types/elements';

const Button = ({ status, action, text, ...props }) => {
  const throttledAction = action
    ? throttle(action, ACTION_DELAY, { trailing: false })
    : undefined;
  return (
    <AntButton
      {...props}
      disabled={status === ElementStatus.Disabled}
      loading={status === ElementStatus.Loading}
      onClick={() => {
        if (throttledAction) throttledAction();
      }}
    >
      {text}
    </AntButton>
  );
};

export default Button;
