@meddleware/walrus-storage-ui 0.1.68 → 0.1.70

package/CHANGELOG.md

@@ -1,9 +1,38 @@
 # Changelog
 
-All notable changes to `@meddleware/walrus-ui` are documented here.
+All notable changes to `@meddleware/walrus-storage-ui` are documented here.
 Format follows [Keep a Changelog](https://keepachangelog.com/en/1.1.0/); versioning follows
 [Semantic Versioning](https://semver.org/). Before 0.2.0, breaking changes ship as patch releases.
 
+## [0.1.70] - 2026-11-12
+
+### Changed
+
+- The header shows the company mark (the Kopimi "K") beside the tool name (`@meddleware/ui` 0.1.41 `AppToolShell`).
+- The favicon set (SVG, ICO, Apple touch icon, 192 and 512 icons, web manifest named "Walrus Assets") now comes from `@meddleware/frontend-config` 0.0.8 (`meddlewareApp({ name })`); the app's own `public/favicon.svg` and its icon link tag are removed.
+- Dependencies: `@meddleware/ui` ^0.1.41, `@meddleware/frontend-config` ^0.0.8, `@meddleware/web-utils` ^0.0.4.
+- CI and release workflows set `DO_NOT_TRACK=1`.
+
+### Added
+
+- Tests: the header shows the mark; sources and the production build name no third-party font, CDN or tracker, ship no font files and carry the brand icon set (run over `dist/` in CI after the build).
+
+## [0.1.69] - 2026-11-07
+
+### Changed
+
+- Words for a person: the page title is "Walrus Assets · Meddleware" (it was "Walrus Uploader · MeddleWare") and the description says what the app does for its reader. The licence holder is spelled Meddleware.
+- Where Walrus storage cannot be used the page says so in plain words and shows no tool: "not available on localnet" (and the networks to switch to), or "not available here right now" for a relay address that is not https or a gate id that is not an object id. A gate id set for a network with no recorded `access_gate` deployment makes that network unavailable instead of silently serving it without the pass. Which networks to suggest comes from the same checks, not from prose. The variable names go to the browser console only.
+- A failed owned-blob load says "Your blobs could not be loaded. Check your connection and press Refresh."; the cause goes to the console.
+- `@meddleware/walrus-storage-kit` ^0.1.38 (the access-pass prompt reads "This upload relay" and "Gate owner receives"; the estimated relay fee is exact), `@meddleware/ui` ^0.1.40, `@meddleware/web-utils` ^0.0.3, `@meddleware/wallet-adapter` ^0.0.22 (peer range now `>=0.0.22 <0.2.0`).
+
+### Internal
+
+- The standalone shell is the shared `AppToolShell` (the relay badge stays in its `actions` slot); the network comes from `selectBuiltNetwork`.
+- `@meddleware/frontend-config` ^0.0.7: `vite.config.ts` is `meddlewareApp`, `vitest.config.ts` is `vueTestConfig`, `tsconfig.json` extends the shared base; the local audit gate and licence scripts are replaced by `mw-audit-gate` and `mw-third-party-licenses`; `mw-sync --check` and a CSP inline-script check (`npm run check:csp`, also in the image build) run in CI. The `"meddleware"` section of package.json declares the CSP profile (`chain-wasm`) and Lighthouse use.
+- Removed the unused `public/CNAME`, `public/_headers` and `public/_redirects` (the image is served by static-server, which sets the headers and the SPA fallback). `AGENTS.md` points to `CLAUDE.md`.
+- New tests: `availability`, the availability cases of `config`, the unavailable view, the shell, the plain load failure and a wording test over `index.html` and every template.
+
 ## [0.1.68] - 2026-11-06
 
 ### Changed

package/LICENSE

@@ -1,6 +1,6 @@
 BSD Zero Clause License
 
-Copyright (c) 2026 MeddleWare
+Copyright (c) 2026 Meddleware
 
 Permission to use, copy, modify, and/or distribute this software for any
 purpose with or without fee is hereby granted.

package/README.md

@@ -3,13 +3,13 @@
 [![License: 0BSD](https://img.shields.io/badge/license-0BSD-blue)](LICENSE)
 
 A Vue 3 SPA for uploading and managing blobs on [Walrus](https://walrus.xyz) decentralised
-storage on Sui. Supports NFT-gated operator relays (commission-enforced on-chain via
+storage on Sui. Supports NFT-gated Meddleware relays (commission-enforced on-chain via
 `access_gate`) with automatic fallback to the public Mysten relay.
 
 ## Features
 
 - Connect any Sui wallet (wallet-standard)
-- Select between operator relay (supports the app) and public relay (free)
+- Select between the Meddleware relay (supports the app) and the public relay (free)
 - Upload blobs through an NFT-gated or open relay
 - View and extend your owned Walrus blobs
 - Two-approval upload flow: register tx → upload → certify tx
@@ -32,17 +32,22 @@ All `VITE_*` vars are baked into the static bundle at build time.
 | Variable | Default | Description |
 | --- | --- | --- |
 | `VITE_NETWORK` | `testnet` | Network the standalone build selects (`testnet` or `mainnet`); embedded, the host's selector rules |
-| `VITE_WALRUS_RELAY_TESTNET` | Public Mysten relay | Operator relay URL for testnet |
-| `VITE_WALRUS_RELAY_MAINNET` | Public Mysten relay | Operator relay URL for mainnet |
+| `VITE_WALRUS_RELAY_TESTNET` | Public Mysten relay | Meddleware relay URL for testnet (https; plain http only on localhost) |
+| `VITE_WALRUS_RELAY_MAINNET` | Public Mysten relay | Meddleware relay URL for mainnet (https; plain http only on localhost) |
 | `VITE_ACCESS_GATE_ID_TESTNET` | — | Gate object ID (testnet; unset = no gate) |
 | `VITE_ACCESS_GATE_SOULBOUND_TESTNET` | `false` | `true` if NFTs are soulbound |
 | `VITE_ACCESS_GATE_ID_MAINNET` | — | Gate object ID (mainnet) |
 | `VITE_UPLOAD_RELAY_MAX_TIP_MIST` | `5000000` | Max relay tip cap in MIST (0.005 SUI) |
 
 The `access_gate` package and `PlatformConfig` come from the published deployment
-(`relayGateConfig` in `@meddleware/walrus-storage-kit`) — operators only configure the values listed
+(`relayGateConfig` in `@meddleware/walrus-storage-kit`) — a deployment only configures the values listed
 above.
 
+A setting the app cannot serve (a relay URL that is not https, a gate id that is not an object id) makes that network
+read "not available here right now" to a person; the variable is named only in the browser console. A gate id set for a
+network with no recorded `access_gate` deployment makes the network "not available on <network>" (it would otherwise be
+served without the pass). Networks to switch to are the ones that pass the same checks.
+
 ## Docker build
 
 The Docker context is this repo root. `@meddleware/walrus-storage-kit` resolves from the npm registry,

package/index.html

@@ -3,9 +3,8 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
-    <title>Walrus Uploader · MeddleWare</title>
-    <meta name="description" content="Upload blobs to Walrus decentralised storage on Sui through the MeddleWare relay. Client-side; your wallet signs and pays." />
+    <title>Walrus Assets · Meddleware</title>
+    <meta name="description" content="Upload files to Walrus decentralised storage on Sui and manage the blobs you own: see how long they last, extend them, finish an upload. Runs in your browser; your wallet signs and pays." />
   </head>
   <body>
     <div id="app"></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meddleware/walrus-storage-ui",
-  "version": "0.1.68",
+  "version": "0.1.70",
   "homepage": "https://docs.meddleware.co.uk/blockchain/sui/walrus-storage/",
   "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>",
@@ -42,34 +42,35 @@
     "lint:js": "eslint .",
     "lint": "npm run lint:css && npm run lint:js && npm run lint:html",
     "lint:html": "html-validate \"src/**/*.vue\"",
-    "licenses": "node scripts/third-party-licenses.mjs",
-    "check:licenses": "node scripts/third-party-licenses.mjs --check",
+    "licenses": "mw-third-party-licenses",
+    "check:licenses": "mw-third-party-licenses --check",
     "shots": "SHOTS=1 playwright test",
     "lhci": "npm run build && lhci autorun",
-    "check:bundle": "check-prod-bundle dist"
+    "check:bundle": "check-prod-bundle dist",
+    "check:csp": "mw-check-csp-inline @Dockerfile dist"
   },
   "publishConfig": {
     "access": "public"
   },
   "dependencies": {
     "@meddleware/design-tokens": "^0.1.13",
-    "@meddleware/ui": "^0.1.39",
+    "@meddleware/ui": "^0.1.41",
     "@meddleware/walrus-storage-client": "^0.0.34",
-    "@meddleware/walrus-storage-kit": "^0.1.37",
-    "@meddleware/web-utils": "^0.0.2",
+    "@meddleware/walrus-storage-kit": "^0.1.39",
+    "@meddleware/web-utils": "^0.0.4",
     "@mysten/sui": "^2.33.2",
     "@mysten/walrus": "~1.2.32",
     "@mysten/walrus-wasm": "~0.3.1",
     "vue": "^3.5.43"
   },
   "peerDependencies": {
-    "@meddleware/wallet-adapter": ">=0.0.12 <0.2.0"
+    "@meddleware/wallet-adapter": ">=0.0.22 <0.2.0"
   },
   "devDependencies": {
     "@lhci/cli": "^0.15.1",
     "@meddleware/access-gate-client": "^0.0.13",
-    "@meddleware/frontend-config": "^0.0.2",
-    "@meddleware/wallet-adapter": "^0.0.21",
+    "@meddleware/frontend-config": "^0.0.8",
+    "@meddleware/wallet-adapter": "^0.0.22",
     "@playwright/test": "~1.64.1",
     "@types/node": "~26.6.5",
     "@vitejs/plugin-vue": "^6.0.8",
@@ -103,5 +104,10 @@
     "basic-ftp": "^6.2.4",
     "tmp": "^0.2.7",
     "zod": "^4.6.7"
+  },
+  "meddleware": {
+    "kind": "app",
+    "csp": "chain-wasm",
+    "lhci": true
   }
 }

package/src/App.vue

@@ -1,35 +1,24 @@
 <script setup lang="ts">
-// Standalone shell for the Walrus SPA: app header + footer wrapping the core tool view.
+// Standalone shell for the Walrus SPA: the shared tool shell (header, colour mode, footer) around the core tool view.
 // The core UI lives in WalrusStorageView.vue (also exported for inline embedding in the dashboard).
-import { AppFooter, AppHeader, ColorModeControl, CopyrightLine, UiAppShell, useColorMode } from '@meddleware/ui'
+import { computed } from 'vue'
+import { AppToolShell } from '@meddleware/ui'
 import { TipConfigBadge } from '@meddleware/walrus-storage-kit'
 import { walrusNetwork, OPERATOR_RELAY_HOSTS } from './config.js'
 import WalrusStorageView from './components/WalrusStorageView.vue'
 
-const { mode, set } = useColorMode('dark')
-const DOCS_URL = import.meta.env.VITE_DOCS_URL || 'https://docs.meddleware.co.uk/blockchain/sui/walrus-storage/'
-const DEV_URL = import.meta.env.VITE_DEV_URL || 'https://meddleware.dev/sui/walrus-storage/'
+/** The relay of the active network (the badge shows whether it is up and what it tips); none where Walrus storage cannot be used. */
+const relayHost = computed(() => (walrusNetwork.value ? OPERATOR_RELAY_HOSTS[walrusNetwork.value] : null))
+const DOCS_URL = import.meta.env.VITE_DOCS_URL || undefined
+const DEV_URL = import.meta.env.VITE_DEV_URL || undefined
 </script>
 
 <template>
-  <UiAppShell contained>
-    <template #header>
-      <AppHeader variant="dark">
-        <template #brand>Walrus Assets</template>
-        <template #actions>
-          <TipConfigBadge v-if="walrusNetwork" :host="OPERATOR_RELAY_HOSTS[walrusNetwork]" />
-          <ColorModeControl :model-value="mode" @update:model-value="set" />
-        </template>
-      </AppHeader>
+  <AppToolShell title="Walrus Assets" slug="walrus-storage" :docs-url="DOCS_URL" :dev-url="DEV_URL">
+    <template #actions>
+      <TipConfigBadge v-if="relayHost" :host="relayHost" />
     </template>
 
-    <h1 class="mw-visually-hidden">Walrus Assets</h1>
     <WalrusStorageView />
-
-    <template #footer>
-      <AppFooter :docs-url="DOCS_URL" :dev-url="DEV_URL">
-        <CopyrightLine symbol-variant="kopimi" organisation-name="Meddleware" rights-statement="jam" />
-      </AppFooter>
-    </template>
-  </UiAppShell>
+  </AppToolShell>
 </template>

package/src/availability.ts

@@ -0,0 +1,21 @@
+// What a person is told when Walrus storage cannot be used on a network. Nothing here names a build variable or a missing setting: a
+// person can do nothing about those, so they read what they can do (wait, or use another network); the technical cause goes to the
+// console (`config.ts` logs it) and to the developer docs.
+//
+// Which networks to suggest is not decided here: `config.ts` passes the networks that currently pass its checks, which follow the
+// deployment records and the configured relay hosts, never prose.
+
+/** " Switch to testnet." (or "testnet or mainnet"), or nothing where no other network can be used. */
+function switchHint(others: readonly string[]): string {
+  return others.length ? ` Switch to ${others.join(' or ')}.` : ''
+}
+
+/** The network is not one Walrus storage is offered on (no recorded deployment, or no Walrus there): not a fault. */
+export function notAvailableOn(net: string, others: readonly string[]): string {
+  return `Walrus storage is not available on ${net}.${switchHint(others)}`
+}
+
+/** The network is offered but this site cannot serve it right now (a setting the person cannot change). */
+export function notAvailableNow(others: readonly string[]): string {
+  return `Walrus storage is not available here right now. Try again later${others.length ? ` or switch to ${others.join(' or ')}` : ''}.`
+}

package/src/components/WalrusStorageView.vue

@@ -9,7 +9,7 @@ import { WalletGuard } from '@meddleware/wallet-adapter'
 import { AccessGateCta, WalrusUpload, useAccessGate, type WalrusNetwork } from '@meddleware/walrus-storage-kit'
 import type { ExistingCopy } from '@meddleware/walrus-storage-client/flow'
 import { buildExecutor, getSuiClient, useWallet } from '../wallet.js'
-import { accessGate, network, relayHosts, walrusNetwork } from '../config.js'
+import { accessGate, availability, network, relayHosts, walrusNetwork } from '../config.js'
 import { useOwnedBlobs } from '../composables/useOwnedBlobs.js'
 import { useStorageUpload, type UploadResult } from '../composables/useStorageUpload.js'
 import MyBlobs from './MyBlobs.vue'
@@ -97,7 +97,7 @@ function onSettled(): void {
     <h2 id="walrus-title">Walrus storage</h2>
     <UiToolIntro>Upload and manage blobs on Walrus decentralised storage ({{ network }}).</UiToolIntro>
 
-    <UiNotice v-if="!walrusNetwork" type="info" :message="`Walrus storage is not available on ${network}. Switch to testnet or mainnet.`" />
+    <UiNotice v-if="!walrusNetwork" type="info" :message="availability.message ?? ''" />
     <template v-else>
       <AppTabNav v-model="activeTab" :tabs="TABS" id-prefix="walrus" aria-label="Feature tabs" />
 

package/src/composables/useOwnedBlobs.ts

@@ -8,11 +8,13 @@
 // (used after an upload/extend, which can create or mutate on-chain blobs).
 import { ref, shallowRef } from 'vue'
 import type { OwnedBlob } from '@meddleware/walrus-storage-client'
-import { errorMessage } from '@meddleware/web-utils'
 import { getSuiClient } from '../wallet.js'
 import { walrusNetwork } from '../config.js'
 import { walrusClient, walrusLib } from '../walrus.js'
 
+/** What a person reads when the list could not be loaded. */
+export const LOAD_FAILED = 'Your blobs could not be loaded. Check your connection and press Refresh.'
+
 const blobs = shallowRef<OwnedBlob[]>([])
 const currentEpoch = ref(0)
 const loading = ref(false)
@@ -75,7 +77,9 @@ async function load(address: string | null, opts: { force?: boolean } = {}): Pro
     loadedFor.value = key
   } catch (e) {
     if (mine !== latest) return
-    error.value = errorMessage(e)
+    // The page says what the person can do; the technical cause (an RPC or decoding error) goes to the console.
+    console.error('walrus-storage-ui: could not load the owned blobs', e)
+    error.value = LOAD_FAILED
   } finally {
     if (mine === latest) {
       loading.value = false

package/src/composables/useStorageUpload.ts

@@ -14,7 +14,7 @@ import {
   type ExistingCopy,
   type UploadProgress,
 } from '@meddleware/walrus-storage-client/flow'
-import { network, relayHosts, uploadRelayMaxTipMist, walrusNetwork } from '../config.js'
+import { availability, relayHosts, uploadRelayMaxTipMist, walrusNetwork } from '../config.js'
 import { buildExecutor, getSuiClient, useWallet } from '../wallet.js'
 import { walrusClient, walrusLib, walrusWasmUrl } from '../walrus.js'
 
@@ -59,7 +59,7 @@ export function useStorageUpload(gate: () => AccessGateState) {
   async function performUpload(bytes: Uint8Array, opts: UploadOptions): Promise<UploadResult> {
     if (!account.value) throw new Error('Connect your wallet first.')
     const net = walrusNetwork.value
-    if (!net) throw new Error(`Walrus storage is not available on ${network.value}.`)
+    if (!net) throw new Error(availability.value.message ?? 'Walrus storage is not available here.')
     const executor = await buildExecutor()
     const address = account.value.address
     const access = accessFor({

package/src/config.ts

@@ -1,15 +1,22 @@
 // Configuration. The network is wallet-adapter's shared runtime selector (the standalone build
-// selects VITE_NETWORK in main.ts; embedded, the host's selector rules). Operator settings are
+// selects VITE_NETWORK in main.ts; embedded, the host's selector rules). Deployment settings are
 // build-time VITE_* per network: relay hostnames default to the public Mysten relay (set
-// VITE_WALRUS_RELAY_* to your operator relay to collect the tip); the access gate is optional
+// VITE_WALRUS_RELAY_* to the Meddleware relay to collect the tip); the access gate is optional
 // (unset ⇒ ungated), and its package + PlatformConfig come from the published deployment; the
 // purchase price and payees are read from the chain, never configured.
-import { computed } from 'vue'
+//
+// A configuration fault is shown to a person as a plain "not available" (`./availability.js`); the technical cause (which variable)
+// is logged to the console for the developer (D117). Which networks are offered follows the deployment records and the configured
+// relay hosts, never prose.
+import { computed, watch } from 'vue'
 import type { WalrusNetwork, RelayGateConfig } from '@meddleware/walrus-storage-kit'
-import { PUBLIC_WALRUS_RELAY_HOSTS, relayGateConfig } from '@meddleware/walrus-storage-kit'
+import { PUBLIC_WALRUS_RELAY_HOSTS, relayGateConfig, requireHttpsHost } from '@meddleware/walrus-storage-kit'
+import { accessGateDeployment } from '@meddleware/access-gate-client/deployments'
+import { isValidSuiObjectId } from '@mysten/sui/utils'
 import { useNetwork } from '@meddleware/wallet-adapter'
 import { withRuntimeEnv } from '@meddleware/ui'
 import { errorMessage } from '@meddleware/web-utils'
+import { notAvailableNow, notAvailableOn } from './availability.js'
 
 /** Build-time env bag. Injectable on the env-reading helpers below purely so unit tests can exercise
  *  each branch without depending on Vite's (frozen) `import.meta.env` inlining. */
@@ -21,25 +28,96 @@ const env: EnvSource = withRuntimeEnv((import.meta as unknown as { env?: EnvSour
 /** The active network (read-only ref). */
 export const network = useNetwork().network
 
-/** The active network as a Walrus network, or null where Walrus has none (e.g. localnet). */
-export const walrusNetwork = computed<WalrusNetwork | null>(() =>
-  network.value === 'testnet' || network.value === 'mainnet' ? network.value : null,
-)
+/** The Walrus networks this app can be built for (Walrus runs on these two; localnet has none). */
+const WALRUS_NETWORKS: readonly WalrusNetwork[] = ['testnet', 'mainnet']
+
+/** The Meddleware relay host for a network (env → public fallback). */
+function relayHostFor(net: WalrusNetwork, envSource: EnvSource): string {
+  return (net === 'mainnet' ? envSource.VITE_WALRUS_RELAY_MAINNET : envSource.VITE_WALRUS_RELAY_TESTNET) || PUBLIC_WALRUS_RELAY_HOSTS[net]
+}
 
-/** Operator relay host per network (env → public fallback). */
+/** Meddleware relay host per network (env → public fallback). */
 export const OPERATOR_RELAY_HOSTS: Record<WalrusNetwork, string> = {
-  testnet: env.VITE_WALRUS_RELAY_TESTNET || PUBLIC_WALRUS_RELAY_HOSTS.testnet,
-  mainnet: env.VITE_WALRUS_RELAY_MAINNET || PUBLIC_WALRUS_RELAY_HOSTS.mainnet,
+  testnet: relayHostFor('testnet', env),
+  mainnet: relayHostFor('mainnet', env),
 }
 
-/** The operator/public host pair for `useWalrusRelay`. */
+/** The Meddleware/public host pair for `useWalrusRelay` (its `operator` key is the library's name for the Meddleware relay). */
 export function relayHosts(network: WalrusNetwork): { operator: string; public: string } {
   return { operator: OPERATOR_RELAY_HOSTS[network], public: PUBLIC_WALRUS_RELAY_HOSTS[network] }
 }
 
+/** Whether Walrus storage can be used on a network, and what to tell a person when it cannot. */
+export interface Availability {
+  /** True when the network is offered and its settings are usable. */
+  usable: boolean
+  /** Plain words for a person when `usable` is false; null otherwise. */
+  message: string | null
+  /** The technical cause (which setting or record), for the console; null when there is none. */
+  cause: string | null
+}
+
+/**
+ * The state of a network, before any message is written (pure; `envSource` is injectable for tests).
+ * `offered: false` is "it is not offered there" (localnet; a gate configured on a network with no recorded `access_gate`
+ * deployment, which could not be honoured); `offered: true` with a `cause` is a setting this site cannot serve.
+ */
+function inspect(net: string, envSource: EnvSource): { offered: boolean; cause: string | null } {
+  if (net !== 'testnet' && net !== 'mainnet') return { offered: false, cause: null }
+  const NET = net.toUpperCase()
+  const gateId = envSource[`VITE_ACCESS_GATE_ID_${NET}`]
+  if (gateId) {
+    try {
+      accessGateDeployment(net)
+    } catch {
+      // A gate cannot be honoured without the published package: serving the network ungated would silently skip the pass.
+      return { offered: false, cause: `VITE_ACCESS_GATE_ID_${NET} is set but no access_gate deployment is recorded for ${net}` }
+    }
+    if (!isValidSuiObjectId(gateId)) {
+      return { offered: true, cause: `VITE_ACCESS_GATE_ID_${NET} is not a Sui object id: "${gateId}"` }
+    }
+  }
+  try {
+    requireHttpsHost(relayHostFor(net, envSource), `VITE_WALRUS_RELAY_${NET}`)
+  } catch (e) {
+    return { offered: true, cause: errorMessage(e) }
+  }
+  return { offered: true, cause: null }
+}
+
+/** Availability of Walrus storage on `net` (pure; the networks suggested to switch to are the ones that pass the same checks). */
+export function availabilityOf(net: string, envSource: EnvSource = env): Availability {
+  const own = inspect(net, envSource)
+  if (own.offered && own.cause === null) return { usable: true, message: null, cause: null }
+  const others = WALRUS_NETWORKS.filter((n) => {
+    if (n === net) return false
+    const o = inspect(n, envSource)
+    return o.offered && o.cause === null
+  })
+  return { usable: false, message: own.offered ? notAvailableNow(others) : notAvailableOn(net, others), cause: own.cause }
+}
+
+/** Availability on the active network. */
+export const availability = computed(() => availabilityOf(network.value))
+
+/** The active network as a Walrus network, or null where Walrus storage cannot be used (localnet, or a network this site cannot serve). */
+export const walrusNetwork = computed<WalrusNetwork | null>(() => (availability.value.usable ? (network.value as WalrusNetwork) : null))
+
+// A configuration fault is told to the developer once per cause (a person sees only "not available").
+const reported = new Set<string>()
+watch(
+  availability,
+  (a) => {
+    if (!a.cause || reported.has(a.cause)) return
+    reported.add(a.cause)
+    console.error(`walrus-storage-ui: Walrus storage is unavailable on ${network.value} (${a.cause})`)
+  },
+  { immediate: true },
+)
+
 /**
  * Default relay tip ceiling (MIST) when `VITE_UPLOAD_RELAY_MAX_TIP_MIST` is unset: 0.005 SUI, the
- * workspace-wide ceiling (~8× the operator relay's worst-case tip at the 100 MiB edge cap).
+ * workspace-wide ceiling (~8× the Meddleware relay's worst-case tip at the 100 MiB edge cap).
  */
 export const DEFAULT_UPLOAD_RELAY_MAX_TIP_MIST = 5_000_000
 
@@ -54,7 +132,7 @@ export function uploadRelayMaxTipMist(envSource: EnvSource = env): number {
 }
 
 /**
- * The optional NFT access gate for a network: the operator supplies only the Gate id and soulbound
+ * The optional NFT access gate for a network: the deployment supplies only the Gate id and soulbound
  * flag (`VITE_ACCESS_GATE_*_{NET}`); `relayGateConfig` fixes the package and `PlatformConfig` to the
  * published deployment (commission enforcement), and the price is read from the gate on the chain.
  * `null` — an ungated

package/src/main.ts

@@ -3,13 +3,11 @@ import '@meddleware/design-tokens/seasons.css'
 import '@meddleware/ui/reset.css'
 import { createApp } from 'vue'
 import { loadRuntimeConfig, useSeason } from '@meddleware/ui'
-import { useNetwork } from '@meddleware/wallet-adapter'
+import { selectBuiltNetwork } from '@meddleware/wallet-adapter'
 
 // The standalone build targets one network; select it in the shared selector so the client, the
 // relay, the gate and the stored resume keys all agree. (Embedded, the host's selector rules.)
-const env = (import.meta as unknown as { env?: Record<string, string | undefined> }).env ?? {}
-const built = env.VITE_NETWORK || 'testnet'
-if (built === 'testnet' || built === 'mainnet') useNetwork().setNetwork(built)
+selectBuiltNetwork(import.meta.env.VITE_NETWORK || 'testnet')
 
 useSeason()
 // Machine-zone endpoints (the indexer, the Walrus relays) come from /runtime-config.json when the deployment

package/tsconfig.json

@@ -1,18 +1,4 @@
 {
-  "compilerOptions": {
-    "target": "ESNext",
-    "module": "ESNext",
-    "moduleResolution": "Bundler",
-    "lib": ["ESNext", "DOM", "DOM.Iterable"],
-    "strict": true,
-    "esModuleInterop": true,
-    "skipLibCheck": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "verbatimModuleSyntax": true,
-    "jsx": "preserve",
-    "types": ["node"],
-    "noEmit": true
-  },
+  "extends": "@meddleware/frontend-config/tsconfig/vue-app.json",
   "include": ["src/**/*.ts", "src/**/*.vue", "src/**/*.d.ts", "vite.config.ts", "playwright.config.ts", "e2e/**/*.ts"]
 }

package/vite.config.ts

@@ -1,19 +1,14 @@
-import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
-import { assertE2eOnlyInE2eMode, themeInit, viteTarget } from '@meddleware/frontend-config/vite'
+import { defineConfig } from 'vite'
+import { meddlewareApp } from '@meddleware/frontend-config/vite'
 
-// design-tokens and ui resolve from node_modules (published packages).
-// @mysten/walrus is excluded from dep-optimization so its wasm `?url` import resolves.
-export default defineConfig(({ mode }) => {
-  // The end-to-end build (`--mode e2e`) includes a mock wallet; nothing else may.
-  assertE2eOnlyInE2eMode(mode)
-  return {
-    build: { target: viteTarget() },
-    plugins: [vue(), themeInit({ default: 'dark' })],
-    optimizeDeps: {
-      // @meddleware/wallet-adapter ships TS + .vue source and holds the shared wallet singleton; if it
-      // were pre-bundled, its .vue files (served raw) would load a second copy of the singleton in dev.
-      exclude: ['@mysten/walrus', '@mysten/walrus-wasm', '@meddleware/wallet-adapter'],
-    },
-  }
-})
+// design-tokens and ui resolve from node_modules (published packages). meddlewareApp refuses VITE_E2E outside the e2e mode and keeps
+// @meddleware/wallet-adapter (the shared wallet singleton) out of pre-bundling. @mysten/walrus and its wasm are excluded too, so the
+// wasm `?url` import resolves.
+export default defineConfig(
+  meddlewareApp({
+    plugins: [vue()],
+    name: 'Walrus Assets',
+    config: { optimizeDeps: { exclude: ['@mysten/walrus', '@mysten/walrus-wasm'] } },
+  }),
+)