import React from 'react';
import {StyleProp, TouchableOpacity, ViewStyle} from 'react-native';
import Icon, {IconName, IconSizeType} from '@components/Icon';
import {goBack} from '@navigation/navigator';
import {SPACING} from '@shared/theme';

import {styles} from './styles';

interface BackButtonProps {
  onPress?: () => void;
  iconSize?: IconSizeType;
  image?: IconName;
  color?: string;
  style?: StyleProp<ViewStyle>;
}

/**
 * @deprecated - Use `_HuGo/Button/BackButton` instead
 */
function BackButton({
  iconSize,
  onPress = goBack,
  image = 'arrowBack',
  color,
  style = styles.defaultStyle,
}: BackButtonProps) {
  return (
    <TouchableOpacity
      onPress={onPress}
      style={style}
      testID="back-button"
      hitSlop={SPACING.x2}>
      <Icon name={image} size={iconSize} color={color} />
    </TouchableOpacity>
  );
}

export default BackButton;
