use leptos::prelude::*;
use wasm_bindgen_futures::spawn_local;

use crate::api::{self, Me};
use crate::components::toast::{provide_toast, ToastView};
use crate::router::Location;
use crate::views::browser::Browser;
use crate::views::shares::SharesPanel;

#[component]
pub fn ShellView(
    me: ReadSignal<Option<Me>>,
    set_me: WriteSignal<Option<Me>>,
    set_phase: WriteSignal<crate::app::AuthPhase>,
    loc: ReadSignal<Location>,
) -> impl IntoView {
    let toast = provide_toast();
    let (show_shares, set_show_shares) = signal(false);

    let on_logout = move |_| {
        spawn_local(async move {
            let _ = api::logout().await;
            set_me.set(None);
            set_phase.set(crate::app::AuthPhase::Login);
        });
    };

    view! {
        <div class="layout">
            <header class="topbar">
                <div class="brand">"📂 filebrowser-ng"</div>
                <div class="topbar-right">
                    {move || {
                        let Some(m) = me.get() else {
                            return None;
                        };
                        let u = m.user?;
                        let is_admin = u.is_admin;
                        Some(
                            view! {
                                <span class="user-badge">
                                    {u.name}
                                    <Show when=move || is_admin>
                                        <span class="badge">"admin"</span>
                                    </Show>
                                </span>
                            }
                            .into_view()
                            .into_any(),
                        )
                    }}
                    <button class="btn" on:click=move |_| set_show_shares.set(true)>"Shares"</button>
                    <button class="btn" on:click=on_logout>"Log out"</button>
                </div>
            </header>
            <main class="content">
                <Browser me=me loc=loc/>
            </main>
            {move || if show_shares.get() {
                view! {
                    <SharesPanel close=Callback::new(move |_| set_show_shares.set(false))/>
                }
                .into_view()
                .into_any()
            } else {
                view! {}.into_any()
            }}
            <ToastView toast=toast/>
        </div>
    }
}