import {Pressable, PressableProps} from 'react-native';
import {Avatar, AvatarProps} from '@components/_HuGo/Avatar';
import {Typography} from '@components/_core';

import {styles} from './styles';

interface PressableAvatarProps extends PressableProps {
  title: string;
  Icon: AvatarProps['Icon'];
}

export function PressableAvatar({title, Icon, ...props}: PressableAvatarProps) {
  return (
    <Pressable {...props} style={styles.container}>
      <Avatar Icon={Icon} variant="primary" size="lg" />
      <Typography variant="xs" align="center">
        {title}
      </Typography>
    </Pressable>
  );
}
