{{ define "sbom-details" }}
{{ if .NotScanned }}
    <p class="text-base-content/70">No SBOM available yet. The scanner generates an SBOM alongside each scan.</p>
{{ else if .Error }}
    <div class="alert alert-error" role="alert">
        {{ icon "alert-circle" "size-5 shrink-0" }}
        <span>{{ .Error }}</span>
    </div>
    {{ if .ScannedAt }}<p class="text-xs text-base-content/60 mt-2">Scanned: {{ .ScannedAt }}</p>{{ end }}
{{ else }}
<div class="space-y-4" data-csv-section data-csv-filename="sbom.csv">
    <div class="flex flex-wrap items-center gap-3">
        <span class="font-semibold text-sm">{{ .Total }} {{ pluralize .Total "package" "packages" }}</span>
        {{ if .Packages }}
        <details class="dropdown dropdown-end ml-auto">
            <summary class="btn btn-ghost btn-xs gap-1 list-none" aria-label="Export SBOM">
                {{ icon "download" "size-3.5" }}
                {{ icon "chevron-down" "size-3" }}
            </summary>
            <ul class="dropdown-content menu bg-base-200 rounded-box z-50 w-52 p-2 shadow-lg border border-base-300">
                <li><button type="button" data-copy-csv>{{ icon "copy" "size-4" }} Copy as CSV</button></li>
                <li><a href="/api/scan-download?type=sbom&digest={{ .Digest | urlquery }}&holdEndpoint={{ .HoldEndpoint | urlquery }}" download>{{ icon "download" "size-4" }} SPDX JSON</a></li>
            </ul>
        </details>
        {{ end }}
    </div>

    {{ if .ScannedAt }}<p class="text-xs text-base-content/60">Scanned: {{ .ScannedAt }}</p>{{ end }}

    {{ if .Packages }}
    <div class="overflow-y-auto max-h-128">
        <table class="table table-xs table-pin-rows w-full table-fixed">
            <caption class="sr-only">SBOM package list</caption>
            <colgroup>
                <col class="w-5/12">
                <col class="w-3/12">
                <col class="w-3/12">
                <col class="w-1/12">
            </colgroup>
            <thead>
                <tr>
                    <th scope="col">Package</th>
                    <th scope="col">Version</th>
                    <th scope="col">License</th>
                    <th scope="col">Type</th>
                </tr>
            </thead>
            <tbody>
                {{ range .Packages }}
                <tr>
                    <td class="text-xs truncate" title="{{ .Name }}">{{ if .URL }}<a href="{{ .URL }}" target="_blank" rel="noopener noreferrer" class="link link-primary">{{ .Name }}</a>{{ else }}{{ .Name }}{{ end }}</td>
                    <td class="font-mono text-xs truncate" title="{{ .Version }}">{{ .Version }}</td>
                    <td class="text-xs truncate" title="{{ .License }}">
                        {{ if eq .License "-" }}
                            <span class="text-base-content/40">-</span>
                        {{ else }}
                            {{ .License }}
                        {{ end }}
                    </td>
                    <td class="text-xs">
                        {{ if .Type }}
                            <span class="badge badge-xs badge-ghost">{{ .Type }}</span>
                        {{ else }}
                            <span class="text-base-content/40">-</span>
                        {{ end }}
                    </td>
                </tr>
                {{ end }}
            </tbody>
        </table>
    </div>
    {{ else }}
    <p class="text-base-content">No packages found in SBOM</p>
    {{ end }}
</div>
{{ end }}
{{ end }}