use filamento::user::UserStoreFields;
use leptos::prelude::*;
use reactive_stores::ArcStore;

use crate::{chat::MacawChat, components::avatar::AvatarWithPresence, user::get_name};

#[component]
pub fn ChatViewHeader(chat: MacawChat) -> impl IntoView {
    let name = move || get_name(chat.user.get().into(), true);
    let jid = move || chat.user.get().jid().read().to_string();

    view! {
        <div class="chat-view-header panel">
            {move || {
                let user = chat.user.get().into();
                view! {
                    <AvatarWithPresence user />
                }
            }}
            <div class="user-info">
                <h2 class="name">{name}</h2>
                <h3>{jid}</h3>
            </div>
        </div>
    }
}