use leptos::prelude::*;

use crate::content_graph::{graph_mini::GraphMini, ontology_context::OntologyContext, related_content::RelatedContent};

/// Local adapter for the PostViewer page.
///
/// Routes both SSR and WASM through `PostViewerPageClient`, which:
/// - On SSR: loads markdown synchronously via `load_content_by_slug` for SEO
/// - On WASM: fetches via `/api/content-render/…` + handles language switching
///
/// Both paths emit the same `{move || …}` DynChild structure → hydration safe.
///
/// Renders a two-column layout: post content on the left, graph sidebar on the
/// right (RelatedContent, OntologyContext, GraphMini). The `slug` prop doubles
/// as the content graph node id for sidebar lookups — if the node is not in the
/// graph the sidebar components render nothing.
#[component]
pub fn UnifiedPostViewerPage(
    #[prop(default = rustelo_content::rustelo_core_lib::config::get_default_language().to_string())]
    _language: String,
    #[allow(unused_variables)]
    #[prop(optional)]
    lang_content: Option<std::collections::HashMap<String, String>>,
    #[prop(default = "content".to_string())] content_type: String,
    #[prop(default = "".to_string())] slug: String,
    #[allow(unused_variables)]
    #[prop(default = "".to_string())]
    category: String,
) -> impl IntoView {
    let node_id = slug.clone();

    view! {
        <div class="ds-container py-ds-6">
            <div class="lg:grid lg:grid-cols-[1fr_280px] lg:gap-8 space-y-6 lg:space-y-0">
                <main class="min-w-0">
                    <rustelo_pages_leptos::post_viewer::client::PostViewerPageClient
                        _language=_language
                        content_type=content_type
                        slug=slug
                    />
                </main>
                <aside class="space-y-4 shrink-0">
                    <GraphMini node_id=node_id.clone() />
                    <RelatedContent node_id=node_id.clone() />
                    <OntologyContext node_id=node_id />
                </aside>
            </div>
        </div>
    }
}
