diff --git a/crates/ui/src/components/avatar/avatar.rs b/crates/ui/src/components/avatar/avatar.rs index 4106b17452fd2582e605d6a1ceee22ed1c61311e..f0e516c7b19c7a2edcba416a7ba00323f24c2ecb 100644 --- a/crates/ui/src/components/avatar/avatar.rs +++ b/crates/ui/src/components/avatar/avatar.rs @@ -2,6 +2,16 @@ use crate::prelude::*; use gpui::{img, AnyElement, Hsla, ImageSource, Img, IntoElement, Styled}; +/// The shape of an [`Avatar`]. +#[derive(Debug, Default, PartialEq, Clone)] +pub enum AvatarShape { + /// The avatar is shown in a circle. + #[default] + Circle, + /// The avatar is shown in a rectangle with rounded corners. + RoundedRectangle, +} + /// An element that renders a user avatar with customizable appearance options. /// /// # Examples @@ -10,6 +20,7 @@ use gpui::{img, AnyElement, Hsla, ImageSource, Img, IntoElement, Styled}; /// use ui::{Avatar, AvatarShape}; /// /// Avatar::new("path/to/image.png") +/// .shape(AvatarShape::Circle) /// .grayscale(true) /// .border_color(gpui::red()); /// ``` @@ -32,6 +43,27 @@ impl Avatar { } } + /// Sets the shape of the avatar image. + /// + /// This method allows the shape of the avatar to be specified using an [`AvatarShape`]. + /// It modifies the corner radius of the image to match the specified shape. + /// + /// # Examples + /// + /// ``` + /// use ui::{Avatar, AvatarShape}; + /// + /// Avatar::new("path/to/image.png").shape(AvatarShape::Circle); + /// ``` + /// + pub fn shape(mut self, shape: AvatarShape) -> Self { + self.image = match shape { + AvatarShape::Circle => self.image.rounded_full(), + AvatarShape::RoundedRectangle => self.image.rounded_md(), + }; + self + } + /// Applies a grayscale filter to the avatar image. /// /// # Examples @@ -71,6 +103,10 @@ impl Avatar { impl RenderOnce for Avatar { fn render(mut self, cx: &mut WindowContext) -> impl IntoElement { + if self.image.style().corner_radii.top_left.is_none() { + self = self.shape(AvatarShape::Circle); + } + let border_width = if self.border_color.is_some() { px(2.) } else {