@meddleware/walrus-ui 0.1.23 → 0.1.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meddleware/walrus-ui",
-  "version": "0.1.23",
+  "version": "0.1.25",
   "description": "Standalone Vue 3 SPA for uploading blobs to Walrus decentralised storage and managing owned blobs — wallet-connected, NFT-gated relay support.",
   "author": "Meddleware <dev@meddleware.co.uk>",
   "license": "0BSD",
@@ -45,7 +45,7 @@
     "@meddleware/ui": "^0.1.10",
     "@meddleware/wallet-adapter": "^0.0.5",
     "@meddleware/walrus-client": "^0.0.9",
-    "@meddleware/walrus-relay": "^0.1.8",
+    "@meddleware/walrus-relay": "^0.1.10",
     "@mysten/sui": "^2.30.0",
     "@mysten/wallet-standard": "^0.20.0",
     "@mysten/walrus": "~1.2.24",

package/src/components/WalrusView.vue

@@ -10,7 +10,7 @@ import {
   useAccessGate,
   MAX_SINGLE_RESERVATION_EPOCHS,
 } from '@meddleware/walrus-relay'
-import type { UploadResult } from '@meddleware/walrus-relay'
+import type { UploadResult, UploadProgress } from '@meddleware/walrus-relay'
 import { CopyableAddress, ExplorerLink, UiNotice, suiExplorerUrl } from '@meddleware/ui'
 // Lightweight URL import — just the wasm asset URL (does not pull the walrus client).
 import walrusWasmUrl from '@mysten/walrus-wasm/web/walrus_wasm_bg.wasm?url'
@@ -19,6 +19,7 @@ import { useWallet, getSuiClient } from '../wallet.js'
 import { fetchChallenge, buildAccessProof } from '@meddleware/nft-gate-client'
 import { NETWORK, relayHosts, accessGate, uploadRelayMaxTipMist, walruscanBlobUrl } from '../config.js'
 import { runBlobUpload } from '../upload-flow.js'
+import { getCertifyRetry } from '@meddleware/walrus-relay'
 import {
   consumeStorageKey,
   isRedeemedConflict,
@@ -67,7 +68,7 @@ async function onPurchase(): Promise<void> {
 // upload-flow.ts). Reusing a prior registration is what produced "the received transaction is too old".
 async function performUpload(
   bytes: Uint8Array,
-  opts: { relayHost: string; onStatus: (s: string) => void },
+  opts: { relayHost: string; onStatus: (s: string | UploadProgress) => void },
 ): Promise<UploadResult> {
   if (!account.value) throw new Error('Connect your wallet first.')
   const executor = await buildExecutor()
@@ -77,6 +78,10 @@ async function performUpload(
   const gated = !!(gate && gateState.hasAccess.value === true && gateState.nftId.value)
   const consumeKey = gate ? consumeStorageKey(NETWORK, gate.gateId, address) : null
 
+  // Gated uploads spend one NFT use on-chain before the core flow — surface it as the leading
+  // "Access" step so the stepper reflects the extra wallet approval (a reused consume is instant).
+  if (gated) opts.onStatus({ step: 'access', detail: 'Confirming access…' })
+
   // Resolve this attempt's relay token (gated only); reuses a stored consume, fresh challenge each time.
   const token = (forceFresh: boolean): Promise<string | undefined> =>
     !gated
@@ -97,22 +102,29 @@ async function performUpload(
         })
 
   const runOnce = async (authToken: string | undefined): Promise<UploadResult> => {
-    const r = await runBlobUpload({
-      bytes,
-      network: NETWORK,
-      relayHost: opts.relayHost,
-      address,
-      wasmUrl: walrusWasmUrl,
-      maxTipMist: uploadRelayMaxTipMist(),
-      epochs: MAX_SINGLE_RESERVATION_EPOCHS,
-      executor,
-      suiClient: getSuiClient(),
-      authToken,
-      onStatus: opts.onStatus,
-    })
-    // Success → clear the consume layer (the use is now genuinely spent for an upload).
-    if (consumeKey) storage.removeItem(consumeKey)
-    return r
+    try {
+      const r = await runBlobUpload({
+        bytes,
+        network: NETWORK,
+        relayHost: opts.relayHost,
+        address,
+        wasmUrl: walrusWasmUrl,
+        maxTipMist: uploadRelayMaxTipMist(),
+        epochs: MAX_SINGLE_RESERVATION_EPOCHS,
+        executor,
+        suiClient: getSuiClient(),
+        authToken,
+        onStatus: opts.onStatus,
+      })
+      // Success → clear the consume layer (the use is now genuinely spent for an upload).
+      if (consumeKey) storage.removeItem(consumeKey)
+      return r
+    } catch (e) {
+      // A certify-only failure means the upload already landed (relay access was used), so clear the
+      // consume too — the certify retry is a plain Sui tx and must not trigger a fresh NFT consume.
+      if (getCertifyRetry(e) && consumeKey) storage.removeItem(consumeKey)
+      throw e
+    }
   }
 
   try {

package/src/upload-flow.ts

@@ -11,7 +11,8 @@
 // can't be reused across attempts — reusing a prior/discovered registration (localStorage or on-chain
 // discovery) hands the relay an old tx with a non-matching nonce. Each attempt re-encodes (free) and
 // registers fresh so the tip+nonce the relay verifies is always recent.
-import type { UploadResult } from '@meddleware/walrus-relay'
+import type { UploadResult, UploadProgress } from '@meddleware/walrus-relay'
+import { attachCertifyRetry } from '@meddleware/walrus-relay'
 
 /** Minimal transaction executor — the structural subset App.vue's wallet executor already provides. */
 export interface UploadExecutor {
@@ -62,7 +63,8 @@ export interface RunBlobUploadDeps {
    * upload presents a fresh challenge signature (see `@meddleware/walrus-client`).
    */
   authToken?: string | (() => string | undefined)
-  onStatus: (s: string) => void
+  /** Structured step progress; drives the stepped indicator in the WalrusUpload widget. */
+  onStatus: (p: UploadProgress) => void
   /** Lazy loader for the Walrus client module (keeps wasm out of the eager bundle). */
   loadWalrusClient?: () => Promise<WalrusClientModule>
 }
@@ -90,26 +92,40 @@ export async function runBlobUpload(deps: RunBlobUploadDeps): Promise<UploadResu
   })
   const flow = createBlobUploadFlow(client, deps.bytes)
 
-  deps.onStatus('Encoding…')
+  deps.onStatus({ step: 'encode', detail: 'Encoding…' })
   await flow.encode()
 
-  deps.onStatus('Registering blob (approve in wallet)…')
+  deps.onStatus({ step: 'register', detail: 'Registering blob (approve in wallet)…' })
   const regTx = flow.register({ owner: deps.address, epochs: deps.epochs, deletable: false })
   regTx.setSenderIfNotSet(deps.address)
   await regTx.build({ client: deps.suiClient })
   const reg = await deps.executor.signAndExecute(regTx)
   await deps.executor.waitForTransaction(reg.digest)
 
-  deps.onStatus('Uploading to the relay…')
+  deps.onStatus({ step: 'upload', detail: 'Uploading to the relay…' })
   await flow.upload({ digest: reg.digest, deletable: false })
 
-  deps.onStatus('Certifying (approve in wallet)…')
-  const certTx = flow.certify()
-  certTx.setSenderIfNotSet(deps.address)
-  await certTx.build({ client: deps.suiClient })
-  const cert = await deps.executor.signAndExecute(certTx)
-  await deps.executor.waitForTransaction(cert.digest)
+  // Certify is a plain owner tx built from the storage-node certificate the live `flow` now holds
+  // (no relay, no tip). If it fails (e.g. the user rejects the prompt) the blob is already registered
+  // + stored + paid, so we never want to redo the upload — we expose this closure to retry certify
+  // alone. Re-calling `flow.certify()` just rebuilds the same tx from the in-memory certificate.
+  const runCertify = async (): Promise<UploadResult> => {
+    deps.onStatus({ step: 'certify', detail: 'Certifying (approve in wallet)…' })
+    const certTx = flow.certify()
+    certTx.setSenderIfNotSet(deps.address)
+    await certTx.build({ client: deps.suiClient })
+    const cert = await deps.executor.signAndExecute(certTx)
+    await deps.executor.waitForTransaction(cert.digest)
+    const blob = await flow.getBlob()
+    return { blobId: blob.blobId, url: walrusBlobUrl(deps.network, blob.blobId), digest: cert.digest }
+  }
 
-  const blob = await flow.getBlob()
-  return { blobId: blob.blobId, url: walrusBlobUrl(deps.network, blob.blobId), digest: cert.digest }
+  try {
+    return await runCertify()
+  } catch (e) {
+    // Upload landed but certify did not: attach a retry so the UI can offer a "Certify" button
+    // rather than discarding the paid upload. The closure keeps the live flow (and its certificate).
+    attachCertifyRetry<UploadResult>(e, runCertify)
+    throw e
+  }
 }