refine disk information page

web/templates/protection.html

@@ -317,6 +317,9 @@ async function loadSnapshots() {
             </div>
           </div>
           <div class="flex gap-2 ml-4">
+            <button onclick="restoreSnapshot('${snap.name}', '${snap.dataset}')" class="px-3 py-1.5 bg-blue-600 hover:bg-blue-700 text-white rounded text-sm">
+              Restore
+            </button>
             <button onclick="deleteSnapshot('${snap.name}')" class="px-3 py-1.5 bg-red-600 hover:bg-red-700 text-white rounded text-sm">
               Delete
             </button>
@@ -393,6 +396,48 @@ async function createSnapshot(e) {
   }
 }
 
+// Restore snapshot function - must be in global scope
+window.restoreSnapshot = async function(snapshotName, datasetName) {
+  const warning = `WARNING: This will rollback dataset "${datasetName}" to snapshot "${snapshotName}".\n\n` +
+    `This action will:\n` +
+    `- Discard all changes made after this snapshot\n` +
+    `- Cannot be undone\n\n` +
+    `Are you sure you want to continue?`;
+  
+  if (!confirm(warning)) return;
+  
+  try {
+    const res = await fetch(`/api/v1/snapshots/${encodeURIComponent(snapshotName)}/restore`, {
+      method: 'POST',
+      headers: getAuthHeaders(),
+      body: JSON.stringify({ force: false })
+    });
+    
+    if (res.ok) {
+      // Reload both snapshot lists
+      if (typeof loadSnapshots === 'function') loadSnapshots();
+      if (typeof loadVolumeSnapshots === 'function') loadVolumeSnapshots();
+      alert('Snapshot restored successfully');
+    } else {
+      const data = await res.json();
+      let errMsg = 'Failed to restore snapshot';
+      if (data) {
+        if (data.message) {
+          errMsg = data.message;
+          if (data.details) {
+            errMsg += ': ' + data.details;
+          }
+        } else if (data.error) {
+          errMsg = data.error;
+        }
+      }
+      alert(`Error: ${errMsg}`);
+    }
+  } catch (err) {
+    alert(`Error: ${err.message}`);
+  }
+};
+
 async function deleteSnapshot(name) {
   if (!confirm(`Are you sure you want to delete snapshot "${name}"?`)) return;
   
@@ -613,6 +658,9 @@ async function loadVolumeSnapshots() {
             </div>
           </div>
           <div class="flex gap-2 ml-4">
+            <button onclick="restoreSnapshot('${snap.name}', '${snap.dataset}')" class="px-3 py-1.5 bg-blue-600 hover:bg-blue-700 text-white rounded text-sm">
+              Restore
+            </button>
             <button onclick="deleteSnapshot('${snap.name}')" class="px-3 py-1.5 bg-red-600 hover:bg-red-700 text-white rounded text-sm">
               Delete
             </button>