fix storage

REFRESH-POOLS-BUTTON.md

@@ -0,0 +1,78 @@
+# Refresh Pools Button
+
+## Issue
+UI tidak update secara otomatis setelah create atau destroy pool. User meminta tombol refresh pools untuk manual refresh.
+
+## Solution
+Menambahkan tombol "Refresh Pools" yang melakukan refetch pools dari database, dan memperbaiki createPoolMutation untuk melakukan refetch dengan benar.
+
+## Changes Made
+
+### 1. Added Refresh Pools Button
+**File**: `frontend/src/pages/Storage.tsx` (line 446-459)
+
+Menambahkan tombol baru di antara "Rescan Disks" dan "Create Pool":
+```typescript
+<button
+  onClick={async () => {
+    await queryClient.invalidateQueries({ queryKey: ['storage', 'zfs', 'pools'] })
+    await queryClient.refetchQueries({ queryKey: ['storage', 'zfs', 'pools'] })
+  }}
+  disabled={poolsLoading}
+  className="flex items-center gap-2 px-4 py-2 rounded-lg border border-border-dark bg-card-dark text-white text-sm font-bold hover:bg-[#233648] transition-colors disabled:opacity-50"
+  title="Refresh pools list from database"
+>
+  <span className={`material-symbols-outlined text-[20px] ${poolsLoading ? 'animate-spin' : ''}`}>
+    sync
+  </span>
+  {poolsLoading ? 'Refreshing...' : 'Refresh Pools'}
+</button>
+```
+
+**Features:**
+- Icon `sync` dengan animasi spin saat loading
+- Disabled saat pools sedang loading
+- Tooltip: "Refresh pools list from database"
+- Styling konsisten dengan tombol lainnya
+
+### 2. Fixed createPoolMutation
+**File**: `frontend/src/pages/Storage.tsx` (line 219-239)
+
+Memperbaiki `createPoolMutation` untuk melakukan refetch dengan `await`:
+```typescript
+onSuccess: async () => {
+  // Invalidate and immediately refetch pools
+  await queryClient.invalidateQueries({ queryKey: ['storage', 'zfs', 'pools'] })
+  await queryClient.refetchQueries({ queryKey: ['storage', 'zfs', 'pools'] })
+  await queryClient.invalidateQueries({ queryKey: ['storage', 'disks'] })
+  // ... rest of the code
+  alert('Pool created successfully!')
+}
+```
+
+**Improvements:**
+- Menambahkan `await` pada `refetchQueries` untuk memastikan refetch selesai
+- Menambahkan success alert untuk feedback ke user
+
+## Button Layout
+Sekarang ada 3 tombol di header:
+1. **Rescan Disks** - Rescan physical disks dari sistem
+2. **Refresh Pools** - Refresh pools list dari database (NEW)
+3. **Create Pool** - Create new ZFS pool
+
+## Usage
+User dapat klik tombol "Refresh Pools" kapan saja untuk:
+- Manual refresh setelah create pool
+- Manual refresh setelah destroy pool
+- Manual refresh jika auto-refresh (3 detik) tidak cukup cepat
+
+## Testing
+1. Create pool → Klik "Refresh Pools" → Pool muncul
+2. Destroy pool → Klik "Refresh Pools" → Pool hilang
+3. Auto-refresh tetap berjalan setiap 3 detik
+
+## Status
+✅ **COMPLETED** - Tombol Refresh Pools ditambahkan dan createPoolMutation diperbaiki
+
+## Date
+2026-01-09