Function DocsIndexPage

perro_website/src/pages/docs.rs:11–73

()

use crate::shared::{Seo, SeoInfo};

#[component]
pub fn DocsIndexPage() -> impl IntoView {
    let groups = docs_by_nav_group();
    let doc_count = groups.iter().map(|(_, count)| count).sum::<usize>();
    let query_map = use_query_map();
    let selected_group = move || query_map.with(|map| map.get("group"));
    let query = RwSignal::new(String::new());
    view! {
        <Seo info=SeoInfo::new(
            "Docs",
            "Browse Perro documentation for scripting, runtime APIs, resource APIs, input APIs, scene nodes, assets, examples, and CLI workflows.",
            "Perro docs, Perro API reference, Perro scripting docs, Perro nodes, Perro examples, Perro CLI docs, resource API, input API",
            "/docs",
        ) />
        <PageFrame eyebrow="Docs" title="Perro Documentation">
            <div class="doc-layout">
                <aside class="doc-filter">
                    <h2>"Explore"</h2>
                    <a href="/docs"><span>"All"</span><small>{doc_count}</small></a>
                    {groups.into_iter().map(|(group, count)| {
                        let href = format!("/docs?group={group}");
                        view! {
                        <a href=href><span>{group}</span><small>{count}</small></a>
                    }}).collect_view()}
                </aside>
                <div class="doc-results">
                    <div class="doc-intro">
                        <div>
                            <p class="eyebrow">"Start Here"</p>
                            <h2>"Book first, docs when you need detail"</h2>
                            <p>"Use the book for the linear path. Use docs for focused API, runtime, asset, and tool reference."</p>
                        </div>
                        <a class="btn primary" href="/book">"Open Book"</a>
                    </div>
                    <input
                        class="search"
                        id="docs-search"
                        type="search"
                        placeholder="Search every guide, API, and system…  /"
                        aria-label="Search documentation"
                        on:input=move |ev| query.set(event_target_value(&ev))
                    />
                    {move || grouped_docs_filtered_for_nav(&query.get(), selected_group().as_deref()).into_iter().map(|(group, docs)| view! {
                        <section class="docs-section" id=format!("group-{}", group.to_ascii_lowercase())>
                            <div class="docs-section-head">
                                <h2>{group}</h2>
                                <span>{docs.len()}" pages"</span>
                            </div>
                            <div class="doc-list">
                                {docs.into_iter().map(|doc| view! {
                                    <a class="doc-row" href=doc.route_path.as_str()>
                                        <span class="doc-row-main">
                                            <strong>{doc.title.as_str()}</strong>
                                            <span>{doc.summary.as_str()}</span>
                                        </span>
                                        <span class="doc-row-meta">{doc.nav_group.as_str()}</span>
                                    </a>
                                }).collect_view()}