// SPDX-License-Identifier: Apache-2.0
//! Mobile-first sticky bottom navigation.
//!
//! Structure (RFC 004):
//!
//! ```text
//! Library  |  Shared  |  [ + Add ]  |  Sharing  |  Me
//! ```
//!
//! The centre slot is a visually raised FAB (floating action button)
//! that always triggers the upload flow. The four flanking slots are
//! standard nav links. The FAB never receives `aria-current="page"`.

use leptos::prelude::*;
use leptos_router::hooks::use_location;

use crate::components::icons::{IconAlbums, IconKey, IconPlus, IconSettings, IconUsers};
use crate::i18n::t;

#[component]
pub fn BottomPrimaryNav() -> impl IntoView {
    let loc = use_location();

    let active = move |path: &'static str| -> bool {
        let p = loc.pathname.get();
        if path == "/" {
            p == "/"
        } else {
            p == path || p.starts_with(&format!("{path}/"))
        }
    };

    view! {
        <nav class="bottom-nav" role="navigation" aria-label="Primary">
            <div class="bottom-nav__inner">
                // ── Library
                <NavItem
                    href="/"
                    current=Box::new(move || active("/"))
                    label=t("nav.library")
                >
                    <IconAlbums size=22 />
                </NavItem>

                // ── Shared with me
                <NavItem
                    href="/shared"
                    current=Box::new(move || active("/shared"))
                    label=t("nav.shared")
                >
                    <IconUsers size=22 />
                </NavItem>

                // ── Add (FAB — centred raised button, never aria-current)
                <a
                    class="nav-fab"
                    href="/upload"
                    aria-label="Add photos"
                >
                    <span class="nav-fab__icon" aria-hidden="true">
                        <IconPlus size=26 />
                    </span>
                </a>

                // ── My sharing
                <NavItem
                    href="/sharing"
                    current=Box::new(move || active("/sharing"))
                    label=t("nav.sharing")
                >
                    <IconKey size=22 />
                </NavItem>

                // ── Me (account, data, settings, about)
                <NavItem
                    href="/me"
                    current=Box::new(move || active("/me"))
                    label=t("nav.me")
                >
                    <IconSettings size=22 />
                </NavItem>
            </div>
        </nav>
    }
}

#[component]
fn NavItem(
    href: &'static str,
    current: Box<dyn Fn() -> bool + Send + Sync>,
    label: &'static str,
    children: Children,
) -> impl IntoView {
    view! {
        <a
            class="nav-item"
            href=href
            attr:aria-current=move || if current() { Some("page") } else { None }
        >
            <span class="nav-item__icon">{children()}</span>
            <span class="nav-item__label">{label}</span>
            <span class="nav-item__dot" aria-hidden="true"></span>
        </a>
    }
}
