Refactor: +page.svelte (4.158 Z.) in Single-File-Komponenten zerlegen — Konvention: 1 Tab/Panel/Modal = 1 Datei #94
Loading…
Add table
Add a link
Reference in a new issue
No description provided.
Delete branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Ziel
frontend/src/routes/(app)/+page.svelte(4.158 Zeilen, 79 Funktionen, 6+ eingebettete Modals) entlang des bestehenden Tab-Musters zerlegen.Konvention (gilt ab jetzt projektweit)
1 Tab / Panel / Modal = 1
.svelte-Datei. Keine Mehrzweck-Dateien. Grund: einfacherer Support (Fehler → genau eine Datei), einfacheres Deploy/Review (kleine, isolierte Diffs), weniger Merge-Konflikte bei mehreren Contributors. Das Muster existiert bereits und funktioniert:admin-node-tabs/(11 Panels) undadmin-vm-modal/tabs/(16 Tabs).Zerlegungs-Liste (aus dem Ist-Stand der Datei)
Neues Verzeichnis z. B.
lib/components/dashboard/:NodeCard.svelte— Card-Header (klickbare Zeile,:1510) + Live-Graphs (:1577)NodeCardDetail.svelte— Expanded-Detail-Container (~:1597) mit:KernelUpdateBanner.svelte(~:1600)NodeUpdateStrip.svelte— Update-Strip + Bulk-Update-Einstieg (~:1608)NodeTempCharts.svelte— Temperatur-Mini-Charts (~:1775)ProvisionModal.svelte(~:1350)HostUpdateTerminalModal.svelte(~:2285)NodeSettingsModal.svelte(~:2297)NodeNotesModal.svelte(~:2348)InstallInfoModal.svelte(~:2373)BulkRunModal.svelte(openBulkRun/closeBulkRunModal/backgroundBulkRun, :51-82)+page.sveltebleibt Orchestrierung: Daten laden, State halten, Komponenten verdrahten.Vorgehen (kein Big-Bang!)
Akzeptanz
.svelte-Datei.+page.svelte< ~800 Zeilen (nur noch Orchestrierung).wiki/Development.mddokumentiert (Basis fuer spaeteres CONTRIBUTING.md).Bezug
Projekt-Struktur-Review 09.06.2026; OSS-Readiness (Contributor-Einstiegshuerde, PR-Konfliktrate). Gleiches gilt perspektivisch fuer
settings/+page.svelte(1.034 Z.) undNodeUpdatesPanel.svelte(1.167 Z.) — bei Bedarf Folge-Issues.Branch
refactor/dashboard-page-splitZwischenstand (verifiziert @ HEAD, 22.06.2026)
cc hat bereits einen grossen Teil sauber umgesetzt — Stand dokumentieren, damit klar ist, wo es weitergeht (es gab keinen Issue-Kommentar / keinen
#94-Commit, die Extraktion haengt an anderen Commits mit dran).Erledigt — 12 Komponenten unter
frontend/src/lib/components/dashboard/extrahiert, importiert, im Markup verdrahtet:ProvisionModal, NodeSettingsModal, NodeNotesModal, InstallInfoModal, HostUpdateLogModal, KernelCleanupModal, KernelUpdateBanner, NodeTempCharts, NodeUpdateStrip, QemuScanModal, VncModal, DeleteConfirmModal.
+page.svelte: 4.158 → 3.349 Zeilen. Sauber: Daten/Handler bleiben in der Page (Orchestrierung), Markup in den Komponenten.Noch offen — NodeCard ist der dickste verbleibende Block
+page.svelte:1389.node-card,:1432.node-headermit Aktionen-Menue, Status, klickbares Expand). Live-Graphs des Headers mit rein.{#each group.nodes as node}-Schleife (:1369) rendert dann nur noch<NodeCard ... />.+page.svelte< ~800 Zeilen (reine Orchestrierung: Daten laden, State, Verdrahtung).wiki/Development.mddokumentieren (steht noch aus).WICHTIG — Abgrenzung zu #123 (Reihenfolge: #94 ZUERST, dann #123)
bulkRunByNode/bulkRunningByNode:849-922,bulkRunApi:19/74/103) hier nur mitverschieben in NodeCard/NodeCardDetail, NICHT umbauen/reparieren — das Vereinheitlichen macht #123.NodeUpdateStripso lassen, dass #123 dort die gemeinsameBulkUpdateMode-Komponente sauber einhaengen kann.Regeln (wie gehabt)
$props— kein Page-State-Import, wo Props reichen.Abschluss
+page.svelte. Nicht automatisch schliessen (Maintainer-Review).NodeCard-Extraktion erledigt (verbleibender Rest von #94).
Commits (auf
main):572617drefactor(dashboard): extract NodeCardDetail (#94)29a215drefactor(dashboard): extract NodeCard (#94)48b7a4drefactor(dashboard): reduce loop to<NodeCard/>, drop dead styles/helpers (#94)Neue Komponenten unter
frontend/src/lib/components/dashboard/:NodeCard.svelte(556 Z.) — Container + Header + Banner (PVE-Upgrade, Agent-Update) + Aktionen-Menü + InlineHostGraphs.NodeCardDetail.svelte(876 Z.) — expandierter{#if isExp}-Bereich: Tabbar + alle Tab-Bodies (inkl. inline VMs/CTs-Tabelle und Info-Tab-Charts); hängt die bereits extrahierten Panels ein (KernelUpdateBanner, NodeUpdateStrip, NodeTempCharts, NodeUpdatesPanel, …).Ergebnis:
{#each group.nodes}rendert jetzt nur noch<NodeCard … />.+page.svelte: 3349 → 1809 Zeilen. Markup = reine Orchestrierung (~360 Z.); Rest = ~1207 Z. Action-Handler, die laut Vorgabe in+page.sveltebleiben und als Callbacks durchgereicht werden.svelte-check: 3 Errors → 3 Errors (alle vorbestehend, fremde Dateien); Warnings 433 → 236 (toter CSS entfernt).NodeUpdateStripwie zuvor verdrahtet.wiki/Development.mdum NodeCard/NodeCardDetail ergänzt.Bleibt offen für #123 (Bulk-Flow-Vereinheitlichung).
Verifiziert @
812b59f→ erfüllt, wird geschlossen.frontend/src/lib/components/dashboard/(inkl. NodeCard.svelte + NodeCardDetail.svelte).{#each group.nodes}(+page.svelte:1251) rendert nur noch<NodeCard/>.+page.svelte: 4.158 → 1.706 Zeilen (Rest = Orchestrierung; Ziel <800 nicht ganz erreicht, aber der God-Component ist aufgelöst).wiki/Development.mddokumentiert (## Konventionen, Z.24).Akzeptanzkriterien erfüllt.