@model StoryAssetListViewModel
@{
    ViewData["Title"] = "Story Assets";
}

<section class="context-header">
    <div class="context-title"><span class="eyebrow">Project context</span><strong>@Model.Project.ProjectName</strong></div>
    <nav class="context-nav" aria-label="Project navigation">
        <a asp-controller="Projects" asp-action="Details" asp-route-id="@Model.Project.ProjectID">Project</a>
        <a asp-controller="Timeline" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID">Timeline</a>
        <a asp-controller="Analytics" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID">Story health</a>
        <a asp-controller="Warnings" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID">Warnings</a>
        <a asp-controller="Characters" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID">Characters</a>
        <a asp-controller="Locations" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID">Locations</a>
        <a asp-controller="PlotThreads" asp-action="Index" asp-route-projectId="@Model.Project.ProjectID">Threads</a>
    </nav>
</section>

<div class="page-heading">
    <div>
        <p class="eyebrow">Story assets</p>
        <h1>@Model.Project.ProjectName</h1>
    </div>
    <div class="button-row">
        <a class="btn btn-outline-secondary" asp-controller="Projects" asp-action="Details" asp-route-id="@Model.Project.ProjectID">Project</a>
        <a class="btn btn-primary" asp-action="Create" asp-route-projectId="@Model.Project.ProjectID">Add asset</a>
    </div>
</div>

<section class="list-section">
    @if (!Model.Assets.Any())
    {
        <p class="muted">No story assets yet. Add an object, clue, secret or other story item to track it across scenes.</p>
    }
    else
    {
        <div class="asset-card-grid">
            @foreach (var asset in Model.Assets)
            {
                <article class="asset-card">
                    <div>
                        <p class="eyebrow">@asset.KindName</p>
                        <h2><a asp-action="Details" asp-route-id="@asset.StoryAssetID">@asset.AssetName</a></h2>
                        <p class="muted">@asset.Description</p>
                    </div>
                    <div class="asset-card-footer">
                        <span class="status-pill">Importance @asset.Importance</span>
                        <span class="purpose-chip">@(asset.CurrentStateName ?? "No state")</span>
                        @if (asset.IsResolved)
                        {
                            <span class="purpose-chip">Resolved</span>
                        }
                        <a class="btn btn-outline-secondary btn-sm ms-auto" asp-action="Edit" asp-route-id="@asset.StoryAssetID">Edit</a>
                    </div>
                </article>
            }
        </div>
    }
</section>