💄 Open/close ChatPanel on click (Conversations layout/big breakpoint)

This commit is contained in:
2024-06-09 12:31:18 +02:00
parent ffe759e749
commit 271e865d40

View File

@@ -2,7 +2,7 @@ use std::rc::Rc;
use dioxus::prelude::*;
use futures::join;
use tracing::{error, warn};
use tracing::warn;
use crate::ui::{
components::{
@@ -151,9 +151,17 @@ fn LayoutBig() -> Element {
let mut first_div = use_signal(|| None::<Rc<MountedData>>);
let mut last_div = use_signal(|| None::<Rc<MountedData>>);
let conversation_panels_nb = 3;
let conversation_panels = (0..conversation_panels_nb + 1).map(|i| {
if i == 0 {
let displayed_room_ids = STORE.read().displayed_room_ids();
let mut conversation_panels = Vec::new();
let mut displayed_room_ids_it = displayed_room_ids.iter().peekable();
let mut is_first = true;
while let Some(room_id) = displayed_room_ids_it.next() {
if let Some(room) = STORE.read().rooms().get(room_id) {
let room = room.signal();
let room_name_repr = format!("CHAT {}", room.name().unwrap_or(room.id().to_string()));
let panel = if is_first {
is_first = false;
rsx! {
div {
class: ClassName::CONVERSATIONS_VIEW_BIG_CONVERSATION_PANELS_PANEL,
@@ -162,26 +170,33 @@ fn LayoutBig() -> Element {
let _ = data.as_ref().scroll_to(ScrollBehavior::Smooth).await;
first_div.set(Some(data));
},
ChatPanel { name: format!("CHAT #{i}") },
ChatPanel { name: room_name_repr },
}
}
} else if i == conversation_panels_nb {
} else if displayed_room_ids_it.peek().is_none() {
rsx! {
div {
class: ClassName::CONVERSATIONS_VIEW_BIG_CONVERSATION_PANELS_PANEL,
onmounted: move |cx: Event<MountedData>| last_div.set(Some(cx.data())),
ChatPanel { name: format!("CHAT #{i}") },
ChatPanel { name: room_name_repr },
}
}
} else {
rsx! {
div {
class: ClassName::CONVERSATIONS_VIEW_BIG_CONVERSATION_PANELS_PANEL,
ChatPanel { name: format!("CHAT #{i}") },
ChatPanel { name: room_name_repr },
}
}
};
if let Some(panel) = panel {
conversation_panels.push(panel);
}
} else {
warn!("No {} room found", room_id);
}
}
});
rsx! {
style { {STYLE_SHEET} },
@@ -219,7 +234,7 @@ fn LayoutBig() -> Element {
class: ClassName::CONVERSATIONS_VIEW_HEAD,
}
{conversation_panels}
{conversation_panels.iter()}
div {
class: ClassName::CONVERSATIONS_VIEW_TAIL,