use dioxus::prelude::*;

use crate::Route;
use crate::auth::{ToastState, broadcast_sign_out, logout_url};
use crate::session::SessionIdentity;

#[allow(clippy::useless_format)]
#[component]
pub(crate) fn SessionControl(
    session: Signal<SessionIdentity>,
    toasts: Signal<ToastState>,
) -> Element {
    let identity = session.read().clone();

    match identity {
        SessionIdentity::Anonymous => rsx! {
           form {
               class: "session-control",
               action: "/oauth/start",
               method: "get",
               input { r#type: "hidden", name: "return_to", value: "/" },
               input {
                    r#type: "text",
                    name: "identifier",
                    placeholder: "handle.test",
                    aria_label: "ATProto handle",
                }
                button { class: "button button-primary", r#type: "submit", "Sign in" }
            }
        },
        SessionIdentity::Authenticated(identity) => {
            let label = identity.label().to_string();
            let handle = identity.handle.as_str().to_string();
            let avatar_url = identity.avatar.as_ref().map(|u| u.as_ref().to_string());
            let initial = label.chars().next().unwrap_or('?').to_ascii_uppercase();
            rsx! {
                details { class: "account-menu",
                    summary { class: "account-trigger", aria_label: "Account menu for {label}",
                        if let Some(url) = &avatar_url {
                            img { class: "session-avatar", src: "{url}", alt: "{label}", loading: "lazy" }
                        } else {
                            span { class: "session-avatar session-avatar-fallback", aria_hidden: "true", "{initial}" }
                        }
                    }
                    div { class: "account-menu-panel blueprint-panel",
                        div { class: "account-menu-identity",
                            strong { "{label}" }
                            span { class: "account-menu-handle", "@{handle}" }
                        }
                        Link { class: "account-menu-item", to: Route::ProfileSelf {}, "Profile" }
                        form { class: "account-menu-form", method: "post", action: "{logout_url()}",
                            button {
                                class: "account-menu-item account-menu-signout",
                                r#type: "submit",
                                onclick: move |_| {
                                    broadcast_sign_out();
                                    session.set(SessionIdentity::Anonymous);
                                    toasts.write().push("Signing out…");
                                },
                                "Sign out"
                            }
                        }
                    }
                }
            }
        }
    }
}

#[allow(clippy::useless_format)]
#[component]
pub(crate) fn ToastShelf(toasts: Signal<ToastState>) -> Element {
    let items = toasts.read().items().to_vec();

    rsx! {
        div { class: "toast-shelf", aria_live: "polite",
            for toast in items {
                div { key: "toast-{toast.id}", class: "toast blueprint-panel",
                    span { "{toast.message}" }
                    button {
                        class: "toast-dismiss",
                        aria_label: "Dismiss notification",
                        onclick: move |_| toasts.write().dismiss(toast.id),
                        "×"
                    }
                }
            }
        }
    }
}
