synpad 0.1.0

A full-featured Matrix chat client built with Dioxus
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40

use dioxus::prelude::*;

use crate::utils::room_helpers::{display_name_initials, user_color};

/// Avatar component for users and rooms.
///
/// Shows an image if `url` is provided, otherwise shows initials
/// on a colored background.
#[component]
pub fn Avatar(
    name: String,
    url: Option<String>,
    #[props(default = 36)] size: u32,
) -> Element {
    let initials = display_name_initials(&name);
    let bg_color = user_color(&name);

    rsx! {
        div {
            class: "avatar",
            style: "width: {size}px; height: {size}px; min-width: {size}px;",

            if let Some(ref src) = url {
                img {
                    class: "avatar__image",
                    src: "{src}",
                    alt: "{name}",
                    width: "{size}",
                    height: "{size}",
                }
            } else {
                div {
                    class: "avatar__fallback",
                    style: "background-color: {bg_color}; font-size: {size / 2}px;",
                    "{initials}"
                }
            }
        }
    }
}