Merge branch 'main' into feat/7-domain-check

# Conflicts:
#	src/components/domain-admin.tsx

CHANGELOG.md

@@ -0,0 +1,74 @@
+# Änderungen
+
+Was in welcher Fassung dazugekommen ist. Dieselbe Liste steht in der
+Anwendung unter **Version und Änderungen**, erreichbar über die
+Versionsnummer in der Fußzeile.
+
+> Diese Datei wird erzeugt: `npm run changelog`.
+> Gepflegt wird der Verlauf in `src/lib/changelog.ts`.
+
+## 1.6.0 — 21.08.2026
+
+Sichtbare Version mit Änderungsverlauf.
+
+- Die laufende Version steht in der Fußzeile und führt auf eine Seite mit dem vollständigen Änderungsverlauf.
+- Der Verlauf wird an einer Stelle gepflegt; die CHANGELOG.md im Projekt entsteht daraus.
+- Die Roadmap verweist für Vergangenes auf den Changelog und behält den Blick nach vorn.
+
+## 1.5.0 — 20.08.2026
+
+Statische Codes lassen sich benennen und ablegen.
+
+- Das Feld „Name“ gilt in beiden Betriebsarten, nicht mehr nur bei dynamischen Codes.
+- Der Name bestimmt den Dateinamen beim Herunterladen.
+- Ein statischer Code lässt sich in „Meine Codes“ ablegen — als Schnappschuss ohne Kurz-Link und ohne Scan-Zähler.
+
+## 1.4.0 — 17.08.2026
+
+Sprechende Kurz-Links und eine früh erkannte Fehlkonfiguration.
+
+- Kurz-Links selbst vergeben und nachträglich ändern, mit „/“ als Trenner.
+- Die vorherige Adresse bleibt gültig und lässt sich einzeln freigeben — gedruckte Codes bleiben gültig.
+- Vergeben und Ändern ist Administratoren vorbehalten und in der Verwaltung für Bearbeiter freigebbar.
+- Weicht BASE_URL von der aufgerufenen Adresse ab, meldet die Anmeldung das sofort statt erst am Ende.
+- Auf der Anmeldeseite steht nicht mehr, wie die Anmeldung konfiguriert ist.
+
+## 1.3.0 — 16.08.2026
+
+Eigenes Erscheinungsbild und ein Dark Mode.
+
+- Name, Logo, Favicon und Akzentfarbe sind im Admin-Bereich einstellbar.
+- Hell und dunkel folgen dem Betriebssystem, mit Umschalter für eine eigene Wahl.
+- Das Update-Skript erklärt, warum ein Vorspulen scheitert, statt nur abzubrechen.
+- Die Authentik-Anleitung sagt deutlicher, wie die Redirect URI zu bilden ist.
+
+## 1.2.0 — 15.08.2026
+
+Single Sign-on, Dokumentation und eine Sicherheitsdurchsicht.
+
+- Anmeldung über Authentik und andere OIDC-Anbieter, mit PKCE und geprüftem ID-Token.
+- Bedienungsanleitung mit Bildern, Funktionsübersicht und Roadmap.
+- Anmeldung und Sitzungen nach OWASP durchgesehen und gehärtet: stärkere Passwort-Parameter, Längengrenze, Herkunftsprüfung, Schutzheader, absolute Sitzungsdauer.
+- Auf der Startseite steht „nur dynamisch“ statt eines nichtssagenden Abzeichens an jeder Kachel.
+
+## 1.1.0 — 14.08.2026
+
+Alle fünfzehn QR-Typen, Anmeldung, Gruppen und mehrere Domains.
+
+- Vierzehn weitere QR-Typen — von vCard und WLAN bis PDF, Bild und Feedback.
+- Landingpages als eigene Gattung für Typen ohne fremdes Ziel.
+- Datei-Upload mit Inhaltsprüfung, Größengrenze und Aufräumen.
+- Anmeldung, Benutzer, Gruppen und die Rollen Administrator, Bearbeiter und Betrachter.
+- Mehrere Domains für Kurz-URLs, den Gruppen zugeteilt.
+- „Meine Codes“ als Liste mit Suche, Sortierung und Gruppenfilter.
+- Einzelne QR-Typen lassen sich in der Verwaltung ausblenden.
+
+## 1.0.0 — 13.08.2026
+
+Erste lauffähige Fassung.
+
+- Next.js-Anwendung und PostgreSQL als Docker-Compose-Stack, Migrationen beim Start.
+- QR-Typ Website, statisch und dynamisch, mit Kurz-URL, Weiterleitung und Scan-Zähler.
+- Gestaltung mit Farben, Kontrastwarnung, Größe, Fehlerkorrektur und Rand.
+- Download als PNG und SVG, serverseitig gerendert.
+- Update-Skript für Linux, macOS und Windows.

README.md

@@ -34,6 +34,8 @@ entscheidet die Verwaltung — nicht gebrauchte lassen sich ausblenden.
   eigene Wahl.
 - **Sprechende Kurz-Links:** `qr.firma.de/r/sommeraktion` statt Zufallszeichen,
   nachträglich änderbar — die vorherige Adresse bleibt gültig.
+- **Sichtbare Version:** Die Fußzeile nennt die laufende Fassung und führt
+  zum Änderungsverlauf — nach einem Update sofort erkennbar, ob es ankam.
 - **Zwei Container, kein Reverse Proxy nötig.** Migrationen laufen beim Start
   von selbst; alles Nötige steht in einer `.env`.
 
@@ -48,7 +50,8 @@ entscheidet die Verwaltung — nicht gebrauchte lassen sich ausblenden.
 - **[Anmeldung über Authentik (OIDC)](docs/authentik.md)** — Einrichtung,
   Rollen und der Weg zurück
 - **[Alle Funktionen im Detail](docs/funktionen.md)** — die lange Fassung
-- **[Roadmap](docs/roadmap.md)** — was gebaut ist und was kommen könnte
+- **[Änderungen](CHANGELOG.md)** — was in welcher Version dazugekommen ist
+- **[Roadmap](docs/roadmap.md)** — was als Nächstes kommen könnte
 - **[Anmeldung und Sitzungen nach OWASP](docs/sicherheit.md)** — Durchsicht,
   Härtungen und was bewusst offen bleibt
 
@@ -350,6 +353,30 @@ prüft ihn gegen die registrierten Domains. Ein unbekannter Hostname endet mit
 404 — über einen gefälschten Header lässt sich also keine fremde Domain
 ansprechen.
 
+### Nachprüfen, ob eine Domain wirklich hierher führt
+
+Auf der Domain-Seite steht bei jedem Eintrag ein Knopf **Prüfen**. Er geht den
+Weg der Scanner nach und meldet vier Dinge:
+
+| Schritt | Was geprüft wird |
+| --- | --- |
+| DNS | Löst der Name auf? Auf welche Adressen? |
+| Zertifikat | Gültig, von wem ausgestellt, wie lange noch? |
+| Erreichbar | Antwortet dort ein Webserver, und wie schnell? |
+| Ziel | Steht dahinter **diese** Installation? |
+
+Der letzte Schritt ist der eigentliche Wert. Die Anwendung ruft dazu unter der
+Domain eine eigene Route auf und lässt sich einen HMAC über eine frische
+Zufallszahl zurückgeben; das Geheimnis dafür steht in der Datenbank und
+verlässt den Server nie. Nur so unterscheidet sich „die Domain zeigt
+irgendwohin“ von „die Domain zeigt hierher“.
+
+> **Grenze der Aussage:** Der Aufruf startet dort, wo der Container läuft.
+> Wer internes DNS oder Hairpin-NAT hat, bekommt womöglich einen Fehler,
+> obwohl von außen alles stimmt. Umgekehrt gilt: Meldet die Prüfung von innen
+> Erfolg, heißt das noch nicht, dass die Domain auch von außen erreichbar ist.
+> Dafür bleibt der Blick von einem fremden Netz aus.
+
 Zwei Dinge, die daraus folgen:
 
 - Der **Slug ist je Domain eindeutig**, nicht global. Derselbe sprechende
@@ -615,13 +642,18 @@ Dazu kommen
 
 - ein **Suchfeld** über Name, Ziel, Kurz-URL und Typ,
 - eine **Sortierung** nach Datum, Name oder Scan-Anzahl,
-- ein **Gruppenfilter**, sobald Codes in mehr als einer Gruppe liegen.
+- ein **Gruppenfilter**, sobald Codes in mehr als einer Gruppe liegen,
+- ein **Filter nach Art**, sobald dynamische und statische Codes
+  nebeneinander liegen.
 
 Auf schmalen Bildschirmen blendet die Liste die hinteren Spalten aus; die
 Kurz-URL rückt dann unter den Namen. Zum Herunterladen dient dort die
 Kartenansicht.
 
-Statische Codes erscheinen hier nicht, weil sie nicht gespeichert werden.
+Abgelegte **statische Codes** stehen mit in der Liste, tragen aber ein
+Abzeichen „statisch“ statt einer Kurz-URL und zählen keine Scans. Steht der
+Filter auf „Nur statische“, fällt die Scan-Spalte weg und die Sortierung nach
+Scans mit ihr — bei einer Liste aus lauter Nullen sagt sie nichts.
 
 Bei einem **Feedback-Code** führt aus der Zeile ein Stern-Symbol zur
 Auswertung: Durchschnitt, Verteilung der Noten und die abgegebenen Kommentare.

docs/funktionen.md

@@ -122,6 +122,17 @@ Liste steht dort „statisch“ und ein Strich.
 Wer nach dem Ablegen den Inhalt ändert, bekommt das Ablegen erneut angeboten —
 der vorherige Eintrag bleibt als eigener Schnappschuss bestehen.
 
+**Dublettenprüfung.** Liegt in derselben Gruppe schon ein statischer Code mit
+identischem Inhalt, hält das Ablegen an und zeigt, welcher Eintrag das ist und
+wann er entstand. Der Knopf heißt dann **Trotzdem ablegen** — eine Warnung,
+keine Sperre: Zwei Fassungen desselben Codes können gewollt sein.
+
+Verglichen wird nur der Inhalt, nicht die Gestaltung. Derselbe Code in
+Schwarz-Weiß und in Hausfarben gilt also als Dublette — was er streng
+genommen auch ist, denn gescannt wird beides Mal dasselbe. Dynamische Codes
+bleiben außen vor: Zwei Kurz-Links auf dasselbe Ziel sind der Normalfall,
+sobald zwei Kampagnen getrennt gezählt werden sollen.
+
 ### Der Kurz-Link
 
 Ohne eigene Angabe entsteht er aus acht Zeichen eines Alphabets ohne
@@ -500,6 +511,21 @@ alles zeigt und Typen aus späteren Versionen automatisch erscheinen.
 
 ---
 
+## Version und Änderungen
+
+Die Fußzeile nennt die laufende Version und führt auf eine Seite mit dem
+vollständigen Änderungsverlauf. Nach einem Update ist das die schnellste
+Antwort auf die Frage, ob der Container wirklich mit dem neuen Abbild läuft:
+Steht dort noch die alte Nummer, ist er es nicht.
+
+Der Verlauf wird an **einer** Stelle gepflegt (`src/lib/changelog.ts`).
+Daraus entstehen sowohl die Seite in der Anwendung als auch die
+[CHANGELOG.md](../CHANGELOG.md) im Projekt (`npm run changelog`); eine
+Prüfung wacht darüber, dass beides zusammenpasst. Zu jeder Version gibt es
+einen Git-Tag.
+
+---
+
 ## Schnittstelle
 
 Alles, was die Oberfläche tut, geht auch über HTTP:

docs/roadmap.md

@@ -7,94 +7,16 @@ Aufwände sind grobe Einschätzungen, keine Zusagen.
 
 ## Gebaut
 
-### Version 1 — Grundgerüst (13.08.2026)
+Der vollständige Verlauf mit Versionsnummern steht im
+[Changelog](../CHANGELOG.md) — und in der Anwendung selbst unter
+**Version und Änderungen**, erreichbar über die Versionsnummer in der
+Fußzeile.
 
-- Next.js-Anwendung und PostgreSQL als Docker-Compose-Stack, ohne Reverse
+Kurz gefasst: Version 1.0.0 (13.08.2026) brachte das Grundgerüst mit dem Typ
-  Proxy, Migrationen beim Start
+Website, 1.1.0 alle fünfzehn Typen samt Anmeldung, Gruppen und Domains,
-- QR-Typ-Registry als Dispatch-Tabelle — ein neuer Typ ist ein Modul plus ein
+1.2.0 Single Sign-on und die Sicherheitsdurchsicht, 1.3.0 Erscheinungsbild
-  Formular, ohne Eingriff in den übrigen Code
+und Dark Mode, 1.4.0 sprechende Kurz-Links, 1.5.0 benennbare statische Codes
-- Typ **Website**, statisch und dynamisch, mit Kurz-URL, 302-Weiterleitung und
+und 1.6.0 diesen Versionshinweis.
-  Scan-Zähler
-- Gestaltung: Farben mit Kontrastwarnung, Größe, Fehlerkorrektur, Rand
-- Download als PNG und SVG, serverseitig gerendert
-- „Meine Codes“ mit Ziel ändern und Löschen
-- Deutsche Oberfläche, deutsche Fehlermeldungen, Validierung mit Zod
-- Update-Skript für Linux/macOS und Windows
-
-### Typen einzeln freigeben (14.08.2026)
-
-Ausblenden nicht gebrauchter Typen in der Verwaltung. Bereits erstellte Codes
-eines abgeschalteten Typs funktionieren weiter.
-
-### Phase A — acht weitere Typen (14.08.2026)
-
-vCard, App-Link, WhatsApp, E-Mail, SMS, Standort, Zahlung (GiroCode und
-Zahlungslink), WLAN.
-
-### Phase B1 — Anmeldung, Gruppen, Rollen (14.08.2026)
-
-Abschaltbare Anmeldung, Benutzerverwaltung, Gruppen mit den Rollen
-Administrator, Bearbeiter und Betrachter, Sitzungen in der Datenbank,
-scrypt-Passwörter, Sperre nach Fehlversuchen.
-
-### Phase B2 — mehrere Domains (14.08.2026)
-
-Domains für Kurz-URLs, den Gruppen zugeteilt. Slug je Domain eindeutig,
-Host-Header gegen die registrierten Domains geprüft.
-
-### Listenansicht (14.08.2026)
-
-„Meine Codes“ als Liste mit Suche, Sortierung und Gruppenfilter — gedacht für
-viele Projekte nebeneinander. Karten bleiben als zweite Ansicht.
-
-### Phase C — die letzten sechs Typen (14.08.2026)
-
-Mehrere Links, Social Media, Video, PDF, Bild, Feedback. Dazu:
-
-- Landingpages als eigene Gattung (`/s/{slug}`), ohne App-Navigation
-- Datei-Upload mit Inhaltsprüfung, Größengrenze und Aufräumen
-- Feedback mit anonymer Erhebung und Auswertung
-
-Damit sind **alle 15 vorgesehenen Typen** gebaut.
-
-### Single Sign-on (15.08.2026)
-
-Anmeldung über Authentik und andere OIDC-Anbieter, mit PKCE und geprüftem
-ID-Token.
-
-### Erscheinungsbild (16.08.2026)
-
-Name, Logo, Favicon und Akzentfarbe im Admin-Bereich einstellbar. Die Farbe
-wirkt über die Farbvariablen, die Tailwind ohnehin benutzt — deshalb ohne
-Umbau der rund 60 eingefärbten Stellen.
-
-### Dark Mode (16.08.2026)
-
-Folgt dem Betriebssystem, mit Umschalter für Hell, Dunkel und System.
-Umgesetzt über `light-dark()` statt über `dark:`-Klassen — deshalb ohne
-Änderung an den rund 440 Farbklassen und ohne JavaScript für die Systemwahl.
-
-### Sprechende Kurz-Links (17.08.2026)
-
-Kurz-Links selbst vergeben und nachträglich ändern, mit `/` als Trenner. Die
-vorherige Adresse bleibt gültig und lässt sich einzeln freigeben — sonst würde
-jedes Umbenennen gedruckte Codes entwerten. Standardmäßig Administratoren
-vorbehalten, per Einstellung für Bearbeiter freigebbar.
-
-Schließt [Issue #1](https://git.wilde-server.de/florian.wilde/qrcode-generator/issues/1).
-
-### Statische Codes benennen und ablegen (20.08.2026)
-
-Das Namensfeld gilt in beiden Betriebsarten. Es bestimmt den Dateinamen beim
-Herunterladen und erlaubt, einen statischen Code in „Meine Codes" abzulegen —
-als Schnappschuss, dessen Inhalt sich nicht mehr ändert.
-
-Schließt [Issue #2](https://git.wilde-server.de/florian.wilde/qrcode-generator/issues/2).
-
-### Dokumentation (15.08.2026)
-
-Bedienungsanleitung mit Bildern, Authentik-Anleitung, Funktionsübersicht.
-Die Bilder erzeugt ein Skript, damit sie nicht veralten.
 
 ---
 

docs/sicherheit.md

@@ -191,6 +191,29 @@ Konto nur bei **bestätigter** E-Mail-Adresse.
 
 ---
 
+## Der Domain-Check und seine Grenzen
+
+Auf der Domain-Seite ruft der Knopf **Prüfen** die eingetragene Domain vom
+Server aus auf. Drei Dinge grenzen das ein:
+
+- Geprüft wird ausschließlich ein Hostname **aus der Datenbank**, nie einer
+  aus der Anfrage. Sonst wäre die Route ein Werkzeug, mit dem sich vom Server
+  aus beliebige Adressen abklopfen ließen.
+- Auslösen darf sie nur, wer `instance:manage` hat — dieselbe Berechtigung,
+  die auch Domains anlegt.
+- Die Route, die den Beweis liefert (`/api/domain-check`), ist **ohne
+  Anmeldung** erreichbar; der Aufruf kommt ja von außen. Sie gibt nichts
+  preis: Die Antwort ist ein HMAC über die mitgeschickte Zufallszahl. Ohne
+  das Geheimnis lässt er sich nicht bilden, und aus ihm folgt nichts über das
+  Geheimnis. Es entsteht beim ersten Check und verlässt den Server nie.
+
+Beim Zertifikat läuft die Verbindung bewusst mit `rejectUnauthorized: false`.
+Nur so lässt sich ein schlechtes Zertifikat **beschreiben** — abgelaufen,
+selbst ausgestellt, falscher Name — statt bloß daran zu scheitern.
+Übertragen wird über diese Verbindung nichts.
+
+---
+
 ## Offen
 
 Bewusst nicht umgesetzt, mit Begründung.

package.json

@@ -1,11 +1,12 @@
 {
   "name": "qrcode-generator",
-  "version": "1.1.0",
+  "version": "1.6.0",
   "private": true,
   "scripts": {
     "dev": "next dev",
     "build": "next build",
     "start": "next start",
+    "changelog": "node scripts/changelog.mjs",
     "lint": "eslint",
     "typecheck": "tsc --noEmit",
     "db:generate": "prisma generate",

prisma/migrations/20260821010000_domain_check/migration.sql

@@ -0,0 +1,7 @@
+-- Der Domain-Check ruft die Domain von aussen auf und prueft, ob er dabei bei
+-- dieser Installation landet. Beweis dafuer ist ein HMAC ueber eine
+-- Zufallszahl, gebildet mit einem Geheimnis, das den Server nie verlaesst.
+--
+-- Nullable und ohne Vorbelegung: Der Wert entsteht beim ersten Check. Eine
+-- feste Vorbelegung waere fuer alle Installationen dieselbe und damit wertlos.
+ALTER TABLE "InstanceSetting" ADD COLUMN "checkSecret" TEXT;

prisma/schema.prisma

@@ -262,6 +262,14 @@ model InstanceSetting {
   /// entwertet im Zweifel gedruckte Codes oder besetzt Adressen, die
   /// jemand anderes gebraucht hätte. Administratoren können das freigeben.
   editorsMaySetSlug  Boolean  @default(false)
+  /// Geheimnis fuer den Domain-Check.
+  ///
+  /// Die Pruefung ruft die Domain von aussen auf und laesst sich einen HMAC
+  /// ueber eine Zufallszahl zurueckgeben. Nur wer dieses Geheimnis kennt,
+  /// kann ihn bilden — so steht fest, dass wirklich diese Installation
+  /// geantwortet hat und nicht irgendein anderer Server. Es verlaesst den
+  /// Server nie und entsteht beim ersten Check.
+  checkSecret        String?
   updatedAt          DateTime @updatedAt
 }
 

scripts/changelog.mjs

@@ -0,0 +1,84 @@
+/**
+ * Schreibt CHANGELOG.md aus src/lib/changelog.ts.
+ *
+ *   node scripts/changelog.mjs           erzeugen
+ *   node scripts/changelog.mjs --check   nur prüfen, ob die Datei aktuell ist
+ *
+ * Warum erzeugt und nicht von Hand gepflegt: Die Anwendung zeigt denselben
+ * Verlauf unter /version an. Zwei gepflegte Listen liefen unweigerlich
+ * auseinander — und ein Changelog, der nicht stimmt, ist schlimmer als keiner.
+ */
+import { readFileSync, writeFileSync } from "node:fs";
+import { fileURLToPath } from "node:url";
+import { dirname, join } from "node:path";
+
+const wurzel = join(dirname(fileURLToPath(import.meta.url)), "..");
+const ziel = join(wurzel, "CHANGELOG.md");
+
+/**
+ * Die Quelle ist TypeScript, dieses Skript aber schlichtes Node. Statt einen
+ * Übersetzer dazuzunehmen, wird der Datenteil gelesen und ausgewertet — er
+ * besteht ausschließlich aus Zeichenketten und Listen.
+ */
+function ladeVerlauf() {
+  const quelle = readFileSync(join(wurzel, "src", "lib", "changelog.ts"), "utf8");
+  const anfang = quelle.indexOf("export const CHANGELOG");
+  if (anfang === -1) throw new Error("CHANGELOG-Liste nicht gefunden.");
+
+  const start = quelle.indexOf("[", anfang);
+  const ende = quelle.indexOf("\n];", start);
+  if (start === -1 || ende === -1) throw new Error("Liste nicht abgrenzbar.");
+
+  const literal = quelle.slice(start, ende + 2);
+  return Function(`"use strict"; return (${literal});`)();
+}
+
+function formatiereDatum(iso) {
+  const [jahr, monat, tag] = iso.split("-");
+  return `${tag}.${monat}.${jahr}`;
+}
+
+function baue(verlauf) {
+  const zeilen = [
+    "# Änderungen",
+    "",
+    "Was in welcher Fassung dazugekommen ist. Dieselbe Liste steht in der",
+    "Anwendung unter **Version und Änderungen**, erreichbar über die",
+    "Versionsnummer in der Fußzeile.",
+    "",
+    "> Diese Datei wird erzeugt: `npm run changelog`.",
+    "> Gepflegt wird der Verlauf in `src/lib/changelog.ts`.",
+    "",
+  ];
+
+  for (const eintrag of verlauf) {
+    zeilen.push(`## ${eintrag.version} — ${formatiereDatum(eintrag.date)}`, "");
+    zeilen.push(eintrag.summary, "");
+    for (const änderung of eintrag.changes) zeilen.push(`- ${änderung}`);
+    zeilen.push("");
+  }
+
+  return zeilen.join("\n");
+}
+
+const inhalt = baue(ladeVerlauf());
+
+if (process.argv.includes("--check")) {
+  let vorhanden = "";
+  try {
+    vorhanden = readFileSync(ziel, "utf8");
+  } catch {
+    console.error("CHANGELOG.md fehlt. Erzeugen mit: npm run changelog");
+    process.exit(1);
+  }
+  if (vorhanden !== inhalt) {
+    console.error(
+      "CHANGELOG.md passt nicht mehr zu src/lib/changelog.ts. Neu erzeugen mit: npm run changelog",
+    );
+    process.exit(1);
+  }
+  console.log("CHANGELOG.md ist aktuell.");
+} else {
+  writeFileSync(ziel, inhalt, "utf8");
+  console.log("CHANGELOG.md geschrieben.");
+}

src/app/(app)/layout.tsx

@@ -6,6 +6,7 @@ import { ThemeToggle } from "@/components/theme-toggle";
 import { actorLabel, getActor, isAuthEnabled } from "@/lib/auth/actor";
 import { can } from "@/lib/auth/policy";
 import { getBranding } from "@/lib/branding";
+import { APP_VERSION } from "@/lib/changelog";
 
 // Der Kopfbereich hängt von der Anmeldung ab und darf nicht vorgerendert
 // werden.
@@ -128,9 +129,20 @@ export default async function AppLayout({ children }: LayoutProps<"/">) {
       <main className="flex-1">{children}</main>
 
       <footer className="border-t border-slate-200 bg-surface">
-        <div className="mx-auto max-w-6xl px-4 py-6 text-sm text-slate-500 sm:px-6">
+        <div className="mx-auto flex max-w-6xl flex-wrap items-baseline justify-between gap-x-4 gap-y-1 px-4 py-6 text-sm text-slate-500 sm:px-6">
-          {branding.appName}
+          <span>
-          {branding.footerText ? ` · ${branding.footerText}` : null}
+            {branding.appName}
+            {branding.footerText ? ` · ${branding.footerText}` : null}
+          </span>
+          {/* Welche Fassung hier läuft — nach einem Update die schnellste
+              Antwort auf die Frage, ob das Update auch angekommen ist. */}
+          <Link
+            href="/version"
+            title="Version und Änderungen"
+            className="rounded font-mono text-xs tabular-nums transition-colors hover:text-slate-900"
+          >
+            v{APP_VERSION}
+          </Link>
         </div>
       </footer>
     </div>

src/app/(app)/meine-codes/page.tsx

@@ -27,9 +27,9 @@ export default async function MyCodesPage() {
           Meine Codes
         </h1>
         <p className="mt-2 text-slate-600">
-          Alle dynamischen QR-Codes mit ihrem aktuellen Ziel und der Anzahl der
+          Dynamische Codes mit ihrem aktuellen Ziel und der Anzahl der Scans,
-          Scans. Statische Codes erscheinen hier nicht — sie werden nicht
+          dazu abgelegte statische Codes. Über die Auswahl „Nach Art filtern“
-          gespeichert.
+          lässt sich die Liste auf eine der beiden Arten einschränken.
         </p>
       </div>
 

src/app/(app)/version/page.tsx

@@ -0,0 +1,83 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+
+import { Icon } from "@/components/icons";
+import { Badge, Card } from "@/components/ui";
+import { requirePageActor } from "@/lib/auth/guard";
+import {
+  APP_VERSION,
+  CHANGELOG,
+  formatChangelogDate,
+} from "@/lib/changelog";
+
+export const metadata: Metadata = { title: "Version und Änderungen" };
+
+export const dynamic = "force-dynamic";
+
+export default async function VersionPage() {
+  await requirePageActor();
+
+  return (
+    <div className="mx-auto max-w-3xl px-4 py-8 sm:px-6 sm:py-10">
+      <Link
+        href="/"
+        className="mb-5 inline-flex items-center gap-1.5 rounded-lg text-sm font-medium text-slate-600 transition-colors hover:text-slate-900"
+      >
+        <Icon name="arrowLeft" className="size-4" />
+        Zur Typ-Auswahl
+      </Link>
+
+      <div className="mb-7">
+        <h1 className="text-2xl font-bold tracking-tight text-slate-900 sm:text-3xl">
+          Version und Änderungen
+        </h1>
+        <p className="mt-2 text-slate-600">
+          Hier läuft Version{" "}
+          <span className="font-semibold text-slate-900">{APP_VERSION}</span>.
+          Darunter steht, was in welcher Fassung dazugekommen ist.
+        </p>
+        <p className="mt-2 text-sm text-slate-500">
+          Nach einem Update lohnt ein Blick hierher: Steht oben noch die alte
+          Nummer, läuft der Container noch mit dem alten Abbild.
+        </p>
+      </div>
+
+      <ol className="space-y-4">
+        {CHANGELOG.map((eintrag) => {
+          const laeuft = eintrag.version === APP_VERSION;
+          return (
+            <li key={eintrag.version}>
+              <Card>
+                <div className="mb-3 flex flex-wrap items-baseline gap-x-3 gap-y-1">
+                  <h2 className="text-lg font-semibold text-slate-900">
+                    {eintrag.version}
+                  </h2>
+                  <span className="text-sm text-slate-500 tabular-nums">
+                    {formatChangelogDate(eintrag.date)}
+                  </span>
+                  {laeuft ? (
+                    <Badge tone="accent">läuft hier</Badge>
+                  ) : null}
+                </div>
+
+                <p className="mb-3 text-slate-600">{eintrag.summary}</p>
+
+                <ul className="space-y-1.5 text-sm text-slate-700">
+                  {eintrag.changes.map((zeile) => (
+                    <li key={zeile} className="flex gap-2.5">
+                      <span
+                        aria-hidden="true"
+                        className="mt-2 size-1.5 shrink-0 rounded-full bg-slate-300"
+                      />
+                      <span>{zeile}</span>
+                    </li>
+                  ))}
+                </ul>
+              </Card>
+            </li>
+          );
+        })}
+      </ol>
+    </div>
+  );
+}

src/app/api/admin/domains/[id]/check/route.ts

@@ -0,0 +1,43 @@
+import { getActor } from "@/lib/auth/actor";
+import { requirePermission } from "@/lib/auth/policy";
+import { prisma } from "@/lib/db";
+import { pruefeDomain } from "@/lib/domain-check";
+import { errorResponse } from "@/lib/http";
+import { QrRequestError } from "@/lib/qr/type-module";
+
+export const dynamic = "force-dynamic";
+
+type Context = { params: Promise<{ id: string }> };
+
+/**
+ * Prüft eine registrierte Domain: DNS, Zertifikat, Erreichbarkeit — und ob
+ * dahinter wirklich diese Installation steht.
+ *
+ * `POST`, obwohl nichts gespeichert wird: Der Aufruf stößt eine Verbindung
+ * nach außen an und ist nichts, was sich vorsorglich abrufen lässt.
+ *
+ * Geprüft wird ausschließlich der Hostname aus der Datenbank. Ein Hostname
+ * aus der Anfrage würde diese Route zum Werkzeug machen, mit dem sich vom
+ * Server aus beliebige Adressen abklopfen lassen.
+ */
+export async function POST(
+  _request: Request,
+  context: Context,
+): Promise<Response> {
+  try {
+    requirePermission(await getActor(), "instance:manage");
+    const { id } = await context.params;
+
+    const domain = await prisma.domain.findUnique({
+      where: { id },
+      select: { hostname: true },
+    });
+    if (!domain) {
+      throw new QrRequestError("Diese Domain gibt es nicht.", 404);
+    }
+
+    return Response.json({ report: await pruefeDomain(domain.hostname) });
+  } catch (error) {
+    return errorResponse(error);
+  }
+}

src/app/api/codes/route.ts

@@ -7,6 +7,7 @@ import { requirePermission, visibleGroupIds } from "@/lib/auth/policy";
 import { toJsonInput, toQrCodeDto } from "@/lib/codes";
 import { prisma } from "@/lib/db";
 import { resolveTargetDomain } from "@/lib/domains";
+import { findStaticDuplicate } from "@/lib/duplicates";
 import { errorResponse, firstZodMessage, jsonError } from "@/lib/http";
 import { requireAvailableQrType } from "@/lib/qr/availability";
 import { designSchema } from "@/lib/qr/design";
@@ -43,6 +44,12 @@ const createSchema = z.object({
   groupId: z.string().trim().min(1).optional(),
   /** Unter welcher Domain die Kurz-URL entsteht. */
   domainId: z.string().trim().min(1).optional(),
+  /**
+   * Eine gemeldete Dublette bewusst in Kauf nehmen. Ohne dieses Häkchen
+   * antwortet das Anlegen mit 409, sobald derselbe Inhalt schon als
+   * statischer Code in der Gruppe liegt.
+   */
+  allowDuplicate: z.boolean().default(false),
 });
 
 function isUniqueViolation(error: unknown): boolean {
@@ -140,6 +147,24 @@ export async function POST(request: NextRequest): Promise<Response> {
       await assertSlugAvailable(domainId, gewuenscht);
     }
 
+    // Zweimal derselbe statische Inhalt ergibt zweimal dasselbe Bild. Das ist
+    // erlaubt, aber selten gewollt — deshalb ein Halt mit Rückfrage statt
+    // eines stillen zweiten Eintrags.
+    if (istStatisch && !parsed.data.allowDuplicate) {
+      const dublette = await findStaticDuplicate(groupId, qrType.id, validated.data);
+      if (dublette) {
+        return Response.json(
+          {
+            error: dublette.label
+              ? `Diesen Inhalt hast du schon abgelegt — als „${dublette.label}“.`
+              : "Diesen Inhalt hast du schon abgelegt.",
+            duplicate: dublette,
+          },
+          { status: 409 },
+        );
+      }
+    }
+
     if (istStatisch) {
       const created = await prisma.qrCode.create({
         data: {

src/app/api/domain-check/route.ts

@@ -0,0 +1,40 @@
+import type { NextRequest } from "next/server";
+
+import { bildeBeweis, getCheckSecret } from "@/lib/domain-check";
+
+export const dynamic = "force-dynamic";
+
+/**
+ * Beweis-Route für den Domain-Check.
+ *
+ * Bewusst **ohne Anmeldung**: Der Aufruf kommt von außen über die zu prüfende
+ * Domain und trägt keine Sitzung mit sich. Preisgegeben wird dabei nichts —
+ * die Antwort ist ein HMAC über die mitgeschickte Zufallszahl. Wer das
+ * Geheimnis nicht kennt, kann ihn nicht bilden; wer ihn sieht, lernt daraus
+ * nichts über das Geheimnis.
+ *
+ * Dass es diese Anwendung gibt, verrät ohnehin schon jede Landingpage.
+ */
+export async function GET(request: NextRequest): Promise<Response> {
+  const nonce = request.nextUrl.searchParams.get("nonce") ?? "";
+
+  // Eine Grenze nach oben, damit die Route nicht als Rechenknecht für fremde
+  // Daten taugt, und eine nach unten, damit sie nicht auf Zuruf antwortet.
+  if (!/^[a-f0-9]{16,64}$/.test(nonce)) {
+    return Response.json(
+      { error: "Es fehlt eine gültige Zufallszahl." },
+      { status: 400 },
+    );
+  }
+
+  try {
+    const proof = bildeBeweis(await getCheckSecret(), nonce);
+    return Response.json(
+      { app: "qrcode-generator", proof },
+      { headers: { "Cache-Control": "no-store" } },
+    );
+  } catch (error) {
+    console.error("Domain-Check konnte keinen Beweis bilden:", error);
+    return Response.json({ error: "Nicht möglich." }, { status: 500 });
+  }
+}

src/components/codes-list.tsx

@@ -43,6 +43,8 @@ function formatShortDate(value: string | null): string {
 
 type View = "list" | "cards";
 type SortKey = "neueste" | "aelteste" | "name" | "scans";
+/** Betriebsart, auf die die Liste eingeschränkt ist. */
+type ModeFilter = "alle" | "dynamic" | "static";
 
 const SORT_LABELS: Record<SortKey, string> = {
   neueste: "Neueste zuerst",
@@ -51,6 +53,12 @@ const SORT_LABELS: Record<SortKey, string> = {
   scans: "Meiste Scans",
 };
 
+const MODE_LABELS: Record<ModeFilter, string> = {
+  alle: "Alle Arten",
+  dynamic: "Nur dynamische",
+  static: "Nur statische",
+};
+
 /** Merkt sich die gewählte Ansicht über Seitenwechsel hinweg. */
 const VIEW_STORAGE_KEY = "qrgen.codes.view";
 
@@ -94,6 +102,7 @@ export function CodesList({
   const [query, setQuery] = useState("");
   const [sort, setSort] = useState<SortKey>("neueste");
   const [groupFilter, setGroupFilter] = useState("alle");
+  const [modeFilter, setModeFilter] = useState<ModeFilter>("alle");
 
   // Erst nach dem Einhängen lesen — auf dem Server gibt es keinen
   // localStorage, und ein abweichender Startwert führte zu Hydrationsfehlern.
@@ -107,6 +116,14 @@ export function CodesList({
     window.localStorage.setItem(VIEW_STORAGE_KEY, next);
   };
 
+  const changeModeFilter = (next: ModeFilter) => {
+    setModeFilter(next);
+    // Statische Codes zählen keine Scans. Bleibt die Sortierung danach
+    // stehen, sortiert die Liste nach lauter Nullen — und die Auswahl bietet
+    // eine Reihenfolge an, die es dort gar nicht gibt.
+    if (next === "static" && sort === "scans") setSort("neueste");
+  };
+
   const load = useCallback(async () => {
     try {
       const result = await apiJson<{ codes: QrCodeDto[] }>("/api/codes");
@@ -241,11 +258,25 @@ export function CodesList({
     );
   }, [codes]);
 
+  // Welche Betriebsarten überhaupt vorkommen. Ein Filter, der nichts zu
+  // filtern hat, steht nur im Weg — deshalb erscheint er erst, wenn beide
+  // Arten in der Liste stehen.
+  const kinds = useMemo(() => {
+    let dynamisch = false;
+    let statisch = false;
+    for (const code of codes ?? []) {
+      if (code.mode === "static") statisch = true;
+      else dynamisch = true;
+    }
+    return { dynamisch, statisch, beide: dynamisch && statisch };
+  }, [codes]);
+
   const visible = useMemo(() => {
     const needle = query.trim().toLowerCase();
 
     const filtered = (codes ?? []).filter((code) => {
       if (groupFilter !== "alle" && code.groupId !== groupFilter) return false;
+      if (modeFilter !== "alle" && code.mode !== modeFilter) return false;
       if (!needle) return true;
       return [
         displayName(code),
@@ -273,7 +304,7 @@ export function CodesList({
       }
     });
     return sorted;
-  }, [codes, query, sort, groupFilter]);
+  }, [codes, query, sort, groupFilter, modeFilter]);
 
   /* ---------------------------------------------------------------- View */
 
@@ -287,6 +318,10 @@ export function CodesList({
   const svgHref = (code: QrCodeDto) =>
     `/api/codes/${code.id}/qr?format=svg&download=1`;
 
+  // Zeigt die Liste ausschließlich statische Codes, hat die Scan-Spalte
+  // nichts zu sagen — dann fällt sie weg, samt der Sortierung danach.
+  const nurStatische = modeFilter === "static" || (kinds.statisch && !kinds.dynamisch);
+
   const toolbar = codes.length > 0 && (
     <div className="flex flex-wrap items-center gap-2">
       <div className="relative min-w-0 flex-1 basis-56">
@@ -320,17 +355,36 @@ export function CodesList({
         </Select>
       ) : null}
 
+      {kinds.beide ? (
+        <Select
+          aria-label="Nach Art filtern"
+          className="!w-auto"
+          value={modeFilter}
+          onChange={(event) =>
+            changeModeFilter(event.target.value as ModeFilter)
+          }
+        >
+          {(Object.keys(MODE_LABELS) as ModeFilter[]).map((key) => (
+            <option key={key} value={key}>
+              {MODE_LABELS[key]}
+            </option>
+          ))}
+        </Select>
+      ) : null}
+
       <Select
         aria-label="Sortierung"
         className="!w-auto"
         value={sort}
         onChange={(event) => setSort(event.target.value as SortKey)}
       >
-        {(Object.keys(SORT_LABELS) as SortKey[]).map((key) => (
+        {(Object.keys(SORT_LABELS) as SortKey[])
-          <option key={key} value={key}>
+          .filter((key) => key !== "scans" || !nurStatische)
-            {SORT_LABELS[key]}
+          .map((key) => (
-          </option>
+            <option key={key} value={key}>
-        ))}
+              {SORT_LABELS[key]}
+            </option>
+          ))}
       </Select>
 
       <div
@@ -406,12 +460,13 @@ export function CodesList({
       {codes.length > 0 && visible.length === 0 ? (
         <Card className="text-center">
           <p className="text-sm text-slate-600">
-            Kein Code passt zur Suche.{" "}
+            Kein Code passt zu Suche und Filtern.{" "}
             <button
               type="button"
               onClick={() => {
                 setQuery("");
                 setGroupFilter("alle");
+                setModeFilter("alle");
               }}
               className="font-medium text-accent-text underline"
             >
@@ -446,9 +501,11 @@ export function CodesList({
                     Gruppe
                   </th>
                 ) : null}
-                <th scope="col" className="w-16 px-3 py-2.5 text-right sm:w-20">
+                {nurStatische ? null : (
-                  Scans
+                  <th scope="col" className="w-16 px-3 py-2.5 text-right sm:w-20">
-                </th>
+                    Scans
+                  </th>
+                )}
                 <th
                   scope="col"
                   className="hidden w-24 px-3 py-2.5 whitespace-nowrap sm:table-cell"
@@ -571,15 +628,20 @@ export function CodesList({
                     </td>
                   ) : null}
 
-                  <td className="px-3 py-2.5 text-right font-semibold text-slate-900 tabular-nums">
+                  {nurStatische ? null : (
-                    {code.mode === "static" ? (
+                    <td className="px-3 py-2.5 text-right font-semibold text-slate-900 tabular-nums">
-                      <span className="font-normal text-slate-400" title="Statische Codes werden nicht gezählt">
+                      {code.mode === "static" ? (
-                        —
+                        <span
-                      </span>
+                          className="font-normal text-slate-400"
-                    ) : (
+                          title="Statische Codes werden nicht gezählt"
-                      code.scans
+                        >
-                    )}
+                          —
-                  </td>
+                        </span>
+                      ) : (
+                        code.scans
+                      )}
+                    </td>
+                  )}
 
                   <td
                     className="hidden px-3 py-2.5 whitespace-nowrap text-slate-500 tabular-nums sm:table-cell"

src/components/domain-admin.tsx

@@ -2,6 +2,9 @@
 
 import { useCallback, useEffect, useState } from "react";
 
+import { DomainBericht } from "@/components/domain-bericht";
+import { DomainHilfe } from "@/components/domain-hilfe";
+import { HelpButton } from "@/components/help-button";
 import { Icon } from "@/components/icons";
 import { Modal } from "@/components/modal";
 import {
@@ -14,6 +17,7 @@ import {
   TextInput,
 } from "@/components/ui";
 import { ApiError, apiJson } from "@/lib/api-client";
+import type { Pruefbericht } from "@/lib/domain-check";
 
 type Grant = { groupId: string; groupName: string; isDefault: boolean };
 
@@ -44,6 +48,10 @@ export function DomainAdmin({ baseUrlHostname }: { baseUrlHostname: string }) {
 
   const [deleting, setDeleting] = useState<AdminDomain | null>(null);
 
+  /** Prüfberichte je Domain — bleiben stehen, bis erneut geprüft wird. */
+  const [reports, setReports] = useState<Record<string, Pruefbericht>>({});
+  const [checking, setChecking] = useState<string | null>(null);
+
   const load = useCallback(async () => {
     try {
       const result = await apiJson<{
@@ -122,6 +130,26 @@ export function DomainAdmin({ baseUrlHostname }: { baseUrlHostname: string }) {
     }
   };
 
+  const check = async (domain: AdminDomain) => {
+    setChecking(domain.id);
+    setError(null);
+    try {
+      const { report } = await apiJson<{ report: Pruefbericht }>(
+        `/api/admin/domains/${domain.id}/check`,
+        { method: "POST" },
+      );
+      setReports((bisher) => ({ ...bisher, [domain.id]: report }));
+    } catch (caught) {
+      setError(
+        caught instanceof ApiError
+          ? caught.message
+          : "Die Prüfung ließ sich nicht ausführen.",
+      );
+    } finally {
+      setChecking(null);
+    }
+  };
+
   if (domains === null) {
     return <p className="text-sm text-slate-500">Domains werden geladen …</p>;
   }
@@ -134,10 +162,14 @@ export function DomainAdmin({ baseUrlHostname }: { baseUrlHostname: string }) {
         Eine Domain wirkt erst, wenn dein Reverse Proxy sie auf diese Anwendung
         weiterleitet. Die Weiterleitung erkennt sie am{" "}
         <code className="font-mono text-xs">Host</code>-Header und prüft ihn
-        gegen diese Liste — ein unbekannter Hostname endet mit 404.
+        gegen diese Liste — ein unbekannter Hostname endet mit 404. Was dafür
+        einzurichten ist, steht in der Kurzhilfe.
       </Notice>
 
-      <div className="flex justify-end">
+      <div className="flex flex-wrap items-center justify-between gap-2">
+        <HelpButton title="Eine Domain hinzufügen" label="Kurzhilfe">
+          <DomainHilfe baseUrlHostname={baseUrlHostname} />
+        </HelpButton>
         <Button type="button" onClick={() => setCreating(true)}>
           Domain registrieren
         </Button>
@@ -192,6 +224,16 @@ export function DomainAdmin({ baseUrlHostname }: { baseUrlHostname: string }) {
                   <Icon name="pencil" className="size-3.5" />
                   Gruppen zuteilen
                 </Button>
+                <Button
+                  type="button"
+                  variant="secondary"
+                  size="sm"
+                  disabled={checking !== null}
+                  onClick={() => void check(domain)}
+                >
+                  <Icon name="scan" className="size-3.5" />
+                  {checking === domain.id ? "Prüft …" : "Prüfen"}
+                </Button>
                 <Button
                   type="button"
                   variant="secondary"
@@ -213,6 +255,10 @@ export function DomainAdmin({ baseUrlHostname }: { baseUrlHostname: string }) {
                   Löschen
                 </Button>
               </div>
+
+              {reports[domain.id] ? (
+                <DomainBericht bericht={reports[domain.id]} />
+              ) : null}
             </div>
           </div>
         </Card>

src/components/domain-bericht.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+import { Icon } from "@/components/icons";
+import { cx } from "@/components/ui";
+import type { Pruefbericht, SchrittStatus } from "@/lib/domain-check";
+
+/**
+ * Das Ergebnis eines Domain-Checks.
+ *
+ * Vier Zeilen, eine je Schritt, mit dem Grund im Klartext daneben. Bewusst
+ * ohne Ampelfarbe als einziges Merkmal: Jede Zeile trägt ein eigenes Symbol
+ * und einen eigenen Text, damit sie auch ohne Farbe lesbar bleibt.
+ */
+
+const SYMBOLE: Record<SchrittStatus, { icon: "check" | "warning" | "eyeOff"; farbe: string; wort: string }> = {
+  ok: { icon: "check", farbe: "text-emerald-600", wort: "in Ordnung" },
+  warnung: { icon: "warning", farbe: "text-amber-600", wort: "Achtung" },
+  fehler: { icon: "warning", farbe: "text-red-600", wort: "Fehler" },
+  uebersprungen: { icon: "eyeOff", farbe: "text-slate-400", wort: "übersprungen" },
+};
+
+const RAHMEN: Record<Pruefbericht["gesamt"], string> = {
+  ok: "border-emerald-300 bg-emerald-50/60",
+  warnung: "border-amber-300 bg-amber-50/60",
+  fehler: "border-red-300 bg-red-50/60",
+};
+
+const FAZIT: Record<Pruefbericht["gesamt"], string> = {
+  ok: "Die Domain führt hierher.",
+  warnung: "Es läuft, aber etwas will beachtet werden.",
+  fehler: "So kommt niemand hier an.",
+};
+
+export function DomainBericht({ bericht }: { bericht: Pruefbericht }) {
+  return (
+    <div className={cx("mt-4 rounded-xl border p-4", RAHMEN[bericht.gesamt])}>
+      <p className="text-sm font-semibold text-slate-900">
+        {FAZIT[bericht.gesamt]}
+      </p>
+
+      <ul className="mt-3 space-y-1.5">
+        {bericht.schritte.map((schritt) => {
+          const zeichen = SYMBOLE[schritt.status];
+          return (
+            <li key={schritt.name} className="flex items-start gap-2 text-sm">
+              <Icon
+                name={zeichen.icon}
+                className={cx("mt-0.5 size-4 shrink-0", zeichen.farbe)}
+              />
+              <span className="sr-only">{zeichen.wort}: </span>
+              <span className="w-24 shrink-0 font-medium text-slate-700">
+                {schritt.titel}
+              </span>
+              <span className="min-w-0 flex-1 text-slate-600">
+                {schritt.detail}
+              </span>
+            </li>
+          );
+        })}
+      </ul>
+
+      <p className="mt-3 text-xs text-slate-500">
+        Aufgerufen wurde{" "}
+        <code className="font-mono">{bericht.geprueft}</code> — von dort, wo
+        dieser Container läuft. Bei internem DNS oder Hairpin-NAT kann die
+        Prüfung scheitern, obwohl von außen alles stimmt.
+      </p>
+    </div>
+  );
+}

src/components/domain-hilfe.tsx

@@ -0,0 +1,128 @@
+"use client";
+
+import { HelpCode, HelpStep } from "@/components/help-button";
+
+/**
+ * Der Inhalt der Kurzhilfe auf der Domain-Seite.
+ *
+ * Verdichtet aus dem README-Abschnitt „Hinter einem Reverse Proxy“. Bewusst
+ * nur die Schritte, die diese Anwendung betreffen — wie man im eigenen Proxy
+ * einen Eintrag anlegt, steht in dessen Handbuch besser.
+ */
+export function DomainHilfe({ baseUrlHostname }: { baseUrlHostname: string }) {
+  const beispiel = baseUrlHostname || "qr.example.com";
+
+  return (
+    <div className="space-y-5">
+      <p>
+        Eine Domain hier zu registrieren genügt nicht — sie muss den Browser
+        auch hierher führen. Dazu gehören drei Dinge außerhalb dieser
+        Anwendung: ein DNS-Eintrag, ein Eintrag im Reverse Proxy und ein
+        Zertifikat.
+      </p>
+
+      <ol className="space-y-4">
+        <HelpStep n={1} title="DNS-Eintrag anlegen">
+          <p>
+            Beim Anbieter der Domain einen <strong>A-Record</strong> (bei IPv6
+            zusätzlich <strong>AAAA</strong>) auf die öffentliche Adresse des
+            Reverse Proxy setzen. Ein CNAME auf einen bestehenden Namen tut es
+            auch.
+          </p>
+          <p>
+            Steht der Name nur im internen DNS oder ist er nur über VPN
+            erreichbar, funktionieren gedruckte Codes{" "}
+            <strong>auch nur dort</strong>. Für Aushänge, Flyer und
+            Verpackungen muss er öffentlich auflösbar sein.
+          </p>
+        </HelpStep>
+
+        <HelpStep n={2} title="Im Reverse Proxy weiterleiten">
+          <p>
+            Für die Domain einen eigenen Eintrag anlegen, der auf diese
+            Anwendung zeigt — Ziel ist der Docker-Host auf Port{" "}
+            <code className="font-mono text-xs">3000</code>, oder im selben
+            Docker-Netz der Servicename{" "}
+            <code className="font-mono text-xs">app</code>.
+          </p>
+          <p>
+            Diese drei Kopfzeilen muss der Proxy mitschicken. Nginx Proxy
+            Manager, Traefik und Caddy tun das von sich aus; ein blankes nginx
+            braucht sie im Serverblock:
+          </p>
+          <HelpCode>{`proxy_set_header Host              $host;
+proxy_set_header X-Forwarded-Host  $host;
+proxy_set_header X-Forwarded-Proto $scheme;
+proxy_set_header X-Forwarded-For   $proxy_add_x_forwarded_for;`}</HelpCode>
+          <p>
+            Ohne <code className="font-mono text-xs">X-Forwarded-Host</code>{" "}
+            landet jeder Aufruf unter der Standard-Domain, und Kurz-URLs der
+            Zweitdomain werden nicht gefunden.
+          </p>
+        </HelpStep>
+
+        <HelpStep n={3} title="Zertifikat anfordern">
+          <p>
+            HTTPS erledigt der Proxy. Im Nginx Proxy Manager ist das der Reiter{" "}
+            <em>SSL</em> mit <em>Force SSL</em>; Traefik und Caddy holen das
+            Zertifikat selbst, sobald der DNS-Eintrag steht.
+          </p>
+          <p>
+            Ohne gültiges Zertifikat brechen viele Scanner-Apps den Aufruf ohne
+            Erklärung ab — der Code sieht dann für die Nutzer schlicht kaputt
+            aus.
+          </p>
+        </HelpStep>
+
+        <HelpStep n={4} title="Domain hier registrieren">
+          <p>
+            Über <strong>Domain registrieren</strong> den Hostnamen eintragen —
+            genau so, wie er im Browser steht, ohne{" "}
+            <code className="font-mono text-xs">https://</code> und ohne Pfad:
+          </p>
+          <HelpCode>{beispiel}</HelpCode>
+          <p>
+            Die Weiterleitung prüft den Hostnamen gegen diese Liste. Ein
+            unbekannter Name endet mit 404 — über eine gefälschte Kopfzeile
+            lässt sich also keine fremde Domain ansprechen.
+          </p>
+        </HelpStep>
+
+        <HelpStep n={5} title="Einer Gruppe zuteilen">
+          <p>
+            Eine frisch registrierte Domain gehört noch niemandem. Erst über{" "}
+            <strong>Gruppen zuteilen</strong> können Mitglieder dieser Gruppe
+            dort Codes anlegen. Die als <em>Voreinstellung</em> markierte
+            Domain ist die, die beim Anlegen vorausgewählt ist.
+          </p>
+        </HelpStep>
+
+        <HelpStep n={6} title="Nachprüfen">
+          <p>Von außerhalb des eigenen Netzes:</p>
+          <HelpCode>{`curl -I https://${beispiel}/`}</HelpCode>
+          <p>
+            Kommt eine Antwort dieser Anwendung, stimmen DNS, Proxy und
+            Zertifikat. Danach einen Code der zugeteilten Gruppe anlegen, die
+            Domain auswählen und den fertigen Code einmal mit dem Handy
+            scannen — das ist die einzige Prüfung, die wirklich zählt.
+          </p>
+        </HelpStep>
+      </ol>
+
+      <div className="rounded-xl border border-slate-200 bg-slate-50 p-4">
+        <h3 className="font-semibold text-slate-900">
+          Was <code className="font-mono text-xs">BASE_URL</code> damit zu tun hat
+        </h3>
+        <p className="mt-1 text-slate-600">
+          Die Umgebungsvariable{" "}
+          <code className="font-mono text-xs">BASE_URL</code> ist die
+          Standard-Adresse: Sie greift bei Aufrufen über eine nicht
+          registrierte Adresse und bestimmt, ob Kurz-URLs mit{" "}
+          <code className="font-mono text-xs">http</code> oder{" "}
+          <code className="font-mono text-xs">https</code> gebildet werden.
+          Weitere Domains werden hier registriert, nicht dort eingetragen.
+        </p>
+      </div>
+    </div>
+  );
+}

src/components/help-button.tsx

@@ -0,0 +1,94 @@
+"use client";
+
+import { useState, type ReactNode } from "react";
+
+import { Icon } from "@/components/icons";
+import { Modal } from "@/components/modal";
+import { Button } from "@/components/ui";
+
+/**
+ * Kurzhilfe: ein Fragezeichen neben einer Überschrift, das eine Erklärung
+ * aufklappt.
+ *
+ * Bewusst ein Dialog und kein Dauertext auf der Seite — die Erklärung braucht
+ * man einmal beim Einrichten und danach nie wieder. Sie ständig zu zeigen
+ * würde die Seite für alle anderen Aufrufe zumüllen.
+ */
+export function HelpButton({
+  title,
+  label = "Hilfe",
+  children,
+}: {
+  /** Überschrift des Dialogs. */
+  title: string;
+  /** Beschriftung des Knopfes. */
+  label?: string;
+  children: ReactNode;
+}) {
+  const [open, setOpen] = useState(false);
+
+  return (
+    <>
+      <Button
+        type="button"
+        variant="secondary"
+        size="sm"
+        onClick={() => setOpen(true)}
+        aria-haspopup="dialog"
+      >
+        <Icon name="help" className="size-4" />
+        {label}
+      </Button>
+
+      <Modal
+        open={open}
+        size="lg"
+        title={title}
+        onClose={() => setOpen(false)}
+        footer={
+          <Button type="button" onClick={() => setOpen(false)}>
+            Verstanden
+          </Button>
+        }
+      >
+        <div className="max-h-[65vh] overflow-y-auto pr-1 text-sm text-slate-700">
+          {children}
+        </div>
+      </Modal>
+    </>
+  );
+}
+
+/* ------------------------------------------------- Bausteine für den Inhalt */
+
+/** Ein nummerierter Schritt mit Überschrift. */
+export function HelpStep({
+  n,
+  title,
+  children,
+}: {
+  n: number;
+  title: string;
+  children: ReactNode;
+}) {
+  return (
+    <li className="flex gap-3">
+      <span className="mt-0.5 flex size-6 shrink-0 items-center justify-center rounded-full bg-accent-soft text-xs font-semibold text-accent-soft-fg">
+        {n}
+      </span>
+      <div className="min-w-0 flex-1">
+        <h3 className="font-semibold text-slate-900">{title}</h3>
+        <div className="mt-1 space-y-2 text-slate-600">{children}</div>
+      </div>
+    </li>
+  );
+}
+
+/** Ein Befehl oder Wert zum Abtippen — auf schmalen Schirmen scrollbar. */
+export function HelpCode({ children }: { children: ReactNode }) {
+  return (
+    <pre className="overflow-x-auto rounded-lg bg-slate-100 px-3 py-2 font-mono text-xs text-slate-800">
+      {children}
+    </pre>
+  );
+}

src/components/icons.tsx

@@ -238,6 +238,13 @@ const PATHS = {
       <path d="M8 10.5V7.5a4 4 0 0 1 8 0v3" />
     </>
   ),
+  help: (
+    <>
+      <circle cx="12" cy="12" r="9" />
+      <path d="M9.5 9.5a2.5 2.5 0 1 1 3.2 2.4c-.6.2-.95.75-.95 1.4v.45" />
+      <path d="M11.75 16.75h.01" />
+    </>
+  ),
 } as const;
 
 export type IconName = keyof typeof PATHS;

src/components/modal.tsx

@@ -9,12 +9,15 @@ export function Modal({
   onClose,
   children,
   footer,
+  size = "md",
 }: {
   open: boolean;
   title: string;
   onClose: () => void;
   children: ReactNode;
   footer?: ReactNode;
+  /** `lg` für längere Texte wie eine Kurzhilfe. */
+  size?: "md" | "lg";
 }) {
   const ref = useRef<HTMLDialogElement>(null);
 
@@ -39,7 +42,9 @@ export function Modal({
         // Klick auf die Hintergrundfläche des Dialogs schließt ihn.
         if (event.target === ref.current) onClose();
       }}
-      className="m-auto w-[calc(100%-2rem)] max-w-lg rounded-2xl border border-slate-200 bg-surface p-0 shadow-xl backdrop:bg-scrim/50"
+      className={`m-auto w-[calc(100%-2rem)] ${
+        size === "lg" ? "max-w-2xl" : "max-w-lg"
+      } rounded-2xl border border-slate-200 bg-surface p-0 shadow-xl backdrop:bg-scrim/50`}
     >
       <div className="p-5 sm:p-6">
         <h2 className="text-lg font-semibold text-slate-900">{title}</h2>

src/components/qr-generator.tsx

@@ -43,6 +43,21 @@ function sameData(a: unknown, b: unknown): boolean {
   return stableStringify(a) === stableStringify(b);
 }
 
+/** Der bereits abgelegte Code, den die Dublettenprüfung gemeldet hat. */
+type Dublette = { id: string; label: string | null; createdAt: string };
+
+/** Liest die Meldung aus einer 409-Antwort — oder gibt auf. */
+function leseDublette(details: unknown): Dublette | null {
+  if (details === null || typeof details !== "object") return null;
+  const feld = (details as { duplicate?: unknown }).duplicate;
+  if (feld === null || typeof feld !== "object") return null;
+  const { id, label, createdAt } = feld as Record<string, unknown>;
+  if (typeof id !== "string" || typeof createdAt !== "string") return null;
+  return { id, label: typeof label === "string" ? label : null, createdAt };
+}
+
+const dublettenDatum = new Intl.DateTimeFormat("de-DE", { dateStyle: "medium" });
+
 export function QrGenerator({
   typeId,
   /** Darf der Kurz-Link selbst vergeben werden? Sonst erscheint das Feld nicht. */
@@ -65,6 +80,14 @@ export function QrGenerator({
   const [saved, setSaved] = useState<QrCodeDto | null>(null);
   const [saving, setSaving] = useState(false);
   const [saveError, setSaveError] = useState<string | null>(null);
+  /**
+   * Gemeldete Dublette samt dem Inhalt, für den sie gilt. Ändert sich der
+   * Inhalt, ist die Warnung überholt und verschwindet von selbst — ohne
+   * einen Effekt, der sie hinterherräumt.
+   */
+  const [duplicate, setDuplicate] = useState<
+    { treffer: Dublette; inhalt: string } | null
+  >(null);
   const [copied, setCopied] = useState(false);
 
   const [preview, setPreview] = useState<PreviewState | null>(null);
@@ -187,10 +210,18 @@ export function QrGenerator({
       !sameData(saved.design, design) ||
       (saved.label ?? "") !== label.trim());
 
-  const handleSave = useCallback(async () => {
+  // Nur zeigen, solange der Inhalt derselbe ist, für den die Meldung kam.
+  const dublette =
+    duplicate !== null &&
+    duplicate.inhalt === stableStringify(validation.ok ? validation.data : data)
+      ? duplicate.treffer
+      : null;
+
+  const handleSave = useCallback(async (trotzDublette = false) => {
     if (!validation.ok || !designValid || slugProblem) return;
     setSaving(true);
     setSaveError(null);
+    setDuplicate(null);
     try {
       const body = {
         type: typeId,
@@ -200,6 +231,8 @@ export function QrGenerator({
         label: label.trim() || undefined,
         // Ein statischer Code hat keinen Kurz-Link.
         slug: isDynamic ? wunschSlug.trim() || undefined : undefined,
+        // Nur beim zweiten Anlauf, nachdem die Warnung dastand.
+        allowDuplicate: trotzDublette,
       };
       const result = saved
         ? await apiJson<{ code: QrCodeDto }>(`/api/codes/${saved.id}`, {
@@ -212,11 +245,20 @@ export function QrGenerator({
           });
       setSaved(result.code);
     } catch (error) {
-      setSaveError(
+      // Eine gemeldete Dublette ist kein Fehler, sondern eine Rückfrage.
-        error instanceof ApiError
+      const gemeldet =
-          ? error.message
+        error instanceof ApiError && error.status === 409
-          : "Der Code konnte nicht gespeichert werden.",
+          ? leseDublette(error.details)
-      );
+          : null;
+      if (gemeldet) {
+        setDuplicate({ treffer: gemeldet, inhalt: stableStringify(validation.data) });
+      } else {
+        setSaveError(
+          error instanceof ApiError
+            ? error.message
+            : "Der Code konnte nicht gespeichert werden.",
+        );
+      }
     } finally {
       setSaving(false);
     }
@@ -232,6 +274,7 @@ export function QrGenerator({
     setIsDynamic(dynamisch);
     setSaved(null);
     setSaveError(null);
+    setDuplicate(null);
   }, []);
 
   const handleCopy = useCallback(async () => {
@@ -423,14 +466,43 @@ export function QrGenerator({
                       </Link>
                     </div>
                   ) : (
-                    <Button
+                    <div className="space-y-3">
-                      type="button"
+                      {dublette ? (
-                      variant="secondary"
+                        <Notice tone="warning">
-                      onClick={handleSave}
+                          <span className="font-medium">
-                      disabled={saving || !ready}
+                            Diesen Inhalt hast du schon abgelegt
-                    >
+                          </span>{" "}
-                      {saving ? "Legt ab …" : "In „Meine Codes“ ablegen"}
+                          — {dublette.label ? `„${dublette.label}“` : "ohne Namen"}{" "}
-                    </Button>
+                          vom {dublettenDatum.format(new Date(dublette.createdAt))}.
+                          Zweimal derselbe Inhalt ergibt zweimal denselben Code.
+                          <span className="mt-1 block text-xs">
+                            Verglichen wird nur der Inhalt, nicht die Gestaltung —
+                            derselbe Code in anderen Farben gilt hier als Dublette.
+                          </span>
+                          <span className="mt-2 flex flex-wrap items-center gap-3">
+                            <Link
+                              href="/meine-codes"
+                              className="inline-flex items-center gap-1.5 rounded-lg text-sm font-medium underline"
+                            >
+                              Den vorhandenen ansehen
+                              <Icon name="external" className="size-3.5" />
+                            </Link>
+                          </span>
+                        </Notice>
+                      ) : null}
+                      <Button
+                        type="button"
+                        variant="secondary"
+                        onClick={() => void handleSave(dublette !== null)}
+                        disabled={saving || !ready}
+                      >
+                        {saving
+                          ? "Legt ab …"
+                          : dublette
+                            ? "Trotzdem ablegen"
+                            : "In „Meine Codes“ ablegen"}
+                      </Button>
+                    </div>
                   )
                 ) : saved ? (
                   <div className="space-y-3">
@@ -460,7 +532,7 @@ export function QrGenerator({
                       {hasUnsavedChanges ? (
                         <Button
                           type="button"
-                          onClick={handleSave}
+                          onClick={() => void handleSave()}
                           disabled={saving || !ready}
                         >
                           {saving ? "Speichert …" : "Änderungen speichern"}
@@ -492,7 +564,7 @@ export function QrGenerator({
                     </Notice>
                     <Button
                       type="button"
-                      onClick={handleSave}
+                      onClick={() => void handleSave()}
                       disabled={saving || !ready || Boolean(slugProblem)}
                     >
                       {saving ? "Speichert …" : "Dynamischen Code speichern"}

src/lib/api-client.ts

@@ -1,23 +1,42 @@
 /** Kleine Hilfen für Aufrufe der eigenen API aus Client-Komponenten. */
 
-async function readError(response: Response): Promise<string> {
+async function readError(response: Response): Promise<ApiError> {
+  let body: unknown = null;
   try {
-    const body: unknown = await response.json();
+    body = await response.json();
-    if (
-      body !== null &&
-      typeof body === "object" &&
-      "error" in body &&
-      typeof (body as { error: unknown }).error === "string"
-    ) {
-      return (body as { error: string }).error;
-    }
   } catch {
     // Antwort ohne JSON-Körper — unten kommt die allgemeine Meldung.
   }
-  return `Die Anfrage ist fehlgeschlagen (HTTP ${response.status}).`;
+
+  const message =
+    body !== null &&
+    typeof body === "object" &&
+    "error" in body &&
+    typeof (body as { error: unknown }).error === "string"
+      ? (body as { error: string }).error
+      : `Die Anfrage ist fehlgeschlagen (HTTP ${response.status}).`;
+
+  return new ApiError(message, response.status, body);
 }
 
-export class ApiError extends Error {}
+/**
+ * Fehler einer eigenen API-Antwort.
+ *
+ * Trägt neben der Meldung auch den Status und den Antwortkörper: Manche
+ * Fehler sind keine Sackgasse, sondern eine Rückfrage — etwa die gemeldete
+ * Dublette beim Ablegen, zu der die Oberfläche den vorhandenen Eintrag
+ * anzeigen will.
+ */
+export class ApiError extends Error {
+  readonly status: number;
+  readonly details: unknown;
+
+  constructor(message: string, status = 0, details: unknown = null) {
+    super(message);
+    this.status = status;
+    this.details = details;
+  }
+}
 
 export async function apiJson<T>(
   url: string,
@@ -34,7 +53,7 @@ export async function apiJson<T>(
   });
 
   if (!response.ok) {
-    throw new ApiError(await readError(response));
+    throw await readError(response);
   }
   if (response.status === 204) {
     return undefined as T;
@@ -55,7 +74,7 @@ export async function downloadFile(
   });
 
   if (!response.ok) {
-    throw new ApiError(await readError(response));
+    throw await readError(response);
   }
 
   const disposition = response.headers.get("Content-Disposition") ?? "";

src/lib/changelog.ts

@@ -0,0 +1,126 @@
+import pkg from "../../package.json";
+
+/**
+ * Änderungsverlauf der Anwendung — die einzige Quelle dafür.
+ *
+ * Hieraus entsteht beides: die Seite unter `/version` und die `CHANGELOG.md`
+ * im Wurzelverzeichnis (`npm run changelog`). Zwei gepflegte Listen liefen
+ * unweigerlich auseinander; eine Prüfung wacht darüber, dass die erzeugte
+ * Datei zu dieser Quelle passt.
+ *
+ * Die Einträge sind aus dem Abschnitt „Gebaut“ der Roadmap und der
+ * Git-Historie zusammengetragen. Versionsnummern gab es dabei nie — es
+ * existieren keine Tags —, deshalb ist je **Erscheinungstag** eine Version
+ * gebildet. Das ist nachträglich vergeben, aber die Daten selbst stimmen.
+ */
+export type ChangelogEntry = {
+  version: string;
+  /** ISO-Datum, an dem der Stand entstanden ist. */
+  date: string;
+  /** Eine Zeile zur Einordnung — was diese Version ausmacht. */
+  summary: string;
+  changes: string[];
+};
+
+export const CHANGELOG: readonly ChangelogEntry[] = [
+  {
+    version: "1.6.0",
+    date: "2026-08-21",
+    summary: "Sichtbare Version mit Änderungsverlauf.",
+    changes: [
+      "Die laufende Version steht in der Fußzeile und führt auf eine Seite mit dem vollständigen Änderungsverlauf.",
+      "Der Verlauf wird an einer Stelle gepflegt; die CHANGELOG.md im Projekt entsteht daraus.",
+      "Die Roadmap verweist für Vergangenes auf den Changelog und behält den Blick nach vorn.",
+    ],
+  },
+  {
+    version: "1.5.0",
+    date: "2026-08-20",
+    summary: "Statische Codes lassen sich benennen und ablegen.",
+    changes: [
+      "Das Feld „Name“ gilt in beiden Betriebsarten, nicht mehr nur bei dynamischen Codes.",
+      "Der Name bestimmt den Dateinamen beim Herunterladen.",
+      "Ein statischer Code lässt sich in „Meine Codes“ ablegen — als Schnappschuss ohne Kurz-Link und ohne Scan-Zähler.",
+    ],
+  },
+  {
+    version: "1.4.0",
+    date: "2026-08-17",
+    summary: "Sprechende Kurz-Links und eine früh erkannte Fehlkonfiguration.",
+    changes: [
+      "Kurz-Links selbst vergeben und nachträglich ändern, mit „/“ als Trenner.",
+      "Die vorherige Adresse bleibt gültig und lässt sich einzeln freigeben — gedruckte Codes bleiben gültig.",
+      "Vergeben und Ändern ist Administratoren vorbehalten und in der Verwaltung für Bearbeiter freigebbar.",
+      "Weicht BASE_URL von der aufgerufenen Adresse ab, meldet die Anmeldung das sofort statt erst am Ende.",
+      "Auf der Anmeldeseite steht nicht mehr, wie die Anmeldung konfiguriert ist.",
+    ],
+  },
+  {
+    version: "1.3.0",
+    date: "2026-08-16",
+    summary: "Eigenes Erscheinungsbild und ein Dark Mode.",
+    changes: [
+      "Name, Logo, Favicon und Akzentfarbe sind im Admin-Bereich einstellbar.",
+      "Hell und dunkel folgen dem Betriebssystem, mit Umschalter für eine eigene Wahl.",
+      "Das Update-Skript erklärt, warum ein Vorspulen scheitert, statt nur abzubrechen.",
+      "Die Authentik-Anleitung sagt deutlicher, wie die Redirect URI zu bilden ist.",
+    ],
+  },
+  {
+    version: "1.2.0",
+    date: "2026-08-15",
+    summary: "Single Sign-on, Dokumentation und eine Sicherheitsdurchsicht.",
+    changes: [
+      "Anmeldung über Authentik und andere OIDC-Anbieter, mit PKCE und geprüftem ID-Token.",
+      "Bedienungsanleitung mit Bildern, Funktionsübersicht und Roadmap.",
+      "Anmeldung und Sitzungen nach OWASP durchgesehen und gehärtet: stärkere Passwort-Parameter, Längengrenze, Herkunftsprüfung, Schutzheader, absolute Sitzungsdauer.",
+      "Auf der Startseite steht „nur dynamisch“ statt eines nichtssagenden Abzeichens an jeder Kachel.",
+    ],
+  },
+  {
+    version: "1.1.0",
+    date: "2026-08-14",
+    summary: "Alle fünfzehn QR-Typen, Anmeldung, Gruppen und mehrere Domains.",
+    changes: [
+      "Vierzehn weitere QR-Typen — von vCard und WLAN bis PDF, Bild und Feedback.",
+      "Landingpages als eigene Gattung für Typen ohne fremdes Ziel.",
+      "Datei-Upload mit Inhaltsprüfung, Größengrenze und Aufräumen.",
+      "Anmeldung, Benutzer, Gruppen und die Rollen Administrator, Bearbeiter und Betrachter.",
+      "Mehrere Domains für Kurz-URLs, den Gruppen zugeteilt.",
+      "„Meine Codes“ als Liste mit Suche, Sortierung und Gruppenfilter.",
+      "Einzelne QR-Typen lassen sich in der Verwaltung ausblenden.",
+    ],
+  },
+  {
+    version: "1.0.0",
+    date: "2026-08-13",
+    summary: "Erste lauffähige Fassung.",
+    changes: [
+      "Next.js-Anwendung und PostgreSQL als Docker-Compose-Stack, Migrationen beim Start.",
+      "QR-Typ Website, statisch und dynamisch, mit Kurz-URL, Weiterleitung und Scan-Zähler.",
+      "Gestaltung mit Farben, Kontrastwarnung, Größe, Fehlerkorrektur und Rand.",
+      "Download als PNG und SVG, serverseitig gerendert.",
+      "Update-Skript für Linux, macOS und Windows.",
+    ],
+  },
+];
+
+/**
+ * Die laufende Version.
+ *
+ * Aus der `package.json`, damit es genau eine Stelle gibt, an der sie steht.
+ * Der Wert wird beim Bauen eingesetzt — im Container liegt kein Git, aus dem
+ * sich sonst etwas ableiten ließe.
+ */
+export const APP_VERSION: string = pkg.version;
+
+/** Der Eintrag zur laufenden Version, falls er im Verlauf steht. */
+export function currentEntry(): ChangelogEntry | undefined {
+  return CHANGELOG.find((eintrag) => eintrag.version === APP_VERSION);
+}
+
+/** Datum als „21.08.2026“ — ohne Abhängigkeit von der Zeitzone des Servers. */
+export function formatChangelogDate(iso: string): string {
+  const [jahr, monat, tag] = iso.split("-");
+  return `${tag}.${monat}.${jahr}`;
+}

src/lib/domain-check.ts

@@ -0,0 +1,478 @@
+import "server-only";
+
+import { createHmac, randomBytes, timingSafeEqual } from "node:crypto";
+import { lookup } from "node:dns/promises";
+import { connect, type PeerCertificate } from "node:tls";
+
+import { prisma } from "@/lib/db";
+
+/**
+ * Domain-Check: Führt die Domain wirklich hierher?
+ *
+ * Eine Domain zu registrieren ist der kleinste Teil der Arbeit — DNS, Reverse
+ * Proxy und Zertifikat liegen außerhalb dieser Anwendung, und wenn dort etwas
+ * fehlt, merkt man es erst am gedruckten Code, der nicht aufgeht.
+ *
+ * Die Prüfung geht deshalb den Weg der Scanner nach: Namen auflösen, das
+ * Zertifikat ansehen, die Adresse aufrufen — und sich beweisen lassen, dass
+ * am anderen Ende **diese** Installation steht. Der Beweis ist ein HMAC über
+ * eine frische Zufallszahl; das Geheimnis dafür verlässt den Server nie.
+ *
+ * Die Grenze der Aussage steht in der Meldung selbst: Der Aufruf startet dort,
+ * wo dieser Container läuft. Wer internes DNS oder Hairpin-NAT hat, bekommt
+ * hier womöglich einen Fehler, obwohl von außen alles stimmt.
+ */
+
+export type SchrittName = "dns" | "erreichbar" | "zertifikat" | "ziel";
+export type SchrittStatus = "ok" | "warnung" | "fehler" | "uebersprungen";
+
+export type Pruefschritt = {
+  name: SchrittName;
+  titel: string;
+  status: SchrittStatus;
+  detail: string;
+};
+
+export type Pruefbericht = {
+  hostname: string;
+  /** Die Adresse, die tatsächlich aufgerufen wurde. */
+  geprueft: string;
+  gesamt: "ok" | "warnung" | "fehler";
+  schritte: Pruefschritt[];
+};
+
+/** Antwort der öffentlichen Beweis-Route. */
+export type Domainbeweis = { app: string; proof: string };
+
+const APP_KENNUNG = "qrcode-generator";
+const ZEITGRENZE_MS = 8000;
+
+/* ------------------------------------------------------------- Geheimnis */
+
+/**
+ * Das Geheimnis für den Beweis — beim ersten Aufruf erzeugt.
+ *
+ * Bewusst in der Datenbank und nicht im Arbeitsspeicher: Die prüfende Route
+ * und die antwortende Route sind zwei getrennte Bündel und teilen sich keinen
+ * Modulzustand. Ein Wert im Speicher wäre auf beiden Seiten ein anderer.
+ */
+export async function getCheckSecret(): Promise<string> {
+  const vorhanden = await prisma.instanceSetting.findUnique({
+    where: { id: "instance" },
+    select: { checkSecret: true },
+  });
+  if (vorhanden?.checkSecret) return vorhanden.checkSecret;
+
+  const neu = randomBytes(32).toString("hex");
+
+  // `updateMany` mit der Bedingung „noch leer“ statt eines schlichten
+  // `update`: Zwei gleichzeitige Prüfungen sollen nicht zwei verschiedene
+  // Geheimnisse hinterlassen, von denen eines sofort wieder ungültig ist.
+  await prisma.instanceSetting.upsert({
+    where: { id: "instance" },
+    create: { id: "instance", checkSecret: neu },
+    update: {},
+  });
+  await prisma.instanceSetting.updateMany({
+    where: { id: "instance", checkSecret: null },
+    data: { checkSecret: neu },
+  });
+
+  const danach = await prisma.instanceSetting.findUnique({
+    where: { id: "instance" },
+    select: { checkSecret: true },
+  });
+  return danach?.checkSecret ?? neu;
+}
+
+export function bildeBeweis(secret: string, nonce: string): string {
+  return createHmac("sha256", secret).update(nonce).digest("hex");
+}
+
+function gleich(a: string, b: string): boolean {
+  const links = Buffer.from(a, "utf8");
+  const rechts = Buffer.from(b, "utf8");
+  if (links.length !== rechts.length) return false;
+  return timingSafeEqual(links, rechts);
+}
+
+/* ------------------------------------------------------------------ DNS */
+
+function trenneHost(hostname: string): { host: string; port: number | null } {
+  const treffer = /^(.+):(\d{1,5})$/.exec(hostname);
+  if (!treffer) return { host: hostname, port: null };
+  return { host: treffer[1], port: Number(treffer[2]) };
+}
+
+async function pruefeDns(host: string): Promise<Pruefschritt> {
+  try {
+    const adressen = await lookup(host, { all: true });
+    if (adressen.length === 0) {
+      return {
+        name: "dns",
+        titel: "DNS",
+        status: "fehler",
+        detail: `Für ${host} ist keine Adresse hinterlegt.`,
+      };
+    }
+    return {
+      name: "dns",
+      titel: "DNS",
+      status: "ok",
+      detail: `löst auf ${adressen.map((a) => a.address).join(", ")}`,
+    };
+  } catch (error) {
+    const code = (error as { code?: string }).code;
+    return {
+      name: "dns",
+      titel: "DNS",
+      status: "fehler",
+      detail:
+        code === "ENOTFOUND"
+          ? `Der Name ${host} ist unbekannt — es fehlt der A- oder AAAA-Eintrag.`
+          : `Der Name ${host} ließ sich nicht auflösen (${code ?? "unbekannter Fehler"}).`,
+    };
+  }
+}
+
+/* ----------------------------------------------------------- Zertifikat */
+
+type Zertifikatslage =
+  | { erreichbar: true; schritt: Pruefschritt }
+  | { erreichbar: false; schritt: Pruefschritt };
+
+const datumsformat = new Intl.DateTimeFormat("de-DE", { dateStyle: "medium" });
+
+function beschreibeZertifikat(
+  zertifikat: PeerCertificate,
+  authorized: boolean,
+  fehler: string | undefined,
+): Pruefschritt {
+  const bis = new Date(zertifikat.valid_to);
+  const tage = Math.floor((bis.getTime() - Date.now()) / 86_400_000);
+  // Die Felder eines Zertifikats dürfen mehrfach vorkommen; Node liefert sie
+  // dann als Liste.
+  const ersteZeile = (wert: string | string[] | undefined): string | undefined =>
+    Array.isArray(wert) ? wert[0] : wert;
+  const aussteller =
+    ersteZeile(zertifikat.issuer?.O) ??
+    ersteZeile(zertifikat.issuer?.CN) ??
+    "unbekannt";
+
+  if (!authorized) {
+    return {
+      name: "zertifikat",
+      titel: "Zertifikat",
+      status: "fehler",
+      detail: uebersetzeTlsFehler(fehler, aussteller, bis),
+    };
+  }
+  if (tage < 0) {
+    return {
+      name: "zertifikat",
+      titel: "Zertifikat",
+      status: "fehler",
+      detail: `abgelaufen am ${datumsformat.format(bis)}`,
+    };
+  }
+  return {
+    name: "zertifikat",
+    titel: "Zertifikat",
+    status: tage <= 14 ? "warnung" : "ok",
+    detail:
+      tage <= 14
+        ? `läuft in ${tage} Tagen ab (${datumsformat.format(bis)}), ausgestellt von ${aussteller}`
+        : `gültig bis ${datumsformat.format(bis)}, ausgestellt von ${aussteller}`,
+  };
+}
+
+function uebersetzeTlsFehler(
+  fehler: string | undefined,
+  aussteller: string,
+  bis: Date,
+): string {
+  switch (fehler) {
+    case "CERT_HAS_EXPIRED":
+      return `abgelaufen am ${datumsformat.format(bis)}`;
+    case "DEPTH_ZERO_SELF_SIGNED_CERT":
+    case "SELF_SIGNED_CERT_IN_CHAIN":
+      return "selbst ausgestellt — Scanner-Apps brechen darauf ohne Erklärung ab";
+    case "ERR_TLS_CERT_ALTNAME_INVALID":
+      return "gilt für einen anderen Namen — im Proxy ist die falsche Domain hinterlegt";
+    case "UNABLE_TO_VERIFY_LEAF_SIGNATURE":
+      return `Zwischenzertifikat fehlt — der Proxy liefert die Kette unvollständig aus (${aussteller})`;
+    default:
+      return `nicht gültig (${fehler ?? "unbekannter Grund"})`;
+  }
+}
+
+/**
+ * Der Grund, aus dem ein Zertifikat durchfiel.
+ *
+ * Node liefert ihn je nach Fassung als Fehlerobjekt mit `code`, als
+ * Fehlerobjekt ohne `code` oder schlicht als Zeichenkette.
+ */
+function tlsGrund(fehler: unknown): string | undefined {
+  if (fehler === null || fehler === undefined) return undefined;
+  if (typeof fehler === "string") return fehler;
+  const objekt = fehler as { code?: unknown; message?: unknown };
+  if (typeof objekt.code === "string") return objekt.code;
+  if (typeof objekt.message === "string") return objekt.message;
+  return undefined;
+}
+
+async function pruefeZertifikat(host: string): Promise<Zertifikatslage> {
+  return new Promise((aufloesen) => {
+    // `rejectUnauthorized: false`, um ein schlechtes Zertifikat **beschreiben**
+    // zu können statt nur an ihm zu scheitern. Übertragen wird hierüber nichts.
+    const socket = connect({
+      host,
+      port: 443,
+      servername: host,
+      rejectUnauthorized: false,
+      timeout: ZEITGRENZE_MS,
+    });
+
+    const fertig = (lage: Zertifikatslage) => {
+      socket.removeAllListeners();
+      socket.destroy();
+      aufloesen(lage);
+    };
+
+    socket.once("secureConnect", () => {
+      fertig({
+        erreichbar: true,
+        schritt: beschreibeZertifikat(
+          socket.getPeerCertificate(),
+          socket.authorized,
+          tlsGrund(socket.authorizationError),
+        ),
+      });
+    });
+
+    socket.once("timeout", () => {
+      fertig({
+        erreichbar: false,
+        schritt: {
+          name: "zertifikat",
+          titel: "Zertifikat",
+          status: "fehler",
+          detail: "Auf Port 443 kam keine Antwort — läuft dort ein Webserver?",
+        },
+      });
+    });
+
+    socket.once("error", (error: NodeJS.ErrnoException) => {
+      fertig({
+        erreichbar: false,
+        schritt: {
+          name: "zertifikat",
+          titel: "Zertifikat",
+          status: "fehler",
+          detail:
+            error.code === "ECONNREFUSED"
+              ? "Port 443 nimmt keine Verbindung an — es gibt hier kein HTTPS."
+              : `Die TLS-Verbindung scheiterte (${error.code ?? error.message}).`,
+        },
+      });
+    });
+  });
+}
+
+/* --------------------------------------------------------------- Aufruf */
+
+type Abrufergebnis = {
+  erreichbar: Pruefschritt;
+  ziel: Pruefschritt;
+};
+
+/**
+ * Der eigentliche Grund hinter einem `fetch failed`.
+ *
+ * Node verpackt Netzwerkfehler; die Meldung an der Oberfläche lautet sonst
+ * schlicht „fetch failed" und hilft niemandem weiter.
+ */
+function ursache(error: unknown): string | undefined {
+  const grund = (error as { cause?: unknown }).cause;
+  if (grund === null || grund === undefined) return undefined;
+  const objekt = grund as { code?: unknown; message?: unknown };
+  if (typeof objekt.code === "string") return objekt.code;
+  if (typeof objekt.message === "string") return objekt.message;
+  return undefined;
+}
+
+async function rufeAuf(
+  basis: string,
+  nonce: string,
+  secret: string,
+): Promise<Abrufergebnis> {
+  const start = Date.now();
+  try {
+    const antwort = await fetch(`${basis}/api/domain-check?nonce=${nonce}`, {
+      redirect: "follow",
+      cache: "no-store",
+      signal: AbortSignal.timeout(ZEITGRENZE_MS),
+      headers: { "User-Agent": `${APP_KENNUNG}-domain-check` },
+    });
+    const dauer = Date.now() - start;
+
+    if (!antwort.ok) {
+      return {
+        erreichbar: {
+          name: "erreichbar",
+          titel: "Erreichbar",
+          status: "fehler",
+          detail: `HTTP ${antwort.status} nach ${dauer} ms`,
+        },
+        ziel: {
+          name: "ziel",
+          titel: "Ziel",
+          status: "fehler",
+          detail:
+            antwort.status === 404
+              ? "Es antwortet zwar etwas, aber nicht diese Anwendung — der Proxy leitet woandershin."
+              : "Wegen der Fehlerantwort nicht feststellbar.",
+        },
+      };
+    }
+
+    const erreichbar: Pruefschritt = {
+      name: "erreichbar",
+      titel: "Erreichbar",
+      status: dauer > 3000 ? "warnung" : "ok",
+      detail: `HTTP ${antwort.status} nach ${dauer} ms`,
+    };
+
+    const koerper = (await antwort.json().catch(() => null)) as
+      | Partial<Domainbeweis>
+      | null;
+
+    if (
+      koerper === null ||
+      koerper.app !== APP_KENNUNG ||
+      typeof koerper.proof !== "string"
+    ) {
+      return {
+        erreichbar,
+        ziel: {
+          name: "ziel",
+          titel: "Ziel",
+          status: "fehler",
+          detail:
+            "Die Antwort stammt nicht von dieser Anwendung — hinter der Domain steht etwas anderes.",
+        },
+      };
+    }
+
+    return {
+      erreichbar,
+      ziel: gleich(koerper.proof, bildeBeweis(secret, nonce))
+        ? {
+            name: "ziel",
+            titel: "Ziel",
+            status: "ok",
+            detail: "diese Installation",
+          }
+        : {
+            name: "ziel",
+            titel: "Ziel",
+            status: "fehler",
+            detail:
+              "Es antwortet eine andere Installation dieser Anwendung, nicht diese hier.",
+          },
+    };
+  } catch (error) {
+    const code = (error as { code?: string; name?: string }).code;
+    const name = (error as { name?: string }).name;
+    const grund =
+      name === "TimeoutError"
+        ? `Keine Antwort binnen ${ZEITGRENZE_MS / 1000} Sekunden.`
+        : code === "ECONNREFUSED"
+          ? "Die Verbindung wurde abgelehnt — dort nimmt kein Webserver an."
+          : `Der Aufruf scheiterte (${code ?? ursache(error) ?? (error as Error).message}).`;
+
+    return {
+      erreichbar: {
+        name: "erreichbar",
+        titel: "Erreichbar",
+        status: "fehler",
+        detail: grund,
+      },
+      ziel: {
+        name: "ziel",
+        titel: "Ziel",
+        status: "fehler",
+        detail: "Ohne Antwort nicht feststellbar.",
+      },
+    };
+  }
+}
+
+/* ---------------------------------------------------------------- Ganzes */
+
+/**
+ * Prüft eine registrierte Domain von diesem Server aus.
+ *
+ * Der Hostname stammt aus der Datenbank, nicht aus der Anfrage — es lässt
+ * sich hierüber also keine beliebige Adresse abrufen.
+ */
+export async function pruefeDomain(hostname: string): Promise<Pruefbericht> {
+  const { host, port } = trenneHost(hostname);
+  const secret = await getCheckSecret();
+  const nonce = randomBytes(16).toString("hex");
+
+  const schritte: Pruefschritt[] = [];
+  const dns = await pruefeDns(host);
+  schritte.push(dns);
+
+  // Ohne aufgelösten Namen gibt es nichts anzurufen. Die Folgeschritte
+  // trotzdem zu versuchen brächte drei weitere Fehlermeldungen, die alle
+  // dasselbe sagen — und die eine, auf die es ankommt, ginge darin unter.
+  if (dns.status === "fehler") {
+    for (const [name, titel] of [
+      ["zertifikat", "Zertifikat"],
+      ["erreichbar", "Erreichbar"],
+      ["ziel", "Ziel"],
+    ] as [SchrittName, string][]) {
+      schritte.push({
+        name,
+        titel,
+        status: "uebersprungen",
+        detail: "Ohne aufgelösten Namen nicht prüfbar.",
+      });
+    }
+    return { hostname, geprueft: host, gesamt: "fehler", schritte };
+  }
+
+  // Ein Eintrag mit Port meint eine Adresse ohne Reverse Proxy — etwa die
+  // Standard-Domain aus BASE_URL im Entwicklungsbetrieb. Dort gibt es kein
+  // Zertifikat zu prüfen, und der Aufruf läuft über http.
+  let basis: string;
+  if (port !== null) {
+    schritte.push({
+      name: "zertifikat",
+      titel: "Zertifikat",
+      status: "uebersprungen",
+      detail: `Der Eintrag nennt Port ${port} — geprüft wird ohne HTTPS.`,
+    });
+    basis = `http://${host}:${port}`;
+  } else {
+    const lage = await pruefeZertifikat(host);
+    schritte.push(lage.schritt);
+    // Ohne HTTPS lohnt der zweite Anlauf über Port 80: So steht im Bericht,
+    // ob überhaupt etwas antwortet — das ist der Unterschied zwischen
+    // „Zertifikat fehlt" und „da ist gar nichts".
+    basis = lage.erreichbar ? `https://${host}` : `http://${host}`;
+  }
+
+  const { erreichbar, ziel } = await rufeAuf(basis, nonce, secret);
+  schritte.push(erreichbar, ziel);
+
+  const gesamt = schritte.some((s) => s.status === "fehler")
+    ? "fehler"
+    : schritte.some((s) => s.status === "warnung")
+      ? "warnung"
+      : "ok";
+
+  return { hostname, geprueft: basis, gesamt, schritte };
+}

src/lib/duplicates.ts

@@ -0,0 +1,61 @@
+import "server-only";
+
+import { toJsonInput } from "@/lib/codes";
+import { prisma } from "@/lib/db";
+
+/**
+ * Dublettenprüfung für statische Codes.
+ *
+ * Ein statischer Code trägt seinen Inhalt selbst — zweimal derselbe Inhalt
+ * ergibt zweimal exakt dasselbe Bild. Solche Einträge sind nicht falsch, aber
+ * sie fluten die Liste, und beim Wiederfinden weiß niemand mehr, welcher der
+ * beiden gemeint war.
+ *
+ * Bewusst **nur** für statische Codes: Zwei dynamische Codes mit demselben
+ * Ziel sind ein üblicher Fall — zwei Kampagnen, zwei Kurz-Links, getrennte
+ * Zähler. Da wäre eine Warnung nur lästig.
+ *
+ * Bewusst **ohne** die Gestaltung: Verglichen wird der Inhalt. Derselbe Inhalt
+ * einmal in Schwarz-Weiß für den Druck und einmal in Hausfarben ist zwar
+ * bewusst zweimal angelegt — aber eben auch zweimal derselbe Code. Die
+ * Warnung sagt das und lässt sich übergehen.
+ */
+export type StaticDuplicate = {
+  id: string;
+  label: string | null;
+  createdAt: string;
+};
+
+/**
+ * Sucht einen bereits abgelegten statischen Code mit gleichem Typ und
+ * gleichem Inhalt in derselben Gruppe — den zuletzt angelegten.
+ *
+ * Die Gruppe grenzt bewusst ein: Ein Treffer aus einer fremden Gruppe wäre
+ * nicht bloß nutzlos, er verriete auch deren Bestand.
+ */
+export async function findStaticDuplicate(
+  groupId: string,
+  type: string,
+  data: Record<string, unknown>,
+): Promise<StaticDuplicate | null> {
+  const treffer = await prisma.qrCode.findFirst({
+    where: {
+      mode: "static",
+      type,
+      groupId,
+      // Postgres vergleicht jsonb nach Struktur, nicht nach Schreibweise —
+      // Schlüsselreihenfolge und Leerzeichen spielen keine Rolle.
+      data: { equals: toJsonInput(data) },
+    },
+    orderBy: { createdAt: "desc" },
+    select: { id: true, label: true, createdAt: true },
+  });
+
+  if (!treffer) return null;
+
+  return {
+    id: treffer.id,
+    label: treffer.label,
+    createdAt: treffer.createdAt.toISOString(),
+  };
+}