import React from 'react';

import { TouchableOpacity } from 'react-native';

import type { StyleProp, ViewStyle, TouchableOpacityProps } from 'react-native';
import Icon from '../Icon';
import type { IconProps, IconName } from '../Icon';

export interface IconButtonProps {
  /**
   * Set how far you can touch from the button.
   */
  hitSlop?: TouchableOpacityProps['hitSlop'];
  /**
   * Name of the Icon.
   */
  icon: IconName;
  /**
   * Disable state of button.
   */
  disabled?: boolean;
  /**
   * Intent of the Icon.
   */
  intent?: IconProps['intent'];
  /**
   * Set the handler to handle press event.
   */
  onPress?: () => void;
  /**
   * Size of the Icon.
   */
  size?: IconProps['size'];
  /**
   * Additional style.
   */
  style?: StyleProp<ViewStyle>;
  /**
   * Testing id of component.
   */
  testID?: string;
}

const IconButton = ({
  hitSlop,
  onPress,
  icon,
  disabled,
  testID,
  style,
  size,
  intent,
}: IconButtonProps) => (
  <TouchableOpacity
    style={style}
    onPress={onPress}
    testID={testID}
    hitSlop={hitSlop}
    disabled={disabled}
  >
    <Icon
      icon={icon}
      size={size}
      intent={disabled ? 'disabled-text' : intent}
    />
  </TouchableOpacity>
);

export default IconButton;