🎨 Isolate infra and ui components

The src/base.rs is still to be reworked.

src/ui/components/contacts_window/user_infos.rs

@@ -0,0 +1,76 @@
+use dioxus::prelude::*;
+use tracing::debug;
+
+use crate::ui::components::avatar_selector::AvatarSelector;
+use crate::ui::components::icons::DownArrowIcon;
+
+turf::style_sheet!("src/ui/components/contacts_window/user_infos.scss");
+
+static MESSAGE_PLACEHOLDER: &str = "<Enter a personal message>";
+
+pub fn UserInfos() -> Element {
+    debug!("UserInfos rendering");
+
+    // let app_settings = use_atom_ref(cx, &APP_SETTINGS);
+    // let store = &app_settings.read().store;
+
+    // println!("----------------------------------");
+    // println!("UserInfos rendering");
+    // // println!("store={:?}", &store);
+    // dbg!(&store.user_id);
+    // println!("----------------------------------");
+
+    // let user_id = store.user_id..as_ref().unwrap();
+
+    // let mut user_info_option = None;
+    let user_display_name_option: Option<bool> = None;
+    let user_display_name = "AIE";
+
+    // let user_id_option = &store.user_id;
+    // if user_id_option.is_some() {
+    //     let user_id = user_id_option.as_ref().unwrap();
+    //     let user_info_option = store.user_infos.get(user_id);
+    //     if user_info_option.is_some() {
+    //         user_display_name_option = user_info_option.unwrap().display_name.as_ref();
+    //     }
+    // }
+
+    rsx! {
+        style { {STYLE_SHEET} },
+
+        div {
+            class: ClassName::USER_INFO,
+
+            div {
+                class: ClassName::AVATAR_SELECTOR,
+                AvatarSelector {},
+            },
+
+            div {
+                class: ClassName::INFO_CONTAINER,
+
+                div {
+                    class: ClassName::USER_ID,
+                    p {
+                        class: ClassName::USER_NAME,
+                        if user_display_name_option.is_some() { "{user_display_name}" } else { "AIE" },
+                    },
+                    p {
+                        class: ClassName::USER_STATUS,
+                        "(Busy)",
+                    },
+                    DownArrowIcon {},
+                },
+
+                div {
+                    class: ClassName::USER_MESSAGE,
+                    p {
+                        // TODO: Handle user message
+                        {MESSAGE_PLACEHOLDER},
+                    }
+                    DownArrowIcon {},
+                },
+            },
+        },
+    }
+}