blob: e61bf45cc6c83cef7aca536906b7a3440b9f3cfc (
plain) (
tree)
|
|
use std::ops::Deref;
use chrono::Local;
use filamento::{
chat::{Chat, ChatStoreFields, Message, MessageStoreFields},
user::User,
};
use leptos::prelude::*;
use reactive_stores::{ArcStore, Store};
use tracing::debug;
use crate::{
chat::MacawChat,
components::{avatar::AvatarWithPresence, sidebar::Open},
message::MacawMessage,
open_chats::{OpenChatsPanel, OpenChatsPanelStoreFields},
user::get_name,
};
#[component]
pub fn ChatsListItem(chat: MacawChat, message: MacawMessage) -> impl IntoView {
let name = move || get_name(chat.user.get().into(), true);
// TODO: store fine-grained reactivity
let latest_message_body = move || message.get().body().get().body;
let open_chats: Store<OpenChatsPanel> =
use_context().expect("no open chats panel store in context");
let open_chat = move |_| {
debug!("opening chat");
open_chats.update(|open_chats| open_chats.open(chat.into()));
// open_chats.update(|open_chats| open_chats.open(chat.chat.try_get_value().unwrap().get().clone()));
};
let open = move || {
if let Some(open_chat) = &*open_chats.chat_view().read() {
debug!("got open chat: {:?}", open_chat);
if *open_chat == *chat.get().correspondent().read() {
return Open::Focused;
}
}
if let Some(_backgrounded_chat) = open_chats
.chats()
.read()
.get(chat.get().correspondent().read().deref())
{
return Open::Open;
}
Open::Closed
};
let focused = move || open().is_focused();
let open = move || open().is_open();
let date = move || message.get().timestamp().read().naive_local();
let now = move || Local::now().naive_local();
let timeinfo = move || {
if date().date() == now().date() {
// TODO: localisation/config
date().time().format("%H:%M").to_string()
} else {
date().date().format("%d/%m").to_string()
}
};
view! {
<div
class="chats-list-item"
class:open=move || open()
class:focused=move || focused()
on:click=open_chat
>
{move || {
view! { <AvatarWithPresence user=chat.user /> }
}}
<div class="item-info">
<div class="main-info">
<p class="name">{name}</p>
<p class="timestamp">{timeinfo}</p>
</div>
<div class="sub-info">
<p class="message-preview">{latest_message_body}</p>
<p>
<!-- "TODO: delivery or unread state" -->
</p>
</div>
</div>
</div>
}
}
|