@acta-dev/web 1.0.0

package/src/pages/validation.astro

@@ -0,0 +1,63 @@
+---
+import BaseLayout from "../layouts/BaseLayout.astro";
+import Pill from "../components/ui/Pill.astro";
+import { buildDocumentHref } from "@lib/documents.js";
+import { loadActaWebData } from "@lib/project.js";
+import { defaultLocale, getT, isLocale, localizedHref, type Locale } from "@lib/i18n.js";
+
+const { project, validation } = await loadActaWebData();
+const documentsById = new Map(project.documents.map((document) => [document.id, document]));
+
+const rawLocale = Astro.currentLocale ?? defaultLocale;
+const locale: Locale = isLocale(rawLocale) ? rawLocale : defaultLocale;
+const t = await getT(locale);
+const severityLabel = (sev: string) => t(`validation:severity.${sev}`);
+---
+
+<BaseLayout title={t("validation:tab")} description={t("validation:meta")}>
+  <section class="page-header">
+    <div class="crumbs">
+      <span>{t("validation:eyebrow")}</span>
+      <span class="grow"></span>
+      <Pill
+        as="a"
+        href={localizedHref(locale, "/validation/")}
+        tone={validation.valid ? "success" : "danger"}
+      >
+        {validation.valid ? t("common:valid") : t("common:needsAttention")}
+      </Pill>
+    </div>
+    <h1>{t("validation:header")}<span class="accent-period">.</span></h1>
+    <p class="page-sub">
+      {t("validation:counts", { errors: validation.errorCount, warnings: validation.warningCount })}
+    </p>
+  </section>
+
+  {
+    validation.issues.length === 0 ? (
+      <p class="empty-state">{t("validation:empty")}</p>
+    ) : (
+      <section class="issue-list">
+        {validation.issues.map((issue) => {
+          const document = issue.documentId ? documentsById.get(issue.documentId) : undefined;
+          return (
+            <article class={`issue severity-${issue.severity}`}>
+              <div>
+                <strong>{severityLabel(issue.severity)}</strong>
+                <span>{issue.ruleId}</span>
+              </div>
+              <p>{issue.message}</p>
+              {document ? (
+                <a href={localizedHref(locale, buildDocumentHref(document.id))}>
+                  {document.id} · {document.title}
+                </a>
+              ) : (
+                issue.path && <span class="muted">{issue.path}</span>
+              )}
+            </article>
+          );
+        })}
+      </section>
+    )
+  }
+</BaseLayout>