ui: Render fallback icon for avatars that failed to load (#43183)

Lukas Wirth created 1 month ago

Before we were simply not rendering anything which could lead to some
very surprising situations when joining channels ...

Now it will look like so
<img width="147" height="50" alt="image"
src="https://github.com/user-attachments/assets/13069de8-3dc0-45e1-b562-3fe81507dd87"
/>

Release Notes:

- Improved rendering of avatars that failed to load by rendering a
fallback icon

Change summary

crates/ui/src/components/avatar.rs | 7 ++++++-
1 file changed, 6 insertions(+), 1 deletion(-)

Detailed changes

crates/ui/src/components/avatar.rs

@@ -91,7 +91,12 @@ impl RenderOnce for Avatar {
                 self.image
                     .size(image_size)
                     .rounded_full()
-                    .bg(cx.theme().colors().ghost_element_background),
+                    .bg(cx.theme().colors().ghost_element_background)
+                    .with_fallback(|| {
+                        Icon::new(IconName::Person)
+                            .color(Color::Muted)
+                            .into_any_element()
+                    }),
             )
             .children(self.indicator.map(|indicator| div().child(indicator)))
     }