import React from "react";
import { Button as NButton, IButtonProps } from "native-base";
import debounce from "lodash.debounce";
import type { GestureResponderEvent } from "react-native";

export const Button: React.FC<
  IButtonProps & {
    debounceDuration?: number;
  }
> = (props) => {
  const { children, onPress, debounceDuration, ...rest } = props;

  const onPressDebounce = debounce(
    (event: GestureResponderEvent) => onPress?.(event),
    debounceDuration ?? 500,
    {
      leading: true,
      trailing: false,
    }
  );

  return (
    <NButton onPress={onPressDebounce} {...rest}>
      {!props.isLoading && children}
    </NButton>
  );
};

export default Button;