ui: delete snapshots from the sidebar

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

Author: boxerab

crates/ui/frontend/src/App.svelte

@@ -7,7 +7,7 @@
   import {
     listNodes, listLinks, socketPath, onSwdEvent,
     createLink, deleteLink, loadLayout, saveLayout,
-    listSnapshots, saveSnapshot, restoreSnapshot, getMetrics,
+    listSnapshots, saveSnapshot, restoreSnapshot, deleteSnapshot, getMetrics,
   } from "./swd.js";
   import { layoutNodes } from "./layout.js";
   import MetricsNode from "./MetricsNode.svelte";
@@ -222,6 +222,16 @@
     }
   }
 
+  async function onDeleteSnapshot(name) {
+    try {
+      await deleteSnapshot(name);
+      await refreshSnapshots();
+      pushEvent({ kind: "SnapshotDeleted", data: { name } });
+    } catch (e) {
+      status = `snapshot delete failed: ${e}`;
+    }
+  }
+
   async function onRestoreSnapshot(name) {
     try {
       const { applied, skipped } = await restoreSnapshot(name);
@@ -409,6 +419,7 @@
             <li class="snap-row">
               <span class="snap-name">{s}</span>
               <button class="restore" onclick={() => onRestoreSnapshot(s)}>Restore</button>
+              <button class="del" title="delete snapshot" onclick={() => onDeleteSnapshot(s)}>✕</button>
             </li>
           {:else}
             <li class="muted">none saved</li>
@@ -514,6 +525,12 @@
   .snap-row .snap-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
   .snap-row .restore { background: transparent; color: var(--accent); border: 1px solid var(--border); }
   .snap-row .restore:hover { border-color: var(--accent); }
+  .snap-row .del {
+    flex-shrink: 0; background: transparent; color: var(--muted);
+    border: 1px solid var(--border); border-radius: 4px;
+    padding: 4px 7px; font-size: 11px; cursor: pointer;
+  }
+  .snap-row .del:hover { color: #ff8080; border-color: #ff8080; }
 
   /* Dark-theme overrides for Svelte Flow's default widgets. */
   :global(.svelte-flow__controls) {

crates/ui/frontend/src/swd.js

@@ -24,6 +24,7 @@ export const saveLayout = (positions) => invoke("save_layout", { positions });
 export const listSnapshots   = () => invoke("list_snapshots");
 export const saveSnapshot    = (name) => invoke("save_snapshot", { name });
 export const restoreSnapshot = (name) => invoke("restore_snapshot", { name });
+export const deleteSnapshot  = (name) => invoke("delete_snapshot", { name });
 
 // Per-node latency percentiles + xrun counts. Polled for the overlay.
 export const getMetrics = () => invoke("get_metrics");

crates/ui/src/main.rs

@@ -248,6 +248,21 @@ async fn restore_snapshot(
     }
 }
 
+#[tauri::command]
+async fn delete_snapshot(name: String) -> Result<(), String> {
+    // Snapshot names are plain file stems; reject anything that could
+    // escape the snapshots dir before touching the filesystem.
+    if name.is_empty() || name.contains(['/', '\\']) || name.contains("..") {
+        return Err("invalid snapshot name".into());
+    }
+    let path = data_dir().join("snapshots").join(format!("{name}.json"));
+    match std::fs::remove_file(&path) {
+        Ok(()) => Ok(()),
+        Err(e) if e.kind() == std::io::ErrorKind::NotFound => Ok(()),
+        Err(e) => Err(e.to_string()),
+    }
+}
+
 async fn run_event_pump(app: AppHandle) -> Result<()> {
     let path = default_socket_path();
     let mut rx = connect_subscriber(&path, None).await?;
@@ -312,7 +327,7 @@ fn main() {
         .invoke_handler(tauri::generate_handler![
             list_nodes, list_ports, list_links, socket_path,
             create_link, delete_link, load_layout, save_layout,
-            list_snapshots, save_snapshot, restore_snapshot, get_metrics,
+            list_snapshots, save_snapshot, restore_snapshot, delete_snapshot, get_metrics,
             read_config, write_config, apply_rules, apply_script,
         ])
         .run(tauri::generate_context!())