RET-06: aufbewahrungsfristen-konfigurationsoberfläche

- web/retention-admin: eigenstaendige Next.js/React/TypeScript-App (kein Backend-Annex), auf web/shl (SHL-01) aufbauend - classes: Aufbewahrungsklasse anlegen/aendern/deaktivieren (AC1) - preview: Vorschauliste 30 Tage, nutzt denselben Endpunkt wie der periodische Job (AC2) - lib/api.ts: ForbiddenError bei 403, getrennt behandelt, keine eigene Autorisierungslogik im Frontend (RBAC-Entscheidung liegt bei RET-08/RBAC-06) - expliziter 403-Nachweis (nicht nur der 200-Fall): lib/api.test.ts, ClassesPage/PreviewPage zeigen 'Zugriff verweigert' statt leerer Seite - lokal getestet: tsc clean, next build clean, vitest 3/3 gruen Pruefungen siehe archive/docs/RET-06-PRUEFPROTOKOLL.md
2026-08-30 08:49:24 +02:00
parent 1dc70be933
commit 36d1cf5e7f
11 changed files with 478 additions and 0 deletions
@@ -0,0 +1,58 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { Table, type TableColumn } from "@nexarch/shl";
+import { ExpiringObject, ForbiddenError, fetchExpiringPreview } from "../../lib/api";
+
+// Akzeptanzkriterium 2: Vorschauliste bald ablaufender Objekte (naechste 30
+// Tage) - ruft dieselbe RET-06-API /retention-classes/preview auf, die
+// intern dieselbe Funktion wie der periodische Job nutzt (RET-02), keine
+// eigene Berechnung im Frontend.
+export default function PreviewPage() {
+  const [objects, setObjects] = useState<ExpiringObject[] | null>(null);
+  const [forbidden, setForbidden] = useState(false);
+  const [loadError, setLoadError] = useState<string | null>(null);
+
+  useEffect(() => {
+    fetchExpiringPreview()
+      .then(setObjects)
+      .catch((err) => {
+        if (err instanceof ForbiddenError) {
+          setForbidden(true);
+        } else {
+          setLoadError(err instanceof Error ? err.message : "Vorschauliste konnte nicht geladen werden.");
+        }
+      });
+  }, []);
+
+  if (forbidden) {
+    return (
+      <main style={{ maxWidth: 720, margin: "40px auto", padding: "0 16px" }}>
+        <p role="alert">Zugriff verweigert: Ihre Rolle ist nicht zur Fristenverwaltung berechtigt.</p>
+      </main>
+    );
+  }
+  if (loadError) {
+    return (
+      <main style={{ maxWidth: 720, margin: "40px auto", padding: "0 16px" }}>
+        <p role="alert">{loadError}</p>
+      </main>
+    );
+  }
+
+  const columns: TableColumn<ExpiringObject>[] = [
+    { key: "type", header: "Objekttyp", render: (o) => o.ObjectType },
+    { key: "ref", header: "Referenz", render: (o) => o.ObjectReference },
+    { key: "class", header: "Aufbewahrungsklasse", render: (o) => o.RetentionClass },
+    { key: "due", header: "Fällig am", render: (o) => o.DueDate },
+  ];
+
+  return (
+    <main style={{ maxWidth: 720, margin: "40px auto", padding: "0 16px" }}>
+      <h1>In den nächsten 30 Tagen ablaufende Objekte</h1>
+      {objects && (
+        <Table columns={columns} rows={objects} rowKey={(o) => o.RetentionObjectID} caption="Bald ablaufende Objekte" />
+      )}
+    </main>
+  );
+}