@page "/docs/{Slug}"
@inject DocsService DocsService

<PageTitle>@(doc?.Title ?? "Not Found")</PageTitle>

@if (loading)
{
    <p>Loading...</p>
}
else if (doc == null)
{
    <h1>Not Found</h1>
    <p>The document "@Slug" could not be found.</p>
    <a href="/docs">&larr; Back to Docs</a>
}
else
{
    <h1>
        @doc.Title
        @if (!string.IsNullOrEmpty(doc.Category))
        {
            <span class="category-badge">@doc.Category</span>
        }
    </h1>

    @if (!string.IsNullOrEmpty(doc.FrontmatterHtml))
    {
        <details class="frontmatter-section" open>
            <summary>Frontmatter</summary>
            @((MarkupString)doc.FrontmatterHtml)
        </details>
    }

    <div class="markdown-body">
        @((MarkupString)doc.HtmlContent)
    </div>
}

@code {
    [Parameter] public string Slug { get; set; } = "";

    private NoteDocument? doc;
    private bool loading = true;

    protected override async Task OnParametersSetAsync()
    {
        loading = true;
        doc = null;
        doc = await DocsService.GetNoteAsync(Slug);
        loading = false;
    }

}
