Zum Inhalt springen
duxt

Layout und Komponenten

Das Layout, in dem eine getrennte Historie rendert, und die zwei MDC-Komponenten, aus denen ihre Seiten bestehen.

Der Typ changelog schreibt gewöhnliche Markdown-Seiten, deren Körper zwei MDC-Komponenten sind, gerendert in einem eigenen Layout. Alle drei sind dokumentiert, weil sie Teil der öffentlichen Oberfläche sind — ein Konsument kann jede davon ersetzen — und nicht, weil eine Seite von Hand geschrieben werden müsste.

Das Layout changelog

Gebunden nur an die Granularität split; ein flaches Changelog ist eine gewöhnliche Doku-Seite und rendert im Doku-Gerüst.

Es unterscheidet sich von docs in zwei Punkten, und beide folgen daraus, was die Seiten sind. Die Seitenleiste ist die Release-Liste statt eines Prosa-Baums — dieselbe Navigation, dieselbe Collection, weil eine generierte Sektion eine gewöhnliche Collection ist und ihre Seiten die Releases sind. Und die Lesespalte ist auf ein Maß begrenzt: Eine Release-Notiz ist Prosa, und über das ganze Fenster gesetzte Prosa ist unlesbar. Die Inhaltsspalte bleibt und listet die Gruppen.

Ersetze es durch eine eigene Datei am selben Pfad:

app/layouts/changelog.vue

ChangelogReleases

Die Zeitleiste der Übersicht: jedes Release, neueste zuerst, filterbar nach dem, was sich geändert hat. Auf die Indexseite der Sektion geschrieben.

PropTypAnmerkungen
releasesArrayJe mit version, date, to und seinen groups

Die groups eines Releases tragen nur einen name und einen count — die Einträge sind nicht hier, weil jedes Release eine eigene Seite hat und seine Punkte zu wiederholen die ganze Historie doppelt in den Suchindex, in llms-full.txt und in den Feed legen würde.

Die Filter-Chips werden aus den Namen gebaut, die die Datei selbst benutzt hat. Ist nichts ausgewählt, zeigt die Seite alles, und das ist auch, was der Server rendert: Ein Filter ist die Wahl eines Lesers, die Seite muss also vollständig sein, bevor jemand sie trifft — sonst bekommen der Crawler und der Leser, dessen Hydration noch nicht angekommen ist, je ein gefiltertes Changelog, um das niemand gebeten hat.

ChangelogGroup

Eine Gruppe eines Releases — „Features“, „Bug Fixes“, was die Datei eben sagte.

PropTypAnmerkungen
namestringDie eigene Überschrift der Datei, wörtlich
countnumberWie viele Einträge die Gruppe listet

Die Einträge kommen im Slot an, als das Markdown, als das sie geschrieben wurden — so indexiert die Suche sie, llms-full.txt trägt sie, und die Kopieren-Schaltfläche reicht einem Modell Prosa statt eines Komponentenaufrufs. Nur der Name und die Zahl, die das Abzeichen und die Filter als Daten brauchen, reisen als Props.

Die Farbe neben dem Namen ist ein Hinweis und nie eine Bedeutung: Ein Name, den die Hinweisliste nicht kennt, bekommt trotzdem eine eigene, stabile Farbe — und genau das macht dieselbe Art von Änderung über eine Seite mit vierzig Releases in jeder Sprache überfliegbar.

Eine davon ersetzen

Wie bei jeder anderen Komponente der Ebene: Eine Datei am selben Pfad in der konsumierenden Site gewinnt.

app/components/content/ChangelogGroup.vue

Die Props oben sind der Vertrag, und der Name des Layouts ebenso. Eine Umbenennung hier ist ein Breaking Change der Ebene.

Keine eigene Überschrift

Keine der beiden Komponenten beginnt mit einem <h1>. Das Doku-Gerüst zeichnet den Kopf — Brotkrumenpfad, Titel, die Kopieren-Schaltfläche daneben — für jede generierte Seite, deren Körper mit keiner Überschrift beginnt, und eine Release-Seite will genau das: einen Titel und eine Spur wie jede geschriebene Seite.

War diese Seite hilfreich?