From f88416880dde6f5d795dc562a87aa6419cbbf0e8 Mon Sep 17 00:00:00 2001
From: Nic-dorman <nbdorman@gmail.com>
Date: Wed, 22 Apr 2026 15:21:54 +0100
Subject: [PATCH 1/4] feat(upload): non-blocking dialog, concurrency queue,
 honest states

- Dialog is a thin view bound to FileEntry ids; Pinia store holds quote
  state so the dialog can be closed/reopened at any pre-payment stall
  without cancelling the underlying job. Row click on a pending entry
  reopens the dialog for that entry.
- New upload_concurrency setting (Settings -> Advanced, default 1, range
  1-8). Queued rows show "Queued: quoting" or "Queued: uploading" until
  a slot opens. Approve is gated on every entry being awaiting_approval
  and the button pluralises to "Approve N Uploads".
- Removed the bytes/MiB * 0.05 ANT cost heuristic and the size-derived
  payment-mode fallback. Both dialogs now show an explicit "Not
  connected" error with a Retry button instead of any fake value.
- Row status is connection-aware: "Connecting to network...", "Obtaining
  quote...", or "Network unavailable" instead of the ambiguous
  "Preparing upload...".
- Button row grouped by intent: [Close] [Cancel Upload] on the left,
  [Approve Upload] isolated on the right so a fat-finger on dismiss can
  no longer spend ANT.
- Pinia stores acceptHMRUpdate so getter changes don't require a full
  dev-server restart.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 components/StatusBadge.vue               |   6 +
 components/files/CostEstimateDialog.vue  |  77 ++++---
 components/files/UploadConfirmDialog.vue | 219 ++++++++++++-------
 pages/files.vue                          | 265 +++++++++++++----------
 pages/settings.vue                       |  32 ++-
 src-tauri/src/config.rs                  |  11 +
 stores/files.ts                          | 123 ++++++++++-
 stores/settings.ts                       |  24 +-
 utils/constants.ts                       |   2 -
 9 files changed, 526 insertions(+), 233 deletions(-)

diff --git a/components/StatusBadge.vue b/components/StatusBadge.vue
index 1bada8f..272b901 100644
--- a/components/StatusBadge.vue
+++ b/components/StatusBadge.vue
@@ -19,6 +19,12 @@ const statusMap: Record<string, { dot: string; label: string; color: string }> =
   // File transfer statuses
   Pending: { dot: '○', label: 'Pending', color: 'text-autonomi-muted' },
   Quoting: { dot: '◐', label: 'Quoting', color: 'text-autonomi-warning' },
+  'Queued: quoting': { dot: '○', label: 'Queued: quoting', color: 'text-autonomi-muted' },
+  'Queued: uploading': { dot: '○', label: 'Queued: uploading', color: 'text-autonomi-muted' },
+  'Connecting to network…': { dot: '◐', label: 'Connecting to network…', color: 'text-autonomi-warning' },
+  'Obtaining quote…': { dot: '◐', label: 'Obtaining quote…', color: 'text-autonomi-warning' },
+  'Network unavailable': { dot: '✖', label: 'Network unavailable', color: 'text-autonomi-error' },
+  'Ready to approve': { dot: '●', label: 'Ready to approve', color: 'text-autonomi-blue' },
   Paying: { dot: '◐', label: 'Paying', color: 'text-autonomi-warning' },
   Uploading: { dot: '●', label: 'Uploading', color: 'text-autonomi-blue' },
   Downloading: { dot: '●', label: 'Downloading', color: 'text-autonomi-blue' },
diff --git a/components/files/CostEstimateDialog.vue b/components/files/CostEstimateDialog.vue
index 57fe47c..dee741d 100644
--- a/components/files/CostEstimateDialog.vue
+++ b/components/files/CostEstimateDialog.vue
@@ -12,7 +12,11 @@
           <p class="text-sm text-autonomi-muted">Estimating cost...</p>
         </div>
 
-        <div v-else-if="files.length > 0" class="space-y-3">
+        <div v-else-if="files.length === 0" class="py-4 text-center text-sm text-autonomi-muted">
+          No files selected
+        </div>
+
+        <div v-else class="space-y-3">
           <div
             v-for="file in files"
             :key="file.name"
@@ -20,34 +24,53 @@
           >
             <span class="max-w-[200px] truncate">{{ file.name }}</span>
             <div class="text-right">
-              <span v-if="file.size" class="text-autonomi-muted">{{ file.size ? formatBytes(file.size) : '-' }}</span>
-              <span class="ml-2 text-autonomi-blue">
-                {{ file.cost ? file.cost : `~${estimateCost(file.size)} ANT` }}
-              </span>
+              <span v-if="file.size" class="text-autonomi-muted">{{ formatBytes(file.size) }}</span>
+              <span v-if="file.cost" class="ml-2 text-autonomi-blue">{{ file.cost }}</span>
+              <span v-else class="ml-2 text-autonomi-muted">—</span>
               <span v-if="file.gas_cost" class="ml-1 text-autonomi-muted">+ {{ file.gas_cost }} gas</span>
             </div>
           </div>
 
-          <div v-if="!hasRealCosts" class="border-t border-autonomi-border pt-3">
-            <div class="flex items-center justify-between text-sm font-medium">
-              <span>Total</span>
-              <div>
-                <span class="text-autonomi-muted">{{ totalSize ? formatBytes(totalSize) : '-' }}</span>
-                <span class="ml-2 text-autonomi-blue">~{{ estimateCost(totalSize) }} ANT</span>
+          <!-- Status line while (or after) quotes arrive. Connection-error is
+               checked first so a failed connect surfaces even if some files
+               happened to get quoted before the failure. -->
+          <div v-if="!allCostsReal" class="border-t border-autonomi-border pt-3">
+            <template v-if="connectionStore.hasFailed">
+              <div class="space-y-2">
+                <p class="text-sm text-yellow-500/80">
+                  Not connected to the Autonomi network — cost estimate unavailable.
+                </p>
+                <p v-if="failedReason" class="text-xs text-autonomi-muted break-words">
+                  {{ failedReason }}
+                </p>
+                <button
+                  type="button"
+                  class="rounded-md border border-autonomi-blue/40 px-2.5 py-1 text-xs font-medium text-autonomi-blue hover:bg-autonomi-blue/10"
+                  @click="connectionStore.retry()"
+                >
+                  Retry connection
+                </button>
               </div>
-            </div>
+            </template>
+            <template v-else-if="connectionStore.isConnecting">
+              <div class="flex items-center gap-2 text-sm text-autonomi-muted">
+                <div class="h-3 w-3 animate-spin rounded-full border-2 border-yellow-500 border-t-transparent" />
+                <span>Connecting to the Autonomi network…</span>
+              </div>
+            </template>
+            <template v-else>
+              <div class="flex items-center gap-2 text-sm text-autonomi-muted">
+                <div class="h-3 w-3 animate-spin rounded-full border-2 border-autonomi-blue border-t-transparent" />
+                <span>Obtaining quotes from network…</span>
+              </div>
+            </template>
           </div>
 
-          <p class="text-xs text-autonomi-muted">
-            {{ hasRealCosts ? 'Costs queried from the Autonomi network.' : 'Estimates are approximate and may vary based on network conditions.' }}
-            Gas fees (ETH) apply on top of storage costs.
+          <p v-if="allCostsReal" class="text-xs text-autonomi-muted">
+            Costs queried from the Autonomi network. Gas fees (ETH) apply on top of storage costs.
           </p>
         </div>
 
-        <div v-else class="py-4 text-center text-sm text-autonomi-muted">
-          No files selected
-        </div>
-
         <div class="mt-4 flex justify-end">
           <button
             class="rounded-md border border-autonomi-border px-3 py-1.5 text-sm text-autonomi-muted hover:text-autonomi-text"
@@ -63,6 +86,7 @@
 
 <script setup lang="ts">
 import { formatBytes } from '~/utils/formatters'
+import { useConnectionStore } from '~/stores/connection'
 
 const props = defineProps<{
   open: boolean
@@ -72,12 +96,11 @@ const props = defineProps<{
 
 defineEmits<{ close: [] }>()
 
-const totalSize = computed(() => props.files.reduce((sum, f) => sum + f.size, 0))
-const hasRealCosts = computed(() => props.files.some(f => f.cost))
-
-/** Rough client-side estimate — real cost is determined by network quotes during upload. */
-function estimateCost(bytes: number) {
-  return (bytes / 1_048_576 * 0.05).toFixed(4)
-}
-
+const connectionStore = useConnectionStore()
+const allCostsReal = computed(() =>
+  props.files.length > 0 && props.files.every(f => f.cost),
+)
+const failedReason = computed(() =>
+  connectionStore.current.status === 'failed' ? connectionStore.current.reason : null,
+)
 </script>
diff --git a/components/files/UploadConfirmDialog.vue b/components/files/UploadConfirmDialog.vue
index 1e3e7c5..0f6af8d 100644
--- a/components/files/UploadConfirmDialog.vue
+++ b/components/files/UploadConfirmDialog.vue
@@ -3,42 +3,51 @@
     <div
       v-if="open"
       class="fixed inset-0 z-50 flex items-center justify-center bg-black/50"
-      @click.self="$emit('cancel')"
+      @click.self="$emit('close')"
     >
       <div role="dialog" aria-modal="true" aria-labelledby="upload-confirm-title" class="w-[36rem] rounded-lg border border-autonomi-border bg-autonomi-dark p-6 shadow-xl">
-        <h2 id="upload-confirm-title" class="mb-4 text-lg font-medium">Confirm Upload</h2>
+        <h2 id="upload-confirm-title" class="mb-3 text-lg font-medium">Confirm Upload</h2>
 
-        <div v-if="loading" class="flex flex-col items-center py-8">
-          <p class="text-sm text-autonomi-muted">Estimating costs...</p>
+        <!-- Info banner: dialog is dismissible, job keeps running -->
+        <div class="mb-4 flex items-start gap-2 rounded-md border border-autonomi-blue/30 bg-autonomi-blue/5 px-3 py-2">
+          <svg class="mt-0.5 h-4 w-4 shrink-0 text-autonomi-blue" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.8">
+            <path stroke-linecap="round" stroke-linejoin="round" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+          </svg>
+          <p class="text-xs text-autonomi-muted">
+            You can close this window and come back when the quote is in. The upload stays pending until you approve or cancel it.
+          </p>
         </div>
 
-        <div v-else class="space-y-5">
+        <div class="space-y-5">
           <!-- File list -->
           <div class="max-h-32 space-y-1.5 overflow-y-auto">
             <div
-              v-for="file in files"
-              :key="file.name"
+              v-for="entry in entries"
+              :key="entry.id"
               class="flex items-center justify-between text-sm"
             >
-              <span class="max-w-[280px] truncate">{{ file.name }}</span>
-              <span class="text-autonomi-muted">{{ file.size ? formatBytes(file.size) : '-' }}</span>
+              <span class="max-w-[280px] truncate">{{ entry.name }}</span>
+              <span class="text-autonomi-muted">{{ entry.size_bytes ? formatBytes(entry.size_bytes) : '-' }}</span>
             </div>
           </div>
 
-          <!-- Payment mode -->
-          <div class="flex items-baseline justify-between">
+          <!-- Payment mode — only shown once the network has quoted the files.
+               Never guessed from chunk count: that was a fallback lie. -->
+          <div v-if="effectivePaymentMode" class="flex items-baseline justify-between">
             <span class="text-sm text-autonomi-muted">Payment</span>
             <div class="text-right">
               <span class="text-sm font-medium">{{ effectivePaymentMode === 'merkle' ? 'Merkle tree' : 'Regular' }}</span>
               <p class="text-xs text-autonomi-muted">
                 {{ effectivePaymentMode === 'merkle'
-                  ? `Single transaction for ${estimatedChunks} chunks — lower gas.`
-                  : `Per-batch payment for ${estimatedChunks} chunk${estimatedChunks !== 1 ? 's' : ''}.` }}
+                  ? `Single transaction for ${quotedChunks} chunks — lower gas.`
+                  : `Per-batch payment for ${quotedChunks} chunk${quotedChunks !== 1 ? 's' : ''}.` }}
               </p>
             </div>
           </div>
 
-          <!-- Cost breakdown -->
+          <!-- Cost breakdown. Connection-error takes priority over any in-flight
+               quote spinner so users aren't left watching a spinner that will
+               never resolve. No heuristic / placeholder values. -->
           <div class="rounded-md border border-autonomi-border bg-autonomi-surface/50 p-3 space-y-2">
             <template v-if="quotedCost">
               <div class="flex items-center justify-between text-sm font-medium">
@@ -47,25 +56,13 @@
               </div>
               <div class="flex items-center justify-between text-xs text-autonomi-muted">
                 <span>Estimated gas</span>
-                <span>{{ quotedGas ?? 'Estimating...' }}</span>
-              </div>
-            </template>
-            <template v-else-if="quoting">
-              <div class="flex items-center gap-2 text-sm text-autonomi-muted">
-                <div class="h-3 w-3 animate-spin rounded-full border-2 border-autonomi-blue border-t-transparent" />
-                <span>Getting cost quote from network...</span>
-              </div>
-            </template>
-            <template v-else-if="connectionStore.isConnecting">
-              <div class="flex items-center gap-2 text-sm text-autonomi-muted">
-                <div class="h-3 w-3 animate-spin rounded-full border-2 border-yellow-500 border-t-transparent" />
-                <span>Connecting to the Autonomi network...</span>
+                <span>{{ quotedGas ?? '—' }}</span>
               </div>
             </template>
             <template v-else-if="connectionStore.hasFailed">
               <div class="space-y-2">
                 <div class="text-sm text-yellow-500/80">
-                  Could not connect to the Autonomi network.
+                  Not connected to the Autonomi network — cost estimate unavailable.
                 </div>
                 <div v-if="failedReason" class="text-xs text-autonomi-muted break-words">
                   {{ failedReason }}
@@ -75,14 +72,20 @@
                   class="rounded-md border border-autonomi-blue/40 px-2.5 py-1 text-xs font-medium text-autonomi-blue hover:bg-autonomi-blue/10"
                   @click="connectionStore.retry()"
                 >
-                  Retry
+                  Retry connection
                 </button>
               </div>
             </template>
-            <template v-else>
+            <template v-else-if="connectionStore.isConnecting">
+              <div class="flex items-center gap-2 text-sm text-autonomi-muted">
+                <div class="h-3 w-3 animate-spin rounded-full border-2 border-yellow-500 border-t-transparent" />
+                <span>Connecting to the Autonomi network…</span>
+              </div>
+            </template>
+            <template v-else-if="anyQuoting">
               <div class="flex items-center gap-2 text-sm text-autonomi-muted">
                 <div class="h-3 w-3 animate-spin rounded-full border-2 border-autonomi-blue border-t-transparent" />
-                <span>Estimating cost...</span>
+                <span>Obtaining quote from network…</span>
               </div>
             </template>
           </div>
@@ -137,19 +140,39 @@
             Estimated from a single network quote — final cost may vary slightly. Gas fees apply on top.
           </p>
 
-          <div class="flex justify-end gap-2">
-            <button
-              class="rounded-md border border-autonomi-border px-3 py-1.5 text-sm text-autonomi-muted hover:text-autonomi-text"
-              @click="$emit('cancel')"
-            >
-              Cancel
-            </button>
-            <button
-              class="rounded-md bg-autonomi-blue px-3 py-1.5 text-sm font-medium text-white hover:opacity-90"
-              @click="handleConfirm"
-            >
-              Upload {{ files.length }} file{{ files.length !== 1 ? 's' : '' }}
-            </button>
+          <!-- Buttons grouped by intent: both "back out" actions on the left,
+               the money-spending Approve isolated on the right so no
+               fat-finger can land on it from a dismiss attempt. -->
+          <div class="flex items-center justify-between gap-2">
+            <div class="flex gap-2">
+              <button
+                class="rounded-md border border-autonomi-border px-3 py-1.5 text-sm text-autonomi-muted hover:text-autonomi-text"
+                @click="$emit('close')"
+              >
+                Close
+              </button>
+              <button
+                class="rounded-md border border-red-500/40 px-3 py-1.5 text-sm text-red-400 hover:bg-red-500/10"
+                @click="$emit('cancelUpload')"
+              >
+                Cancel Upload
+              </button>
+            </div>
+            <div class="flex items-center gap-2">
+              <span
+                v-if="!canApprove && entries.length > 1"
+                class="text-xs text-autonomi-muted"
+              >
+                Ready: {{ readyCount }} of {{ entries.length }}
+              </span>
+              <button
+                class="rounded-md bg-autonomi-blue px-3 py-1.5 text-sm font-medium text-white hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-50"
+                :disabled="!canApprove"
+                @click="handleApprove"
+              >
+                {{ approveButtonLabel }}
+              </button>
+            </div>
           </div>
         </div>
       </div>
@@ -159,46 +182,89 @@
 
 <script setup lang="ts">
 import { formatBytes } from '~/utils/formatters'
-import { MERKLE_THRESHOLD, AVG_CHUNK_SIZE } from '~/utils/constants'
 import { useConnectionStore } from '~/stores/connection'
+import { useFilesStore, type FileEntry } from '~/stores/files'
+import { formatNanoTokens, formatGasCost } from '~/utils/payment'
 
 const props = defineProps<{
   open: boolean
-  files: { name: string; size: number; path: string }[]
-  loading: boolean
-  /** Real cost from network quote (e.g. "0.0234 ANT" or "Determined on-chain") */
-  quotedCost?: string | null
-  /** Estimated gas cost (e.g. "0.000142 ETH") */
-  quotedGas?: string | null
-  /** Whether a network quote is in progress */
-  quoting?: boolean
-  /** Payment mode selected by the backend (null if no quote yet) */
-  quotedPaymentMode?: 'wave-batch' | 'merkle' | null
-  /**
-   * Kept for backward compatibility with the parent — the dialog now reads
-   * the connection state directly from useConnectionStore() so it can show
-   * a Retry button when the connect fails.
-   */
-  networkConnected?: boolean
+  /** IDs of FileEntry rows this dialog is bound to. Dialog is a thin view —
+   *  all quote/estimate state lives on the entries themselves. */
+  fileIds: number[]
 }>()
 
 const emit = defineEmits<{
-  confirm: [options: { visibility: 'private' | 'public'; paymentMode: 'regular' | 'merkle' }]
-  cancel: []
+  approve: [options: { visibility: 'private' | 'public'; paymentMode: 'regular' | 'merkle' }]
+  cancelUpload: []
+  close: []
 }>()
 
+const filesStore = useFilesStore()
 const connectionStore = useConnectionStore()
 
-const visibility = ref<'private' | 'public'>('private')
+const entries = computed<FileEntry[]>(() =>
+  props.fileIds
+    .map(id => filesStore.findById(id))
+    .filter((e): e is FileEntry => e !== undefined),
+)
 
-const totalSize = computed(() => props.files.reduce((sum, f) => sum + f.size, 0))
-const estimatedChunks = computed(() => Math.max(1, Math.ceil(totalSize.value / AVG_CHUNK_SIZE)))
+const allEstimated = computed(() =>
+  entries.value.length > 0 && entries.value.every(e => e.estimate),
+)
+const anyQuoting = computed(() =>
+  entries.value.some(e => e.status === 'quoting' || e.status === 'queued_for_quote'),
+)
+const readyCount = computed(() =>
+  entries.value.filter(e => e.status === 'awaiting_approval').length,
+)
+/** Approve is gated on every entry being `awaiting_approval`. Partial
+ *  approve would leave some files silently queued and invite mis-clicks;
+ *  block until the whole batch is ready. */
+const canApprove = computed(() =>
+  entries.value.length > 0 && readyCount.value === entries.value.length,
+)
 
-/** Payment mode — determined by backend quote, or estimated from file size */
-const effectivePaymentMode = computed(() => {
-  if (props.quotedPaymentMode === 'merkle') return 'merkle'
-  if (props.quotedPaymentMode === 'wave-batch') return 'regular'
-  return estimatedChunks.value >= MERKLE_THRESHOLD ? 'merkle' : 'regular'
+/** Sum of estimate costs across entries. Null unless every entry has a real
+ *  estimate — partial or fake totals would mislead the user. */
+const quotedCost = computed<string | null>(() => {
+  if (!allEstimated.value) return null
+  const totalAtto = entries.value.reduce(
+    (sum, e) => sum + BigInt(e.estimate!.storage_cost_atto), 0n,
+  )
+  return formatNanoTokens(totalAtto.toString())
+})
+
+const quotedGas = computed<string | null>(() => {
+  if (!allEstimated.value) return null
+  const totalGas = entries.value.reduce(
+    (sum, e) => sum + BigInt(e.estimate!.estimated_gas_cost_wei), 0n,
+  )
+  return formatGasCost(totalGas.toString())
+})
+
+/** Real chunk count from the network estimates. Null until all entries have
+ *  been quoted — no client-side size-based fallback. */
+const quotedChunks = computed<number | null>(() => {
+  if (!allEstimated.value) return null
+  return entries.value.reduce((sum, e) => sum + e.estimate!.chunk_count, 0)
+})
+
+/** Payment mode is reported by the network — we do not guess it from size.
+ *  Null until all entries are quoted, so the template can hide the Payment
+ *  row entirely instead of showing a misleading prediction. */
+const effectivePaymentMode = computed<'regular' | 'merkle' | null>(() => {
+  if (!allEstimated.value) return null
+  const modes = entries.value.map(e => e.paymentMode).filter(Boolean) as ('regular' | 'merkle')[]
+  if (modes.length !== entries.value.length) return null
+  return modes.includes('merkle') ? 'merkle' : 'regular'
+})
+
+const visibility = ref<'private' | 'public'>('private')
+
+const approveButtonLabel = computed(() => {
+  const n = entries.value.length
+  if (n <= 1) return 'Approve Upload'
+  return `Approve ${n} Uploads`
 })
 
 const failedReason = computed(() =>
@@ -214,11 +280,14 @@ watch(
   },
 )
 
-function handleConfirm() {
-  emit('confirm', {
+function handleApprove() {
+  if (!canApprove.value) return
+  // Fall back to 'regular' when the estimate failed — backend redetermines
+  // the real payment mode from the live quote's chunk count anyway, so the
+  // frontend's guess is only used for status display during paying.
+  emit('approve', {
     visibility: visibility.value,
-    paymentMode: effectivePaymentMode.value,
+    paymentMode: effectivePaymentMode.value ?? 'regular',
   })
 }
-
 </script>
diff --git a/pages/files.vue b/pages/files.vue
index 36b39e8..1b87404 100644
--- a/pages/files.vue
+++ b/pages/files.vue
@@ -11,29 +11,26 @@
         </button>
         <button
           class="rounded-md border border-autonomi-border px-3 py-1.5 text-sm text-autonomi-muted hover:text-autonomi-text"
-          @click="showDownloadDialog = true"
+          @click="estimateCost"
         >
-          Download by Address
+          Estimate Cost
         </button>
+      </div>
+
+      <div class="flex items-center gap-2">
         <button
           class="rounded-md border border-autonomi-border px-3 py-1.5 text-sm text-autonomi-muted hover:text-autonomi-text"
-          @click="openDownloadByDatamap"
+          @click="showDownloadDialog = true"
         >
-          Download by Datamap
+          Download by Address
         </button>
         <button
           class="rounded-md border border-autonomi-border px-3 py-1.5 text-sm text-autonomi-muted hover:text-autonomi-text"
-          @click="estimateCost"
+          @click="openDownloadByDatamap"
         >
-          Estimate Cost
+          Download by Datamap
         </button>
       </div>
-
-      <div class="flex items-center gap-3">
-        <span v-if="filesStore.files.length" class="text-xs text-autonomi-muted">
-          {{ filesStore.files.length }} file{{ filesStore.files.length !== 1 ? 's' : '' }}
-        </span>
-      </div>
     </div>
 
     <!-- Uploads table + drop zone -->
@@ -109,6 +106,7 @@
                 :key="file.id"
                 class="transition-colors"
                 :class="rowClass(file)"
+                @click="onRowClick(file)"
               >
                 <td class="px-4 py-2.5">{{ file.name }}</td>
                 <td class="px-4 py-2.5 text-autonomi-muted">{{ file.size_bytes ? formatBytes(file.size_bytes) : '-' }}</td>
@@ -230,15 +228,10 @@
 
     <FilesUploadConfirmDialog
       :open="showUploadConfirm"
-      :files="pendingUploadFiles"
-      :loading="uploadEstimating"
-      :quoted-cost="quotedCostDisplay"
-      :quoted-gas="quotedGasEstimate"
-      :quoting="isQuoting"
-      :quoted-payment-mode="quotedPaymentMode"
-      :network-connected="autonomiConnected"
-      @confirm="confirmUpload"
-      @cancel="cancelUpload"
+      :file-ids="selectedFileIds"
+      @approve="approveUpload"
+      @cancel-upload="cancelPendingUploads"
+      @close="closeUploadDialog"
     />
 
     <FilesCostEstimateDialog
@@ -255,7 +248,7 @@ import { invoke } from '@tauri-apps/api/core'
 import { getCurrentWebview } from '@tauri-apps/api/webview'
 import { open as openFileDialog } from '@tauri-apps/plugin-dialog'
 import { revealItemInDir } from '@tauri-apps/plugin-opener'
-import { useFilesStore, type FileEntry, type UploadCostEstimate } from '~/stores/files'
+import { useFilesStore, type FileEntry } from '~/stores/files'
 import { formatBytes, truncateAddress } from '~/utils/formatters'
 import { formatNanoTokens, formatGasCost } from '~/utils/payment'
 import { useSettingsStore } from '~/stores/settings'
@@ -382,19 +375,40 @@ function statusLabel(file: FileEntry): string {
   if (file.status === 'downloaded') return 'Downloaded'
   if (file.status === 'failed') return file.error ? `Failed: ${file.error}` : 'Failed'
   if (file.status === 'complete') return 'Complete'
-  if (file.status === 'quoting') return 'Preparing upload…'
+  if (file.status === 'queued_for_quote') return 'Queued: quoting'
+  if (file.status === 'queued_for_upload') return 'Queued: uploading'
+  if (file.status === 'quoting') {
+    if (connectionStore.hasFailed) return 'Network unavailable'
+    if (!connectionStore.isConnected) return 'Connecting to network…'
+    return 'Obtaining quote…'
+  }
+  if (file.status === 'awaiting_approval') return 'Ready to approve'
   if (file.status === 'paying') return 'Paying'
   return file.status
 }
 
+function isReopenable(file: FileEntry): boolean {
+  if (file.kind !== 'upload') return false
+  return (
+    file.status === 'queued_for_quote'
+    || file.status === 'quoting'
+    || file.status === 'awaiting_approval'
+    || file.status === 'queued_for_upload'
+  )
+}
 
 function rowClass(file: FileEntry): string {
   if (file.status === 'downloaded') return 'hover:bg-autonomi-surface/50 cursor-pointer bg-autonomi-blue/5'
+  if (isReopenable(file)) return 'hover:bg-autonomi-surface/50 cursor-pointer'
   if (file.status === 'failed') return 'hover:bg-autonomi-surface/50 opacity-60'
   return 'hover:bg-autonomi-surface/50'
 }
 
 function onRowClick(file: FileEntry) {
+  if (isReopenable(file)) {
+    reopenUploadDialog(file.id)
+    return
+  }
   if (file.status === 'downloaded' && file.dest_path) {
     openFolder(file.dest_path)
     filesStore.acknowledgeDownload(file.id)
@@ -423,15 +437,14 @@ async function setupDragDrop() {
 }
 
 // ── Upload flow ──
+//
+// The dialog is a thin view bound to FileEntry ids. Quote state lives on the
+// entries themselves (stores/files.ts), which means the dialog can be closed
+// and reopened mid-flight without losing anything. Row click on a pending
+// entry in the uploads table reopens the dialog for that entry.
 
 const showUploadConfirm = ref(false)
-const uploadEstimating = ref(false)
-const pendingUploadFiles = ref<{ name: string; size: number; path: string }[]>([])
-const pendingMetas = ref<FileMeta[]>([])
-const isQuoting = ref(false)
-const quotedCostDisplay = ref<string | null>(null)
-const quotedGasEstimate = ref<string | null>(null)
-const quotedPaymentMode = ref<'wave-batch' | 'merkle' | null>(null)
+const selectedFileIds = ref<number[]>([])
 
 async function getFileMetas(paths: string[]): Promise<FileMeta[]> {
   try {
@@ -461,111 +474,129 @@ async function uploadFiles() {
 }
 
 async function showUploadConfirmForPaths(paths: string[]) {
-  uploadEstimating.value = true
-  pendingUploadFiles.value = []
-  pendingMetas.value = []
-  quotedCostDisplay.value = null
-  quotedGasEstimate.value = null
-  quotedPaymentMode.value = null
+  // Entries enter `queued_for_quote`; the scheduler promotes them to
+  // `quoting` as concurrency slots open. Dialog renders off the entries,
+  // so rows appear immediately and reactively update as the scheduler
+  // works through them.
+  const metas = await getFileMetas(paths)
+  const ids = metas.map(m => filesStore.addUpload(m.name, m.path, m.size))
+  selectedFileIds.value = ids
   showUploadConfirm.value = true
 
-  const metas = await getFileMetas(paths)
-  pendingMetas.value = metas
-  pendingUploadFiles.value = metas.map(m => ({
-    name: m.name,
-    size: m.size,
-    path: m.path,
-  }))
-  uploadEstimating.value = false
-
-  // Start real quoting in background (only when connected to network).
-  // The watcher below picks up the case where connection completes after the
-  // dialog is already open.
-  if ((autonomiConnected.value || settingsStore.devnetActive) && !settingsStore.indelibleConnected) {
-    startQuoting(metas)
+  // Indelible bypass: the remote gateway handles pricing, so skip the
+  // quote phase entirely — entries jump straight to `awaiting_approval`.
+  if (settingsStore.indelibleConnected && !settingsStore.devnetActive) {
+    for (const id of ids) filesStore.updateEntry(id, { status: 'awaiting_approval' })
+    return
   }
-}
 
-// If the embedded ant-core client connects (or finishes retrying) while the
-// upload dialog is open and we don't yet have a quote, kick off quoting now.
-// Without this, opening the dialog before the network is ready leaves the
-// dialog stuck on the misleading "Cost will be quoted from the network when
-// upload starts" fallback even after the connection succeeds.
-watch(
-  () => autonomiConnected.value,
-  (connected) => {
-    if (!connected) return
-    if (!showUploadConfirm.value) return
-    if (settingsStore.indelibleConnected) return
-    if (isQuoting.value) return
-    if (quotedCostDisplay.value) return
-    if (pendingMetas.value.length === 0) return
-    startQuoting(pendingMetas.value)
-  },
-)
+  kickScheduler()
+}
 
-async function startQuoting(metas: FileMeta[]) {
-  isQuoting.value = true
-  try {
-    // Use the light-weight `estimate_file_cost` path: encrypts locally, samples
-    // one quote per file, no chunks parked. Confirm click runs the real
-    // `start_upload` (which does park). Each estimate is independent, so
-    // parallelize — cuts dialog-open latency for multi-file uploads.
-    const estimates = await Promise.all(
-      metas.map(meta => filesStore.estimateFileCost(meta.path)),
-    )
-    const valid = estimates.filter((e): e is UploadCostEstimate => e !== null)
-
-    if (valid.length > 0) {
-      // ant-core PaymentMode 'single' maps to the frontend's 'wave-batch'.
-      const mode = valid[0].payment_mode === 'merkle' ? 'merkle' : 'wave-batch'
-      quotedPaymentMode.value = mode
-
-      const totalStorageAtto = valid.reduce(
-        (sum, e) => sum + BigInt(e.storage_cost_atto), 0n,
-      )
-      quotedCostDisplay.value = formatNanoTokens(totalStorageAtto.toString())
-
-      const totalGasWei = valid.reduce(
-        (sum, e) => sum + BigInt(e.estimated_gas_cost_wei), 0n,
-      )
-      quotedGasEstimate.value = formatGasCost(totalGasWei.toString())
-    }
-  } catch {
-    // Estimate failed — user can still proceed (real quote runs at upload time).
-  } finally {
-    isQuoting.value = false
-  }
+// Reopen the confirm dialog for an entry the user clicked in the uploads
+// table. Supports the four pre-payment stalls; `paying`/`uploading` rows
+// stay non-clickable (nothing actionable there).
+function reopenUploadDialog(id: number) {
+  selectedFileIds.value = [id]
+  showUploadConfirm.value = true
 }
 
-function confirmUpload(options: { visibility: 'private' | 'public'; paymentMode: 'regular' | 'merkle' }) {
+function approveUpload(options: { visibility: 'private' | 'public'; paymentMode: 'regular' | 'merkle' }) {
   showUploadConfirm.value = false
-  const wagmiConfig = getWagmiConfig()
+  const ids = selectedFileIds.value.slice()
+  selectedFileIds.value = []
 
-  for (const file of pendingUploadFiles.value) {
-    const id = filesStore.addUpload(file.name, file.path, file.size)
+  for (const id of ids) {
+    const entry = filesStore.findById(id)
+    if (!entry || entry.status !== 'awaiting_approval') continue
+
+    filesStore.updateEntry(id, { visibility: options.visibility })
 
     if (settingsStore.indelibleConnected && !settingsStore.devnetActive) {
       filesStore.startIndelibleUpload(id)
-    } else if ((autonomiConnected.value || settingsStore.devnetActive) && wagmiConfig) {
-      // No preQuote handoff: the dialog showed a light estimate (no chunks
-      // parked). `startRealUpload` fetches a fresh real quote via
-      // `start_upload`, which is what parks chunks — only on confirm.
-      filesStore.startRealUpload(id, wagmiConfig, options)
     } else {
-      filesStore.updateEntry(id, { status: 'failed', error: 'Not connected to network or wallet' })
-      toastStore.add('Upload requires network connection and wallet', 'warning')
+      // Autonomi path — queue for the scheduler to dispatch.
+      filesStore.enqueueForUpload(id)
+    }
+  }
+  kickScheduler()
+}
+
+// ── Upload concurrency scheduler ──
+//
+// Single budget `settingsStore.uploadConcurrency` covers both quoting and
+// uploading (they both hit the network; Autonomi throughput degrades non-
+// linearly so serial-by-default is the safe choice).
+//
+// Priority: promote `queued_for_quote` first so the dialog can enable the
+// Approve button ASAP; then drain `queued_for_upload` post-approval. Offline
+// → skip all promotions (entries stay queued and resume when the watcher
+// sees `autonomiConnected` flip).
+function kickScheduler() {
+  if (settingsStore.indelibleConnected && !settingsStore.devnetActive) return
+  const online = autonomiConnected.value || settingsStore.devnetActive
+  if (!online) return
+
+  const budget = settingsStore.uploadConcurrency
+
+  while (true) {
+    const active = filesStore.quotingCount + filesStore.uploadingCount
+    if (active >= budget) break
+
+    const quoteHead = filesStore.queuedForQuote[0]
+    if (quoteHead) {
+      // beginQuoting synchronously flips status to `quoting`, then awaits
+      // the estimate; we count the slot from the status change.
+      filesStore.beginQuoting(quoteHead.id)
+      continue
+    }
+
+    const uploadHead = filesStore.queuedForUpload[0]
+    if (!uploadHead) break
+
+    const wagmiConfig = getWagmiConfig()
+    if (!wagmiConfig) {
+      filesStore.updateEntry(uploadHead.id, {
+        status: 'failed',
+        error: 'Wallet not connected',
+      })
+      toastStore.add('Upload requires a wallet', 'warning')
+      continue
+    }
+
+    const opts = {
+      visibility: uploadHead.visibility ?? 'private' as const,
+      paymentMode: uploadHead.paymentMode ?? 'regular' as const,
     }
+    filesStore.startRealUpload(uploadHead.id, wagmiConfig, opts)
   }
-  pendingUploadFiles.value = []
-  quotedCostDisplay.value = null
 }
 
-function cancelUpload() {
+// React whenever any of the scheduler's inputs change: the budget, the
+// active counts (slots freed), the queue lengths (new work enqueued), or
+// the connection state flipping to online.
+watch(
+  () => [
+    settingsStore.uploadConcurrency,
+    filesStore.quotingCount,
+    filesStore.uploadingCount,
+    filesStore.queuedForQuote.length,
+    filesStore.queuedForUpload.length,
+    autonomiConnected.value,
+    settingsStore.devnetActive,
+  ],
+  () => { kickScheduler() },
+)
+
+function cancelPendingUploads() {
+  for (const id of selectedFileIds.value) filesStore.cancelPendingUpload(id)
+  selectedFileIds.value = []
+  showUploadConfirm.value = false
+}
+
+function closeUploadDialog() {
   showUploadConfirm.value = false
-  pendingUploadFiles.value = []
-  quotedCostDisplay.value = null
-  isQuoting.value = false
+  selectedFileIds.value = []
 }
 
 // ── Download flow ──
diff --git a/pages/settings.vue b/pages/settings.vue
index 3724f82..5bc8e41 100644
--- a/pages/settings.vue
+++ b/pages/settings.vue
@@ -118,6 +118,30 @@
       </button>
       <div v-if="showAdvanced" class="mt-2 space-y-4">
 
+        <!-- Upload concurrency -->
+        <div class="rounded-lg border border-autonomi-border p-4">
+          <div class="flex items-center justify-between gap-3">
+            <div class="min-w-0 flex-1">
+              <h3 class="text-sm font-medium">Upload concurrency</h3>
+              <p class="mt-1 text-xs text-autonomi-muted">
+                This controls how many quotes/uploads can be running at the same time.
+              </p>
+              <p class="mt-1 text-xs text-autonomi-muted">
+                Note that this has a very large impact on performance.
+              </p>
+            </div>
+            <input
+              :value="settingsStore.uploadConcurrency"
+              type="number"
+              :min="UPLOAD_CONCURRENCY_MIN"
+              :max="UPLOAD_CONCURRENCY_MAX"
+              step="1"
+              class="w-16 shrink-0 rounded-md border border-autonomi-border bg-autonomi-dark px-2 py-1 text-center text-sm text-autonomi-text focus:border-autonomi-blue focus:outline-none"
+              @change="onConcurrencyChange(($event.target as HTMLInputElement).value)"
+            />
+          </div>
+        </div>
+
         <!-- Indelible Enterprise Connection (only show setup when not connected) -->
         <div v-if="!settingsStore.indelibleConnected" class="rounded-lg border border-autonomi-border p-4">
           <div class="flex items-center justify-between">
@@ -383,7 +407,7 @@ import { invoke } from '@tauri-apps/api/core'
 import { open } from '@tauri-apps/plugin-dialog'
 import { openUrl as tauriOpenUrl } from '@tauri-apps/plugin-opener'
 import { arbitrum, arbitrumSepolia } from 'viem/chains'
-import { setDevnetWalletKey } from '~/stores/settings'
+import { setDevnetWalletKey, UPLOAD_CONCURRENCY_MIN, UPLOAD_CONCURRENCY_MAX } from '~/stores/settings'
 import { useSettingsStore } from '~/stores/settings'
 import { isValidEthAddress } from '~/utils/validators'
 import { useToastStore } from '~/stores/toasts'
@@ -612,6 +636,12 @@ async function saveDaemon() {
   toasts.add('Daemon URL updated', 'info')
 }
 
+async function onConcurrencyChange(raw: string) {
+  const n = Number.parseInt(raw, 10)
+  if (!Number.isFinite(n)) return
+  await settingsStore.setUploadConcurrency(n)
+}
+
 async function copyDiagnostics() {
   const report = errorLogStore.buildReport()
   try {
diff --git a/src-tauri/src/config.rs b/src-tauri/src/config.rs
index d31ac2f..60a0e48 100644
--- a/src-tauri/src/config.rs
+++ b/src-tauri/src/config.rs
@@ -24,6 +24,12 @@ pub struct AppConfig {
     pub indelible_api_key: Option<String>,
     #[serde(default = "default_theme_mode")]
     pub theme_mode: String,
+    /// Max concurrent quote/upload operations. Defaults to 1 — testing shows
+    /// concurrent uploads slow down non-linearly (2 files ≠ 2× time, often
+    /// 4–12× on real networks), so serial is the safe default. Power users
+    /// can tune up to 8 via Settings → Advanced.
+    #[serde(default = "default_upload_concurrency")]
+    pub upload_concurrency: u32,
 }
 
 #[derive(Debug, Clone, Serialize, Deserialize)]
@@ -62,6 +68,10 @@ fn default_theme_mode() -> String {
     "dark".to_string()
 }
 
+fn default_upload_concurrency() -> u32 {
+    1
+}
+
 fn default_daemon_url() -> String {
     // Try to discover the daemon port from the port file
     if let Some(url) = discover_daemon_url() {
@@ -106,6 +116,7 @@ impl Default for AppConfig {
             indelible_url: None,
             indelible_api_key: None,
             theme_mode: default_theme_mode(),
+            upload_concurrency: default_upload_concurrency(),
         }
     }
 }
diff --git a/stores/files.ts b/stores/files.ts
index 778a84a..f3f81af 100644
--- a/stores/files.ts
+++ b/stores/files.ts
@@ -1,4 +1,4 @@
-import { defineStore } from 'pinia'
+import { acceptHMRUpdate, defineStore } from 'pinia'
 import { invoke } from '@tauri-apps/api/core'
 import { listen } from '@tauri-apps/api/event'
 import { useToastStore } from './toasts'
@@ -37,13 +37,16 @@ export interface UploadQuote {
 // ── Unified file entry ──
 
 export type FileStatus =
-  | 'complete'      // Normal row, no active transfer
-  | 'quoting'       // Upload: getting cost estimate
-  | 'paying'        // Upload: wallet payment in progress
-  | 'uploading'     // Upload: data being sent to network
-  | 'downloading'   // Download: fetching from network
-  | 'downloaded'    // Download complete, waiting for user to open folder
-  | 'failed'        // Transfer failed
+  | 'complete'           // Normal row, no active transfer
+  | 'queued_for_quote'   // Upload: waiting in queue for a quoting slot
+  | 'quoting'            // Upload: getting cost estimate
+  | 'awaiting_approval'  // Upload: estimate in, waiting for user to click Approve
+  | 'queued_for_upload'  // Upload: approved, waiting in queue for an upload slot
+  | 'paying'             // Upload: wallet payment in progress
+  | 'uploading'          // Upload: data being sent to network
+  | 'downloading'        // Download: fetching from network
+  | 'downloaded'         // Download complete, waiting for user to open folder
+  | 'failed'             // Transfer failed
 
 export interface FileEntry {
   /** Unique ID for reactive tracking */
@@ -84,9 +87,29 @@ export interface FileEntry {
   duration?: number
   /** Error message if failed */
   error?: string
+  /** Raw light-estimate result (held while the entry is in the confirm dialog) */
+  estimate?: UploadCostEstimate
+  /** Payment mode derived from the estimate; carried through to the real upload */
+  paymentMode?: 'regular' | 'merkle'
+  /** Visibility chosen in the confirm dialog */
+  visibility?: 'private' | 'public'
 }
 
-const ACTIVE_STATUSES: FileStatus[] = ['quoting', 'paying', 'uploading', 'downloading', 'downloaded']
+// Pinned rows (top of the table, independent sort). Includes the two queued
+// states and awaiting_approval because the user must still see them and be
+// able to reopen the dialog — they just aren't doing network work yet.
+const ACTIVE_STATUSES: FileStatus[] = [
+  'queued_for_quote',
+  'quoting',
+  'awaiting_approval',
+  'queued_for_upload',
+  'paying',
+  'uploading',
+  'downloading',
+  'downloaded',
+]
+// Entries with live network activity. Excludes the queued/awaiting_approval
+// stalls (they don't need progress bars or spinners in the header).
 const IN_FLIGHT_STATUSES: FileStatus[] = ['quoting', 'paying', 'uploading', 'downloading']
 
 /** Shape persisted to upload_history.json (kept for backwards compat) */
@@ -135,6 +158,29 @@ export const useFilesStore = defineStore('files', {
 
     hasActiveTransfers: (state) =>
       state.files.some(f => IN_FLIGHT_STATUSES.includes(f.status)),
+
+    /** Uploads currently holding a quoting slot. Used by the page scheduler
+     *  to decide whether to promote the next `queued_for_quote` entry. */
+    quotingCount: (state) =>
+      state.files.filter(f => f.kind === 'upload' && f.status === 'quoting').length,
+
+    /** Uploads currently holding an upload slot (payment or chunk storage). */
+    uploadingCount: (state) =>
+      state.files.filter(
+        f => f.kind === 'upload' && (f.status === 'paying' || f.status === 'uploading'),
+      ).length,
+
+    /** FIFO list (oldest first, by row id) of entries waiting for a quote slot. */
+    queuedForQuote: (state) =>
+      state.files
+        .filter(f => f.kind === 'upload' && f.status === 'queued_for_quote')
+        .sort((a, b) => a.id - b.id),
+
+    /** FIFO list of entries waiting for an upload slot (post-approval). */
+    queuedForUpload: (state) =>
+      state.files
+        .filter(f => f.kind === 'upload' && f.status === 'queued_for_upload')
+        .sort((a, b) => a.id - b.id),
   },
 
   actions: {
@@ -223,6 +269,8 @@ export const useFilesStore = defineStore('files', {
 
     // ── Upload flow ──
 
+    /** Create a new upload row. Entry starts in `queued_for_quote`; the page
+     *  scheduler promotes it to `quoting` when a concurrency slot opens. */
     addUpload(name: string, path: string, size_bytes: number): number {
       const id = this.nextId++
       this.files.unshift({
@@ -231,13 +279,64 @@ export const useFilesStore = defineStore('files', {
         name,
         path,
         size_bytes,
-        status: 'quoting',
+        status: 'queued_for_quote',
         date: new Date().toISOString(),
         transferStartedAt: Date.now(),
       })
       return id
     },
 
+    /** Run the light estimate for an entry that's ready to quote. Promotes
+     *  `queued_for_quote` → `quoting` on entry (so concurrency accounting is
+     *  consistent while the async estimate is in flight), then transitions
+     *  to `awaiting_approval` when the estimate returns — even if the
+     *  estimate itself failed, so the real quote can surface a clearer
+     *  error on `startRealUpload`. */
+    async beginQuoting(id: number) {
+      const entry = this.findById(id)
+      if (!entry || entry.kind !== 'upload' || !entry.path) return
+      if (entry.status !== 'quoting' && entry.status !== 'queued_for_quote') return
+
+      this.updateEntry(id, { status: 'quoting' })
+
+      const estimate = await this.estimateFileCost(entry.path)
+      if (estimate) {
+        this.updateEntry(id, {
+          estimate,
+          paymentMode: estimate.payment_mode === 'merkle' ? 'merkle' : 'regular',
+          cost: formatNanoTokens(estimate.storage_cost_atto),
+          gas_cost: formatGasCost(estimate.estimated_gas_cost_wei),
+          status: 'awaiting_approval',
+        })
+      } else {
+        this.updateEntry(id, { status: 'awaiting_approval' })
+      }
+    },
+
+    /** Mark an approved entry as waiting for an upload slot. Caller is
+     *  responsible for kicking the scheduler. */
+    enqueueForUpload(id: number) {
+      const entry = this.findById(id)
+      if (!entry || entry.status !== 'awaiting_approval') return
+      this.updateEntry(id, { status: 'queued_for_upload' })
+    },
+
+    /** Cancel a pending upload that hasn't started paying yet. Covers the
+     *  four pre-payment stalls: both queued states plus quoting and
+     *  awaiting_approval. Once payment begins the backend owns the flow. */
+    cancelPendingUpload(id: number) {
+      const entry = this.findById(id)
+      if (!entry) return
+      const cancellable: FileStatus[] = [
+        'queued_for_quote',
+        'quoting',
+        'awaiting_approval',
+        'queued_for_upload',
+      ]
+      if (!cancellable.includes(entry.status)) return
+      this.removeEntry(id)
+    },
+
     /** Light-touch cost estimate — wraps ant-core `estimate_upload_cost`.
      *  Encrypts the file locally, samples one network quote, extrapolates cost.
      *  Does NOT park a `PreparedUpload`, so the user can cancel without orphaning
@@ -641,6 +740,10 @@ export const useFilesStore = defineStore('files', {
   },
 })
 
+if (import.meta.hot) {
+  import.meta.hot.accept(acceptHMRUpdate(useFilesStore, import.meta.hot))
+}
+
 /** Compute `sha256(text)` as a `0x`-prefixed lowercase hex string. Matches
  *  the address derivation in `src-tauri/src/autonomi_ops.rs` so the frontend
  *  can recognise re-downloads of known uploads without a round-trip. */
diff --git a/stores/settings.ts b/stores/settings.ts
index 158191d..5b9906f 100644
--- a/stores/settings.ts
+++ b/stores/settings.ts
@@ -1,4 +1,4 @@
-import { defineStore } from 'pinia'
+import { acceptHMRUpdate, defineStore } from 'pinia'
 import { invoke } from '@tauri-apps/api/core'
 import { arbitrumSepolia } from 'viem/chains'
 import { ANVIL_CHAIN_ID } from '~/utils/constants'
@@ -19,6 +19,16 @@ interface AppConfig {
   indelible_url: string | null
   indelible_api_key: string | null
   theme_mode: string
+  upload_concurrency: number
+}
+
+/** Allowed range for upload_concurrency (see AppConfig in Rust). */
+export const UPLOAD_CONCURRENCY_MIN = 1
+export const UPLOAD_CONCURRENCY_MAX = 8
+
+function clampConcurrency(n: number): number {
+  if (!Number.isFinite(n)) return UPLOAD_CONCURRENCY_MIN
+  return Math.max(UPLOAD_CONCURRENCY_MIN, Math.min(UPLOAD_CONCURRENCY_MAX, Math.floor(n)))
 }
 
 export const useSettingsStore = defineStore('settings', {
@@ -34,6 +44,7 @@ export const useSettingsStore = defineStore('settings', {
     indelibleOrgName: null as string | null,
     indelibleUserEmail: null as string | null,
     themeMode: 'dark' as ThemeMode,
+    uploadConcurrency: 1,
     loaded: false,
     // Devnet/testnet/direct-key mode (set by manifest or settings form).
     // devnetChainId picks the chain:
@@ -64,6 +75,7 @@ export const useSettingsStore = defineStore('settings', {
         this.indelibleUrl = config.indelible_url
         this.indelibleApiKey = config.indelible_api_key
         this.themeMode = config.theme_mode === 'light' ? 'light' : 'dark'
+        this.uploadConcurrency = clampConcurrency(config.upload_concurrency)
         this.loaded = true
       } catch (e) {
         console.error('Failed to load config:', e)
@@ -81,6 +93,7 @@ export const useSettingsStore = defineStore('settings', {
           indelible_url: this.indelibleUrl,
           indelible_api_key: this.indelibleApiKey,
           theme_mode: this.themeMode,
+          upload_concurrency: this.uploadConcurrency,
         }
         await invoke('save_config', { config })
       } catch (e) {
@@ -88,6 +101,11 @@ export const useSettingsStore = defineStore('settings', {
       }
     },
 
+    async setUploadConcurrency(n: number) {
+      this.uploadConcurrency = clampConcurrency(n)
+      await this.saveConfig()
+    },
+
     async setStorageDir(path: string) {
       this.storageDir = path
       await this.saveConfig()
@@ -192,3 +210,7 @@ export const useSettingsStore = defineStore('settings', {
     },
   },
 })
+
+if (import.meta.hot) {
+  import.meta.hot.accept(acceptHMRUpdate(useSettingsStore, import.meta.hot))
+}
diff --git a/utils/constants.ts b/utils/constants.ts
index d234e26..44e2be7 100644
--- a/utils/constants.ts
+++ b/utils/constants.ts
@@ -2,5 +2,3 @@ export const ANVIL_CHAIN_ID = 31337
 export const POLL_INTERVAL = 5000
 export const DETAIL_POLL_INTERVAL = 30_000
 export const PENDING_UPLOAD_TTL_MS = 300_000
-export const MERKLE_THRESHOLD = 64
-export const AVG_CHUNK_SIZE = 262_144

From 30451633ba1c9d1e00985cbc3546146c0c0af028 Mon Sep 17 00:00:00 2001
From: Nic-dorman <nbdorman@gmail.com>
Date: Wed, 22 Apr 2026 15:40:30 +0100
Subject: [PATCH 2/4] fix(upload): use watchEffect for scheduler so dep
 tracking is bulletproof
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The previous watch used a single getter returning a fresh array every tick,
which Vue compared by reference and so the callback always fired — but the
dependency tracking on array elements got tangled: after the first file's
quoting finished, the scheduler sometimes didn't see the quotingCount drop
and the second queued file never got promoted. watchEffect tracks every
reactive read automatically, which is the right tool for this job.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 pages/files.vue | 34 ++++++++++++++++++----------------
 1 file changed, 18 insertions(+), 16 deletions(-)

diff --git a/pages/files.vue b/pages/files.vue
index 1b87404..8e8ecab 100644
--- a/pages/files.vue
+++ b/pages/files.vue
@@ -540,7 +540,9 @@ function kickScheduler() {
   const budget = settingsStore.uploadConcurrency
 
   while (true) {
-    const active = filesStore.quotingCount + filesStore.uploadingCount
+    const quotingCount = filesStore.quotingCount
+    const uploadingCount = filesStore.uploadingCount
+    const active = quotingCount + uploadingCount
     if (active >= budget) break
 
     const quoteHead = filesStore.queuedForQuote[0]
@@ -572,21 +574,21 @@ function kickScheduler() {
   }
 }
 
-// React whenever any of the scheduler's inputs change: the budget, the
-// active counts (slots freed), the queue lengths (new work enqueued), or
-// the connection state flipping to online.
-watch(
-  () => [
-    settingsStore.uploadConcurrency,
-    filesStore.quotingCount,
-    filesStore.uploadingCount,
-    filesStore.queuedForQuote.length,
-    filesStore.queuedForUpload.length,
-    autonomiConnected.value,
-    settingsStore.devnetActive,
-  ],
-  () => { kickScheduler() },
-)
+// Auto-track every reactive dep the scheduler reads via watchEffect. Runs
+// once on setup and re-runs whenever any of the store getters / connection
+// state change. watchEffect is more robust here than the array-source form
+// of watch because we don't have to remember to list every dep by hand.
+watchEffect(() => {
+  // Touch every reactive input so it's registered, then kick.
+  void settingsStore.uploadConcurrency
+  void filesStore.quotingCount
+  void filesStore.uploadingCount
+  void filesStore.queuedForQuote.length
+  void filesStore.queuedForUpload.length
+  void autonomiConnected.value
+  void settingsStore.devnetActive
+  kickScheduler()
+})
 
 function cancelPendingUploads() {
   for (const id of selectedFileIds.value) filesStore.cancelPendingUpload(id)

From dec937048cd8da0baa02bbf5ca01e39d8d1f66f3 Mon Sep 17 00:00:00 2001
From: Nic-dorman <nbdorman@gmail.com>
Date: Wed, 22 Apr 2026 16:32:53 +0100
Subject: [PATCH 3/4] feat(upload): surface "already stored on network" as
 free, not 0 ANT

ant-core's estimate_upload_cost deliberately returns storage_cost_atto="0"
and estimated_gas_cost_wei="0" when every sampled chunk of a file is
already on the network (chunk_count <= 5, sampled == chunk_count). The
old UI rendered that as "0 ANT" and "+ 0.000000 ETH gas", which is
indistinguishable from a suspiciously cheap quote.

- New alreadyStored flag on FileEntry, set in beginQuoting when both
  cost fields are "0" and chunk_count > 0.
- Dialog cost box shows a green "Already stored on the network -- free"
  banner when every entry is stored, plus per-entry "Already stored"
  badges in the file list. Mixed batches get a note on the cost card.
- Uploads table cost cell reads "Free -- already stored" for those rows.
- The "estimated from a single network quote" disclaimer is hidden for
  the all-stored case (no estimate to vary).

The upload flow itself is unchanged -- start_upload returns
payment_required=false and confirm_upload runs as a no-op on already-
stored chunks, so Approve still does the right thing.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 components/files/UploadConfirmDialog.vue | 34 +++++++++++++++++++++---
 pages/files.vue                          |  9 +++++--
 stores/files.ts                          | 14 ++++++++++
 3 files changed, 52 insertions(+), 5 deletions(-)

diff --git a/components/files/UploadConfirmDialog.vue b/components/files/UploadConfirmDialog.vue
index 0f6af8d..e036058 100644
--- a/components/files/UploadConfirmDialog.vue
+++ b/components/files/UploadConfirmDialog.vue
@@ -26,7 +26,15 @@
               :key="entry.id"
               class="flex items-center justify-between text-sm"
             >
-              <span class="max-w-[280px] truncate">{{ entry.name }}</span>
+              <span class="flex min-w-0 items-center gap-2">
+                <span class="max-w-[200px] truncate">{{ entry.name }}</span>
+                <span
+                  v-if="entry.alreadyStored"
+                  class="shrink-0 rounded bg-green-500/10 px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wider text-green-400"
+                >
+                  Already stored
+                </span>
+              </span>
               <span class="text-autonomi-muted">{{ entry.size_bytes ? formatBytes(entry.size_bytes) : '-' }}</span>
             </div>
           </div>
@@ -49,7 +57,18 @@
                quote spinner so users aren't left watching a spinner that will
                never resolve. No heuristic / placeholder values. -->
           <div class="rounded-md border border-autonomi-border bg-autonomi-surface/50 p-3 space-y-2">
-            <template v-if="quotedCost">
+            <template v-if="allAlreadyStored">
+              <div class="flex items-center gap-2 text-sm font-medium text-green-400">
+                <svg class="h-4 w-4 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
+                  <path stroke-linecap="round" stroke-linejoin="round" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                </svg>
+                <span>Already stored on the network — free</span>
+              </div>
+              <p class="text-xs text-autonomi-muted">
+                Every chunk is already present. No ANT or gas will be spent.
+              </p>
+            </template>
+            <template v-else-if="quotedCost">
               <div class="flex items-center justify-between text-sm font-medium">
                 <span>Network storage cost</span>
                 <span class="text-autonomi-blue">{{ quotedCost }}</span>
@@ -58,6 +77,9 @@
                 <span>Estimated gas</span>
                 <span>{{ quotedGas ?? '—' }}</span>
               </div>
+              <p v-if="someAlreadyStored" class="text-xs text-green-400">
+                Some files are already stored — that portion costs nothing.
+              </p>
             </template>
             <template v-else-if="connectionStore.hasFailed">
               <div class="space-y-2">
@@ -136,7 +158,7 @@
             </div>
           </div>
 
-          <p v-if="quotedCost && effectivePaymentMode === 'regular'" class="text-xs text-autonomi-muted">
+          <p v-if="quotedCost && !allAlreadyStored && effectivePaymentMode === 'regular'" class="text-xs text-autonomi-muted">
             Estimated from a single network quote — final cost may vary slightly. Gas fees apply on top.
           </p>
 
@@ -211,6 +233,12 @@ const entries = computed<FileEntry[]>(() =>
 const allEstimated = computed(() =>
   entries.value.length > 0 && entries.value.every(e => e.estimate),
 )
+const allAlreadyStored = computed(() =>
+  entries.value.length > 0 && entries.value.every(e => e.alreadyStored),
+)
+const someAlreadyStored = computed(() =>
+  entries.value.some(e => e.alreadyStored),
+)
 const anyQuoting = computed(() =>
   entries.value.some(e => e.status === 'quoting' || e.status === 'queued_for_quote'),
 )
diff --git a/pages/files.vue b/pages/files.vue
index 8e8ecab..c0610ec 100644
--- a/pages/files.vue
+++ b/pages/files.vue
@@ -114,8 +114,13 @@
                   <StatusBadge :status="statusLabel(file)" />
                 </td>
                 <td class="px-4 py-2.5 text-autonomi-muted">
-                  <span>{{ file.cost ?? '-' }}</span>
-                  <span v-if="file.gas_cost" class="block text-[10px] text-autonomi-muted/60">+ {{ file.gas_cost }} gas</span>
+                  <template v-if="file.alreadyStored">
+                    <span class="text-green-400">Free — already stored</span>
+                  </template>
+                  <template v-else>
+                    <span>{{ file.cost ?? '-' }}</span>
+                    <span v-if="file.gas_cost" class="block text-[10px] text-autonomi-muted/60">+ {{ file.gas_cost }} gas</span>
+                  </template>
                 </td>
                 <td class="px-4 py-2.5">
                   <span
diff --git a/stores/files.ts b/stores/files.ts
index f3f81af..b0bdc20 100644
--- a/stores/files.ts
+++ b/stores/files.ts
@@ -93,6 +93,10 @@ export interface FileEntry {
   paymentMode?: 'regular' | 'merkle'
   /** Visibility chosen in the confirm dialog */
   visibility?: 'private' | 'public'
+  /** True when ant-core's estimator reported every chunk already stored on
+   *  the network (`storage_cost_atto === "0"` with a positive `chunk_count`).
+   *  Distinguishes a genuinely free re-upload from a suspiciously cheap quote. */
+  alreadyStored?: boolean
 }
 
 // Pinned rows (top of the table, independent sort). Includes the two queued
@@ -301,11 +305,21 @@ export const useFilesStore = defineStore('files', {
 
       const estimate = await this.estimateFileCost(entry.path)
       if (estimate) {
+        // ant-core returns "0" for both fields when every sampled chunk is
+        // already on the network (see ant-core file.rs::estimate_upload_cost).
+        // That's a legitimate signal, not a failed estimate — flag it so the
+        // UI can say "already stored" instead of rendering "0 ANT" as if it
+        // were any other cheap quote.
+        const alreadyStored = estimate.chunk_count > 0
+          && estimate.storage_cost_atto === '0'
+          && estimate.estimated_gas_cost_wei === '0'
+
         this.updateEntry(id, {
           estimate,
           paymentMode: estimate.payment_mode === 'merkle' ? 'merkle' : 'regular',
           cost: formatNanoTokens(estimate.storage_cost_atto),
           gas_cost: formatGasCost(estimate.estimated_gas_cost_wei),
+          alreadyStored,
           status: 'awaiting_approval',
         })
       } else {

From 2a1e653ac5bf78710138becbbd6dd67e97a95aaa Mon Sep 17 00:00:00 2001
From: Nic-dorman <nbdorman@gmail.com>
Date: Wed, 22 Apr 2026 16:56:07 +0100
Subject: [PATCH 4/4] feat(upload): auto-process already-stored files (no
 Approve click)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Already-stored entries now skip awaiting_approval entirely — the store
routes them directly into queued_for_upload, the scheduler drives them
through to complete, and the confirm dialog auto-dismisses when every
selected entry is in that state.

- Row status collapses all the intermediate no-op states (queued_for_upload,
  the second-time quoting inside startRealUpload, paying, uploading) to
  a single honest "Saving datamap…" label. User sees a clean
  Obtaining quote… -> Saving datamap… -> Complete sequence instead of
  a confusing flash through Paying / Uploading for a free file.
- Dialog canApprove, readyCount, and button label now count only
  non-stored entries, so a mixed batch (some stored, some not) behaves
  correctly: stored entries process in the background while the user
  approves the rest.
- Dialog auto-closes with a toast ("N files already stored — saving
  datamap") when every selected entry is alreadyStored. No ceremonial
  click required for a free, no-decision-needed operation.
- StatusBadge has an entry for the new "Saving datamap…" label so it
  doesn't fall back to ?.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 components/StatusBadge.vue               |  1 +
 components/files/UploadConfirmDialog.vue | 23 +++++++++++------
 pages/files.vue                          | 33 ++++++++++++++++++++++++
 stores/files.ts                          |  6 ++++-
 4 files changed, 54 insertions(+), 9 deletions(-)

diff --git a/components/StatusBadge.vue b/components/StatusBadge.vue
index 272b901..cfd1868 100644
--- a/components/StatusBadge.vue
+++ b/components/StatusBadge.vue
@@ -23,6 +23,7 @@ const statusMap: Record<string, { dot: string; label: string; color: string }> =
   'Queued: uploading': { dot: '○', label: 'Queued: uploading', color: 'text-autonomi-muted' },
   'Connecting to network…': { dot: '◐', label: 'Connecting to network…', color: 'text-autonomi-warning' },
   'Obtaining quote…': { dot: '◐', label: 'Obtaining quote…', color: 'text-autonomi-warning' },
+  'Saving datamap…': { dot: '◐', label: 'Saving datamap…', color: 'text-autonomi-warning' },
   'Network unavailable': { dot: '✖', label: 'Network unavailable', color: 'text-autonomi-error' },
   'Ready to approve': { dot: '●', label: 'Ready to approve', color: 'text-autonomi-blue' },
   Paying: { dot: '◐', label: 'Paying', color: 'text-autonomi-warning' },
diff --git a/components/files/UploadConfirmDialog.vue b/components/files/UploadConfirmDialog.vue
index e036058..d504078 100644
--- a/components/files/UploadConfirmDialog.vue
+++ b/components/files/UploadConfirmDialog.vue
@@ -182,10 +182,10 @@
             </div>
             <div class="flex items-center gap-2">
               <span
-                v-if="!canApprove && entries.length > 1"
+                v-if="!canApprove && needsApprovalEntries.length > 1"
                 class="text-xs text-autonomi-muted"
               >
-                Ready: {{ readyCount }} of {{ entries.length }}
+                Ready: {{ readyCount }} of {{ needsApprovalEntries.length }}
               </span>
               <button
                 class="rounded-md bg-autonomi-blue px-3 py-1.5 text-sm font-medium text-white hover:opacity-90 disabled:cursor-not-allowed disabled:opacity-50"
@@ -242,14 +242,21 @@ const someAlreadyStored = computed(() =>
 const anyQuoting = computed(() =>
   entries.value.some(e => e.status === 'quoting' || e.status === 'queued_for_quote'),
 )
+/** Entries that still require a user decision — already-stored files auto-
+ *  process through the scheduler and never see `awaiting_approval`, so they
+ *  don't count toward the approve gate. */
+const needsApprovalEntries = computed(() =>
+  entries.value.filter(e => !e.alreadyStored),
+)
 const readyCount = computed(() =>
-  entries.value.filter(e => e.status === 'awaiting_approval').length,
+  needsApprovalEntries.value.filter(e => e.status === 'awaiting_approval').length,
 )
-/** Approve is gated on every entry being `awaiting_approval`. Partial
- *  approve would leave some files silently queued and invite mis-clicks;
- *  block until the whole batch is ready. */
+/** Approve is gated on every non-stored entry being `awaiting_approval`.
+ *  Partial approve would leave some files silently queued and invite
+ *  mis-clicks; block until the whole approvable batch is ready. */
 const canApprove = computed(() =>
-  entries.value.length > 0 && readyCount.value === entries.value.length,
+  needsApprovalEntries.value.length > 0
+  && readyCount.value === needsApprovalEntries.value.length,
 )
 
 /** Sum of estimate costs across entries. Null unless every entry has a real
@@ -290,7 +297,7 @@ const effectivePaymentMode = computed<'regular' | 'merkle' | null>(() => {
 const visibility = ref<'private' | 'public'>('private')
 
 const approveButtonLabel = computed(() => {
-  const n = entries.value.length
+  const n = needsApprovalEntries.value.length
   if (n <= 1) return 'Approve Upload'
   return `Approve ${n} Uploads`
 })
diff --git a/pages/files.vue b/pages/files.vue
index c0610ec..c153a45 100644
--- a/pages/files.vue
+++ b/pages/files.vue
@@ -375,6 +375,17 @@ function basenameOf(path: string): string {
 // ── Row display helpers ──
 
 function statusLabel(file: FileEntry): string {
+  // Already-stored uploads collapse every state after the initial estimate
+  // into a single honest label. The real backend still cycles through
+  // quoting → paying → uploading for ant-core's bookkeeping, but it's all
+  // a no-op sub-second dance in terms of user-visible work.
+  if (
+    file.alreadyStored
+    && (file.status === 'quoting' || file.status === 'queued_for_upload' || file.status === 'paying' || file.status === 'uploading')
+  ) {
+    return 'Saving datamap…'
+  }
+
   if (file.status === 'uploading') return 'Uploading'
   if (file.status === 'downloading') return 'Downloading'
   if (file.status === 'downloaded') return 'Downloaded'
@@ -595,6 +606,28 @@ watchEffect(() => {
   kickScheduler()
 })
 
+// Auto-dismiss the confirm dialog when every selected entry was detected as
+// already stored on the network. Those entries bypass `awaiting_approval`
+// (no user decision left to make) and flow through the scheduler on their
+// own, so leaving the dialog open waiting for an Approve that can never
+// enable is just clutter.
+watch(
+  () => selectedFileIds.value.map(id => filesStore.findById(id)?.alreadyStored),
+  (flags) => {
+    if (!showUploadConfirm.value) return
+    if (flags.length === 0) return
+    if (flags.some(f => f === undefined)) return
+    if (!flags.every(f => f === true)) return
+    const n = flags.length
+    showUploadConfirm.value = false
+    selectedFileIds.value = []
+    toastStore.add(
+      `${n} file${n !== 1 ? 's' : ''} already stored — saving datamap`,
+      'info',
+    )
+  },
+)
+
 function cancelPendingUploads() {
   for (const id of selectedFileIds.value) filesStore.cancelPendingUpload(id)
   selectedFileIds.value = []
diff --git a/stores/files.ts b/stores/files.ts
index b0bdc20..9ded45f 100644
--- a/stores/files.ts
+++ b/stores/files.ts
@@ -314,13 +314,17 @@ export const useFilesStore = defineStore('files', {
           && estimate.storage_cost_atto === '0'
           && estimate.estimated_gas_cost_wei === '0'
 
+        // Already-stored entries skip awaiting_approval entirely — there's
+        // no user decision to make (no payment, no real upload). Route them
+        // straight into the upload queue so the scheduler drives them through
+        // to `complete` without a ceremonial Approve click.
         this.updateEntry(id, {
           estimate,
           paymentMode: estimate.payment_mode === 'merkle' ? 'merkle' : 'regular',
           cost: formatNanoTokens(estimate.storage_cost_atto),
           gas_cost: formatGasCost(estimate.estimated_gas_cost_wei),
           alreadyStored,
-          status: 'awaiting_approval',
+          status: alreadyStored ? 'queued_for_upload' : 'awaiting_approval',
         })
       } else {
         this.updateEntry(id, { status: 'awaiting_approval' })