john-okeefe
8ea70ea7f8
Apply the sidebar shell and bold primitives across the rest of the app so the whole experience shares one visual language: - Browse/organize: series (keeps stacked-covers/series-card CSS), collections (keeps wood-paneling + carousel classes), browse_detail. - Account/stats: profile + form + modal, progress, analytics (stat-card tiles), devices, conflicts (status semantics), queue (status/priority badges). - Admin: admin sidebar restyled with icons, dashboard/users/library/ processing-issues/settings migrated to .card/.btn/.input primitives. - Docs/setup/misc: docs (keeps prose/highlight.js), api_explorer, setup wizard, unlinked_books, custom_section builder. - Modals/fragments: collection_modal, collection_rules, restore_system_collection_modal, filter_item, book_detail_modals — all overlays use --surface-overlay + --shadow-pop. Every Alpine handler, HTMX attribute, id, name, and data-* is preserved; only presentation changes.
117 lines
5.2 KiB
Templ
117 lines
5.2 KiB
Templ
package templates
|
|
|
|
templ AdminProcessingIssues(user User, libraryID string, issues []ProcessingIssueData, stats IssueStats) {
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8"/>
|
|
<title>Processing Issues - Bookhoard</title>
|
|
<link href="/static/style.css" rel="stylesheet"/>
|
|
</head>
|
|
<body x-data="processingIssues" x-init="initializeProcessingIssues('{ libraryID }')" class="theme-{ user.Theme }">
|
|
@Header(user, "/admin/libraries/"+libraryID)
|
|
<main class="flex-1 p-8">
|
|
<div class="mx-auto max-w-4xl">
|
|
<div class="mb-8">
|
|
<div class="flex items-center justify-between gap-4 flex-wrap mb-4">
|
|
<div>
|
|
<div class="flex items-center gap-3 mb-1">
|
|
<span class="grid place-items-center h-10 w-10 rounded-xl" style="background-color: var(--accent-muted); color: var(--accent);">
|
|
@Icon("alert", "h-5 w-5")
|
|
</span>
|
|
<h1 class="text-2xl font-bold tracking-tight" style="color: var(--text-primary)">Processing Issues</h1>
|
|
</div>
|
|
<p class="text-sm" style="color: var(--text-secondary)">Items that couldn't be processed in this library</p>
|
|
</div>
|
|
<a href="/admin/libraries/{ libraryID }" class="btn btn-secondary">
|
|
@Icon("arrow-left", "h-4 w-4")
|
|
Back to Library
|
|
</a>
|
|
</div>
|
|
</div>
|
|
if stats.ErrorCount > 0 || stats.WarningCount > 0 || stats.InfoCount > 0 {
|
|
<!-- Stats Cards -->
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-6 mb-8">
|
|
if stats.ErrorCount > 0 {
|
|
<div class="stat-card" style="border-left: 4px solid var(--status-danger);">
|
|
<div class="flex items-center gap-2 mb-2" style="color: var(--status-danger);">
|
|
@Icon("x-circle", "h-5 w-5")
|
|
<h3 class="text-sm font-semibold uppercase tracking-wide">Errors</h3>
|
|
</div>
|
|
<p class="text-3xl font-bold" style="color: var(--text-primary)">{ stats.ErrorCount }</p>
|
|
</div>
|
|
}
|
|
if stats.WarningCount > 0 {
|
|
<div class="stat-card" style="border-left: 4px solid var(--status-warning);">
|
|
<div class="flex items-center gap-2 mb-2" style="color: var(--status-warning);">
|
|
@Icon("alert", "h-5 w-5")
|
|
<h3 class="text-sm font-semibold uppercase tracking-wide">Warnings</h3>
|
|
</div>
|
|
<p class="text-3xl font-bold" style="color: var(--text-primary)">{ stats.WarningCount }</p>
|
|
</div>
|
|
}
|
|
if stats.InfoCount > 0 {
|
|
<div class="stat-card" style="border-left: 4px solid var(--status-info);">
|
|
<div class="flex items-center gap-2 mb-2" style="color: var(--status-info);">
|
|
@Icon("info", "h-5 w-5")
|
|
<h3 class="text-sm font-semibold uppercase tracking-wide">Info</h3>
|
|
</div>
|
|
<p class="text-3xl font-bold" style="color: var(--text-primary)">{ stats.InfoCount }</p>
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|
|
if len(issues) == 0 {
|
|
<div class="card p-8 text-center">
|
|
<span class="grid place-items-center h-12 w-12 mx-auto mb-3 rounded-2xl" style="background-color: var(--accent-muted); color: var(--accent);">
|
|
@Icon("check-circle", "h-6 w-6")
|
|
</span>
|
|
<p class="text-sm" style="color: var(--text-secondary)">No processing issues found for this library.</p>
|
|
</div>
|
|
} else {
|
|
<!-- Issues List -->
|
|
<div class="space-y-4">
|
|
for _, issue := range issues {
|
|
<div class="card p-6">
|
|
<div class="flex justify-between items-start gap-4 mb-4">
|
|
<div class="flex-1 min-w-0">
|
|
<h4 class="text-lg font-semibold mb-2" style="color: var(--text-primary)">{ issue.Title }</h4>
|
|
<p class="mb-3 text-sm" style="color: var(--text-secondary)">{ issue.IssueDescription }</p>
|
|
<div class="text-sm space-y-1" style="color: var(--text-secondary)">
|
|
<p><span class="font-medium uppercase tracking-wide text-xs" style="color: var(--text-secondary)">Type:</span> { issue.IssueType }</p>
|
|
<p><span class="font-medium uppercase tracking-wide text-xs" style="color: var(--text-secondary)">Format:</span> { issue.FormatGroup }</p>
|
|
<p><span class="font-medium uppercase tracking-wide text-xs" style="color: var(--text-secondary)">File:</span> { issue.FilePath }</p>
|
|
<p><span class="font-medium uppercase tracking-wide text-xs" style="color: var(--text-secondary)">Library:</span> { issue.LibraryTypeName }</p>
|
|
</div>
|
|
</div>
|
|
<div class="ml-2 shrink-0">
|
|
if issue.Severity == "error" {
|
|
<span class="badge status-failed">{ issue.Severity }</span>
|
|
} else if issue.Severity == "warning" {
|
|
<span class="badge status-pending">{ issue.Severity }</span>
|
|
} else {
|
|
<span class="badge status-processing">{ issue.Severity }</span>
|
|
}
|
|
</div>
|
|
</div>
|
|
<div class="flex gap-3 mt-4">
|
|
if issue.Severity == "warning" || issue.Severity == "info" {
|
|
<button
|
|
@click="dismissIssue('{ issue.ID }', '{ issue.MediaItemID }')"
|
|
class="btn btn-secondary text-sm"
|
|
>
|
|
@Icon("close", "h-4 w-4")
|
|
Dismiss
|
|
</button>
|
|
}
|
|
</div>
|
|
</div>
|
|
}
|
|
</div>
|
|
}
|
|
</div>
|
|
</main>
|
|
</body>
|
|
</html>
|
|
}
|