v0.57.0: stable host-storage list + per-app Tier-2 config panel

Part A of the UI-fixes/storage-spike spec.

A1: enrichHostStorageTargets sorts /api/host-metrics storage_targets
server-side and attaches friendly Hungarian labels + purpose, fixing the
#host-storage-bars reorder-on-poll bug. Display labels only — PVE storage
ids are never renamed.

A2: new GET/POST /stacks/{name}/backup Tier-2 config panel; the "2. mentés"
Beállítás button is repointed there from the dead-end deploy page. Customer
can pin a target drive or disable Tier 2; preference is preserved across the
runner's status writes. Always visible (single-SSD + non-HDD apps included).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

controller/internal/web/templates/backups.html

@@ -317,7 +317,12 @@
                 <!-- Tier 2: Cross-drive backup (opt-in, different device) -->
                 <div class="backup-layer-row">
                     <span class="tier-label">2. mentés</span>
-                    {{if and .Tier2Configured .Tier2DestDisconnected}}
+                    {{if .Tier2UserDisabled}}
+                        <span class="layer-unconfigured">2. mentés kikapcsolva</span>
+                        <div class="layer-actions">
+                            <a href="/stacks/{{.StackName}}/backup" class="btn btn-xs btn-outline">Beállítás</a>
+                        </div>
+                    {{else if and .Tier2Configured .Tier2DestDisconnected}}
                         <span class="layer-method" style="opacity:.6">rsync</span>
                         <span class="layer-dest" style="opacity:.6">→ {{.Tier2Dest}}</span>
                         <span class="badge badge-warn" style="font-size:.7rem">Cél meghajtó leválasztva</span>
@@ -326,7 +331,7 @@
                         {{end}}
                         <span class="tier-contents" style="opacity:.6">{{.BackupContents}}</span>
                         <div class="layer-actions">
-                            <a href="/stacks/{{.StackName}}/deploy" class="btn btn-xs btn-outline">Beállítás</a>
+                            <a href="/stacks/{{.StackName}}/backup" class="btn btn-xs btn-outline">Beállítás</a>
                         </div>
                     {{else if and .Tier2Configured .Tier2DestInactive}}
                         <span class="layer-method" style="opacity:.6">rsync</span>
@@ -337,7 +342,7 @@
                         {{end}}
                         <span class="tier-contents" style="opacity:.6">{{.BackupContents}}</span>
                         <div class="layer-actions">
-                            <a href="/stacks/{{.StackName}}/deploy" class="btn btn-xs btn-outline">Beállítás</a>
+                            <a href="/stacks/{{.StackName}}/backup" class="btn btn-xs btn-outline">Beállítás</a>
                         </div>
                     {{else if .Tier2Configured}}
                         <span class="layer-method">rsync</span>
@@ -354,7 +359,7 @@
                         <span class="tier-contents">{{.BackupContents}}</span>
                         <span class="tier-browsable" title="A mentés böngészhető fájlrendszerben">📁</span>
                         <div class="layer-actions">
-                            <a href="/stacks/{{.StackName}}/deploy" class="btn btn-xs btn-outline">Beállítás</a>
+                            <a href="/stacks/{{.StackName}}/backup" class="btn btn-xs btn-outline">Beállítás</a>
                         </div>
                     {{else}}
                         <span class="layer-auto-ok">✓ 1. mentés auto</span>
@@ -362,6 +367,9 @@
                         {{if .Tier2LastError}}
                         <span class="layer-reason" style="opacity:.85" title="A 2. mentés automatikus — külön beállítás nem kell">{{.Tier2LastError}}</span>
                         {{end}}
+                        <div class="layer-actions">
+                            <a href="/stacks/{{.StackName}}/backup" class="btn btn-xs btn-outline">Beállítás</a>
+                        </div>
                     {{end}}
                 </div>
                 <!-- Tier 3: Remote backup (future) -->

controller/internal/web/templates/monitoring.html

@@ -749,12 +749,17 @@
         } else {
             var html = '';
             targets.forEach(function(t) {
-                var label = escapeHtml(t.name || '') + (t.type ? ' (' + escapeHtml(t.type) + ')' : '');
+                // Friendly label (server-supplied) with the raw PVE storage id shown muted for clarity.
+                var friendly = escapeHtml(t.label || t.name || '');
+                var rawId = escapeHtml(t.name || '');
+                var idHtml = rawId ? ' <span style="color:var(--text-muted);font-size:.72rem">(' + rawId + ')</span>' : '';
+                var label = friendly + idHtml;
+                var purposeHtml = t.purpose ? '<div class="storage-purpose" style="font-size:.72rem;opacity:.65;margin-top:.2rem">' + escapeHtml(t.purpose) + '</div>' : '';
                 if (t.state && t.state !== 'attached') {
                     html += '<div class="storage-item storage-disconnected">' +
                         '<div class="storage-header"><span class="storage-label">' + label + '</span>' +
                         '<span class="storage-value badge-error" style="font-size:.75rem">Nem elérhető</span></div>' +
-                        '<div class="system-bar"><div class="system-bar-disconnected"></div></div></div>';
+                        '<div class="system-bar"><div class="system-bar-disconnected"></div></div>' + purposeHtml + '</div>';
                     return;
                 }
                 var pct = (t.used_fraction != null ? t.used_fraction * 100 : 0);
@@ -774,7 +779,7 @@
                     '<span class="storage-value">' + fmtBytesGB(t.used_bytes) + ' / ' + fmtBytesGB(t.total_bytes) +
                     ' (' + Math.round(pct) + '%)</span></div>' +
                     '<div class="system-bar"><div class="system-bar-fill ' + usageColorClass(pct) +
-                    '" style="width:' + Math.min(100, pct).toFixed(1) + '%"></div></div></div>';
+                    '" style="width:' + Math.min(100, pct).toFixed(1) + '%"></div></div>' + purposeHtml + '</div>';
             });
             bars.innerHTML = html;
         }

controller/internal/web/templates/tier2_config.html

@@ -0,0 +1,93 @@
+{{define "tier2_config"}}
+{{template "layout_start" .}}
+
+<div class="page-header">
+    <h2>2. mentés beállítása — {{.DisplayName}}</h2>
+    <a href="/backups" class="btn btn-outline btn-sm">← Vissza a mentésekhez</a>
+</div>
+
+{{if .Flash}}<div class="monitoring-banner monitoring-banner-green">{{.Flash}}</div>{{end}}
+{{if .FlashError}}<div class="monitoring-banner monitoring-banner-red">{{.FlashError}}</div>{{end}}
+
+<div class="monitor-card">
+{{with .Tier2}}
+    <p style="color:var(--text-muted);font-size:.9rem;margin-top:0">
+        A 2. mentés egy <strong>másik fizikai meghajtóra</strong> készít másolatot az alkalmazás
+        helyreállítási csomagjáról és adatairól. Ez az egyetlen off-drive védelem a böngészhető
+        felhasználói fájlokhoz (a teljes rendszermentés/PBS nem éri el ezeket).
+    </p>
+
+    {{if not .IsHDDApp}}
+    <div class="monitoring-banner monitoring-banner-yellow" style="margin-top:1rem">
+        Ennek az alkalmazásnak az adatai a belső rendszerlemezen vannak, amelyek
+        <strong>már szerepelnek a teljes rendszermentésben (PBS)</strong>. A 2. (off-drive) másolat
+        kiegészítő, és elsősorban a külső adatmeghajtón tárolt alkalmazásokhoz készül — ehhez az
+        alkalmazáshoz nincs külön teendő.
+    </div>
+    {{else}}
+    <h3 style="margin-top:1.5rem">Jelenlegi állapot</h3>
+    <div class="sysinfo-grid">
+        <div class="sysinfo-row">
+            <span class="sysinfo-label">2. mentés</span>
+            <span class="sysinfo-value">{{if .Disabled}}Kikapcsolva{{else}}Bekapcsolva{{end}}</span>
+        </div>
+        {{if .NoTarget}}
+        <div class="sysinfo-row">
+            <span class="sysinfo-label">Cél</span>
+            <span class="sysinfo-value text-error">Nincs elérhető off-drive cél</span>
+        </div>
+        <div class="sysinfo-row">
+            <span class="sysinfo-label">Megjegyzés</span>
+            <span class="sysinfo-value" style="color:var(--text-muted)">{{.NoTargetReason}}</span>
+        </div>
+        {{else}}
+        <div class="sysinfo-row">
+            <span class="sysinfo-label">Cél meghajtó</span>
+            <span class="sysinfo-value">{{.EffectiveLabel}}{{if .EffectiveIsSSD}} — csak DB/konfiguráció{{end}}</span>
+        </div>
+        <div class="sysinfo-row">
+            <span class="sysinfo-label">Kiválasztás módja</span>
+            <span class="sysinfo-value" style="color:var(--text-muted)">{{if .Preferred}}kézi választás{{else}}automatikus{{end}} — {{.EffectiveDesc}}</span>
+        </div>
+        {{end}}
+    </div>
+
+    {{if .EffectiveIsSSD}}
+    <div class="monitoring-banner monitoring-banner-yellow" style="margin-top:1rem">
+        Jelenleg csak a belső SSD érhető el 2. célként, ezért csak az adatbázis és a konfiguráció
+        másolódik. A belső rendszerlemez kicsi, ezért a nagy fájlok off-drive mentéséhez egy
+        <strong>2. adatmeghajtó</strong> szükséges (hogy a rendszerlemez ne teljen meg).
+    </div>
+    {{end}}
+
+    <form method="POST" action="/stacks/{{$.StackName}}/backup" style="margin-top:1.5rem">
+        {{$.CSRFField}}
+        <div class="form-group">
+            <label style="display:flex;align-items:center;gap:.5rem">
+                <input type="checkbox" name="enabled" value="on" {{if not .Disabled}}checked{{end}}>
+                2. mentés bekapcsolva
+            </label>
+        </div>
+        <div class="form-group">
+            <label for="target">Cél meghajtó</label>
+            <select id="target" name="target" class="form-control">
+                <option value="">Automatikus{{if not .NoTarget}} (jelenleg: {{.EffectiveLabel}}){{end}}</option>
+                {{range .Alternatives}}
+                <option value="{{.Path}}" {{if eq .Path $.Tier2.Preferred}}selected{{end}}>{{.Label}}</option>
+                {{end}}
+            </select>
+            {{if not .Alternatives}}
+            <div style="font-size:.8rem;color:var(--text-muted);margin-top:.4rem">
+                Nincs másik adatmeghajtó — automatikus cél a belső SSD (csak DB/konfiguráció). Egy 2.
+                adatmeghajtó hozzáadásával a teljes adat is off-drive menthető.
+            </div>
+            {{end}}
+        </div>
+        <button type="submit" class="btn btn-primary">Mentés</button>
+    </form>
+    {{end}}
+{{end}}
+</div>
+
+{{template "layout_end" .}}
+{{end}}