import Styles from "@/constants/Styles";
import { useTheme } from "@/providers/ThemeProvider";
import { useState } from "react";
import { Image } from "react-native";

type Props = {
   src: string,
   size?: 'sm' | 'xs' | 'lg'
   border?: boolean
   onError?: (val:boolean) => void
}

export default function ImageUser({ src, size, border = true, onError }: Props) {
   const [error, setError] = useState(false)
   const { colors } = useTheme()
   return (
      <Image
         source={error ? require('../assets/images/user.jpg') : { uri: src }}
         style={[
            size == 'xs' ? Styles.userProfileExtraSmall : size == 'lg' ? Styles.userProfileBig : Styles.userProfileSmall,
            border && { borderWidth: 1, borderColor: colors.icon + '40', borderRadius: 100 }
         ]}
         onError={() => {
            setError(true)
            onError?.(true)
         }}
      />
   )
}