import React, {ReactNode} from 'react';
import {StyleProp, ViewStyle} from 'react-native';
import {IconGif} from '@tabler/icons-react-native';
import {Pressable} from '@components';
import {useTheme} from '@shared/theme';

import {styles} from './styles';

interface Props {
  onPress: () => void;
  style?: StyleProp<ViewStyle>;
  disabled?: boolean;
  disabledColor?: string;
  color?: string;
  CustomIcon?: ReactNode;
}

function GifDisplayer({style, onPress, disabled, color}: Props) {
  const {iconSizes} = useTheme();

  return (
    <Pressable
      style={[style, styles.icon]}
      onPress={onPress}
      disabled={disabled}>
      <IconGif size={iconSizes.x7} color={color} />
    </Pressable>
  );
}

export default GifDisplayer;
