src props of Avatar doesn't work as expected

[guoqikai]

Current Behavior

When passing url through the src prop, the image is always blank.

Expected Behavior

Image should load

Tamagui Version

1.90.12

Platform (Web, iOS, Android)

iOS, Android

Reproduction

import { Avatar } from 'tamagui'

export default () => (
  <Avatar circular size="$6">
    <Avatar.Image src="http://placekitten.com/200/300" />
    <Avatar.Fallback bc="red" />
  </Avatar>
)

System Info

No response

[ehxxn]

I'm not able to re-produce

[ehxxn]

oh it's on native

[ehxxn]

the issue is actually with http it should be https to work.
there should some configs with expo to disable this

[guoqikai]

@TheEhsanSarshar Seems like it's an issue with the Image component in this library. There's also an issue when I try to load an image with file protocol:
<Image flex={1} source={{ uri: fileUrl }} />
This will show nothing. While changing the Image component to the native one fix the problem

[ehxxn]

emmm, just tested and it seems working fine

[guoqikai]

@TheEhsanSarshar Hmm interesting i'll investigate further and get back to you. I'm pretty sure all these issues happen after I upgrade tamagui version tho

[StefanEissler]

I face the same issue in the monorepo. I did not check native, but in nextjs it is showing up in the html file but not rendering the picture.

I read a picture with https://... With the normal <Image /> Tag it works fine.

<Avatar circular size="$5">
                        <Avatar.Image
                            src={profile?.avatar_url}
                        />
                        <Avatar.Fallback backgroundColor="$blue10" delayMs={600} />
</Avatar>

It worked for me all the time until I updated my tamagui version.

[guoqikai]

@TheEhsanSarshar I tried the example with https and it still doesn't work. Using the source prop with width and height set works(e.g. <Image source={{width: 50, heigh:50, uri}}/>). But both width and height must be set to a non-zero value and it's bit awkward as we don't know the image demission in most of the time. The issue can be reproduced on both Android and ios so I doubt it's related to http/https.

[StefanEissler]

Are there any news on this?
I meet this issue in web nextjs version.
I have tried to reinstall tamagui. I added the package for Avatars to my packages.

When I remove the class of the Tag it works...