Merge remote-tracking branch 'gitea-ai/gsd/phase-13-aiui-functional-conversational-node-control-and-content-surf'

neode-ui/src/api/__tests__/filebrowserStreamUrl.test.ts

@@ -0,0 +1,98 @@
+/**
+ * Regression pin for T-13-39 — `streamUrl` used to append `?auth=<jwt>` to
+ * the raw-file URL, leaking the filebrowser JWT into browser history,
+ * `Referer` headers and access logs. 13-CONTEXT.md names this "the known
+ * leak to fix rather than propagate"; this file pins the fix so it cannot
+ * silently regress.
+ */
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+
+const mockFetch = vi.fn()
+vi.stubGlobal('fetch', mockFetch)
+
+// FileBrowserClient reads window.location.origin in its constructor.
+Object.defineProperty(window, 'location', {
+  value: { origin: 'http://localhost', protocol: 'http:', hostname: 'localhost', pathname: '/app/filebrowser' },
+  writable: true,
+})
+
+const { fileBrowserClient } = await import('../filebrowser-client')
+
+function jsonResponse(body: unknown, status = 200): Response {
+  return {
+    ok: status >= 200 && status < 300,
+    status,
+    statusText: status === 200 ? 'OK' : 'Error',
+    json: () => Promise.resolve(body),
+    text: () => Promise.resolve(typeof body === 'string' ? body : JSON.stringify(body)),
+    blob: () => Promise.resolve(new Blob([JSON.stringify(body)])),
+    headers: new Headers({ 'content-type': 'application/json' }),
+    redirected: false,
+    type: 'basic' as ResponseType,
+    url: '',
+    clone: () => jsonResponse(body, status),
+    body: null,
+    bodyUsed: false,
+    arrayBuffer: () => Promise.resolve(new ArrayBuffer(0)),
+    formData: () => Promise.resolve(new FormData()),
+    bytes: () => Promise.resolve(new Uint8Array()),
+  }
+}
+
+describe('FileBrowserClient.streamUrl', () => {
+  beforeEach(() => {
+    mockFetch.mockReset()
+    ;(fileBrowserClient as unknown as { _authenticated: boolean })._authenticated = false
+    document.cookie = 'auth=; expires=Thu, 01 Jan 1970 00:00:00 GMT'
+  })
+
+  it('resolves to a same-origin raw-file URL with no query component', async () => {
+    mockFetch.mockResolvedValueOnce(jsonResponse({ result: { token: 'super-secret-jwt-token' } }))
+
+    const url = await fileBrowserClient.streamUrl('/Music/song.m4a')
+
+    expect(url).toBe('http://localhost/app/filebrowser/api/raw/Music/song.m4a')
+    expect(url).not.toContain('?')
+  })
+
+  it('never embeds the filebrowser JWT anywhere in the returned string', async () => {
+    const token = 'super-secret-jwt-token-value-12345'
+    mockFetch.mockResolvedValueOnce(jsonResponse({ result: { token } }))
+
+    const url = await fileBrowserClient.streamUrl('/Videos/movie.mp4')
+
+    expect(url).not.toContain(token)
+    expect(url).not.toMatch(/[?&]auth=/)
+  })
+
+  it('awaits authentication (sets the cookie the media request relies on) before returning', async () => {
+    mockFetch.mockResolvedValueOnce(jsonResponse({ result: { token: 'jwt-abc' } }))
+
+    await fileBrowserClient.streamUrl('/Videos/movie.mp4')
+
+    // The cookie login() sets is what the same-origin media request depends
+    // on now that the URL itself carries no credential — assert it's really
+    // there by the time the caller has the URL in hand.
+    expect(document.cookie).toContain('auth=jwt-abc')
+  })
+
+  it('does not re-authenticate when a valid session already exists', async () => {
+    ;(fileBrowserClient as unknown as { _authenticated: boolean })._authenticated = true
+    document.cookie = 'auth=already-authed'
+
+    const url = await fileBrowserClient.streamUrl('/a.mp3')
+
+    expect(mockFetch).not.toHaveBeenCalled()
+    expect(url).toBe('http://localhost/app/filebrowser/api/raw/a.mp3')
+  })
+
+  it('still resolves traversal via sanitizePath — a path cannot escape root', async () => {
+    ;(fileBrowserClient as unknown as { _authenticated: boolean })._authenticated = true
+    document.cookie = 'auth=already-authed'
+
+    const url = await fileBrowserClient.streamUrl('/Music/../../etc/passwd')
+
+    expect(url).toBe('http://localhost/app/filebrowser/api/raw/etc/passwd')
+    expect(url).not.toContain('..')
+  })
+})

neode-ui/src/api/filebrowser-client.ts

@@ -165,15 +165,25 @@ class FileBrowserClient {
   }
 
   /**
-   * Get a direct streaming URL with auth token in query string.
-   * Use for video/audio <src> where browser needs to stream (range requests).
-   * The token is a short-lived JWT so exposure in URL is acceptable.
+   * Get a direct streaming URL for video/audio `<src>` where the browser
+   * needs to make Range requests.
+   *
+   * Carries NO credential in the query string (T-13-39, fixed 2026-08-03 —
+   * this was "the known leak to fix rather than propagate", per
+   * 13-CONTEXT.md). `login()` already sets the filebrowser JWT as a
+   * `path=/` cookie on this page's own origin, `baseUrl` is that same
+   * origin, and the browser attaches the cookie to the same-origin media
+   * subresource request automatically — the same mechanism filebrowser's
+   * own web UI relies on. Putting the token in the URL too was redundant,
+   * and it reached browser history, `Referer` headers and any access log on
+   * the path. The cookie itself is unchanged by this fix: it is still a
+   * 24-hour JWT, now confined to the cookie jar rather than also appearing
+   * in the URL.
    */
   async streamUrl(path: string): Promise<string> {
     await this.ensureAuth()
-    const token = this.getAuthCookie()
     const safePath = sanitizePath(path)
-    return `${this.baseUrl}/api/raw${safePath}?auth=${token}`
+    return `${this.baseUrl}/api/raw${safePath}`
   }
 
   /**

neode-ui/src/components/SpotlightSearch.vue

@@ -73,9 +73,40 @@
                   <span class="text-xs text-white/40">{{ item.section }}</span>
                 </button>
               </div>
-              <div v-else class="p-8 text-center text-white/50">
+              <div v-else class="px-8 pt-8 pb-2 text-center text-white/50">
                 No results for "{{ query }}"
               </div>
+
+              <!-- Hand the typed text to AIUI. Always offered while there is a
+                   query — it is the whole point when nothing matched, and a
+                   useful escape hatch when something did. -->
+              <div class="p-2" :class="filteredItems.length > 0 ? 'border-t border-white/10' : ''">
+                <button
+                  type="button"
+                  class="group w-full flex items-center gap-3 px-3 py-2.5 rounded-lg text-left transition-colors"
+                  :class="getItemClass(askAiuiIndex)"
+                  @click="askAiui()"
+                >
+                  <span
+                    class="relative shrink-0 flex items-center justify-center w-9 h-9 rounded-lg overflow-hidden
+                           bg-gradient-to-br from-blue-500/30 via-sky-400/15 to-transparent border border-blue-400/30"
+                  >
+                    <span class="absolute inset-0 transition-colors group-hover:bg-blue-400/10"></span>
+                    <svg
+                      class="relative w-[18px] h-[18px] text-blue-300"
+                      fill="none" stroke="currentColor" stroke-width="1.8" viewBox="0 0 24 24" aria-hidden="true"
+                    >
+                      <path stroke-linecap="round" stroke-linejoin="round" d="M20.5 11.5a8 8 0 01-11.9 6.97L4 19.5l1.06-4.3A8 8 0 1120.5 11.5z" />
+                      <path stroke-linecap="round" stroke-linejoin="round" d="M12.2 8.4l.78 2.02 2.02.78-2.02.78-.78 2.02-.78-2.02-2.02-.78 2.02-.78z" />
+                    </svg>
+                  </span>
+                  <span class="min-w-0 flex-1">
+                    <span class="block text-white/90">Talk to AIUI about it</span>
+                    <span class="block text-xs text-white/40 truncate">“{{ query.trim() }}”</span>
+                  </span>
+                  <kbd class="hidden sm:inline-flex px-2 py-1 text-xs text-white/50 bg-white/10 rounded shrink-0">↵</kbd>
+                </button>
+              </div>
             </template>
             <template v-else>
               <!-- Help tree when no search -->
@@ -157,8 +188,13 @@ const recentOffset = computed(() =>
   !query.value.trim() && spotlightStore.recentItems.length > 0 ? spotlightStore.recentItems.length : 0
 )
 
+// "Talk to AIUI about it" is appended after the matches, so it is the last
+// selectable row whenever there is a query (including the zero-match case,
+// where it is the only one).
+const askAiuiIndex = computed(() => filteredItems.value.length)
+
 const selectableCount = computed(() => {
-  if (query.value.trim()) return filteredItems.value.length
+  if (query.value.trim()) return filteredItems.value.length + 1
   return recentOffset.value + allSearchableItems.value.length
 })
 
@@ -247,6 +283,17 @@ function selectItem(item: SearchableItem) {
   }
 }
 
+// Hand the raw typed text to AIUI instead of trying to match it to a screen.
+// The nonce is what makes re-asking the identical question work: without a
+// changing query the router treats the push as a no-op and Chat.vue never sees
+// a new `ask` to forward.
+function askAiui() {
+  const text = query.value.trim()
+  if (!text) return
+  spotlightStore.close()
+  router.push({ path: '/dashboard/chat', query: { ask: text, askedAt: String(Date.now()) } })
+}
+
 function selectHelpItem(section: { id: string }, item: { id: string; label: string; path?: string; content?: string; relatedPath?: string }) {
   const type = section.id === 'navigate' ? 'navigate' : section.id === 'learn' ? 'learn' : 'action'
   spotlightStore.addRecentItem({
@@ -315,6 +362,7 @@ function onInputKeydown(e: KeyboardEvent) {
     e.preventDefault()
     const idx = spotlightStore.selectedIndex
     if (query.value.trim()) {
+      if (idx === askAiuiIndex.value) { askAiui(); return }
       const item = filteredItems.value[idx]
       if (item) selectItem(item)
       return

neode-ui/src/components/ToolConfirmModal.vue

@@ -0,0 +1,134 @@
+<template>
+  <Teleport to="body">
+    <Transition name="modal">
+      <div
+        v-if="show"
+        data-testid="tool-confirm-overlay"
+        class="fixed inset-0 z-[3000] flex items-center justify-center p-4"
+        @click="dismiss"
+      >
+        <div
+          data-testid="tool-confirm-backdrop"
+          class="absolute inset-0 bg-black/60 backdrop-blur-sm"
+        ></div>
+        <div ref="modalRef" @click.stop class="glass-card p-6 max-w-md w-full relative z-10">
+          <div class="flex items-start justify-between gap-4 mb-4">
+            <h3 class="text-xl font-semibold text-white">Approve this action?</h3>
+            <button
+              @click="dismiss"
+              class="p-2 rounded-lg hover:bg-white/10 text-white/70 hover:text-white transition-colors"
+              aria-label="Close"
+            >
+              <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
+                  d="M6 18L18 6M6 6l12 12"
+                />
+              </svg>
+            </button>
+          </div>
+
+          <!--
+            The description is node-authored: fetched by the host page over
+            its own authenticated RPC session (assistant.pending), never
+            received from the AIUI iframe and never model text. Plain
+            interpolation only — peer-influenced argument values must render
+            as inert text, so the raw-HTML directive is banned in this file.
+            There is deliberately NO code path in this component that reads
+            from the frame's message channel.
+          -->
+          <div class="bg-black/20 rounded-xl border border-white/10 p-4 mb-4">
+            <p class="text-white text-sm leading-relaxed whitespace-pre-wrap">{{ description }}</p>
+          </div>
+
+          <p class="text-white/40 text-xs mb-4">
+            The assistant asked to do this. Nothing happens unless you approve — closing this
+            window decides nothing, and the request expires on its own.
+          </p>
+
+          <div class="flex gap-3">
+            <button
+              data-testid="tool-confirm-deny"
+              @click="deny"
+              class="glass-button flex-1 py-2.5 rounded-lg text-sm font-medium"
+            >
+              Deny
+            </button>
+            <button
+              data-testid="tool-confirm-approve"
+              @click="approve"
+              class="glass-button flex-1 py-2.5 rounded-lg text-sm font-medium text-orange-400 border-orange-400/30"
+            >
+              Approve
+            </button>
+          </div>
+        </div>
+      </div>
+    </Transition>
+  </Teleport>
+</template>
+
+<script setup lang="ts">
+import { ref, computed } from 'vue'
+import { useModalKeyboard } from '@/composables/useModalKeyboard'
+
+const props = defineProps<{
+  show: boolean
+  description: string
+}>()
+
+const emit = defineEmits<{
+  approve: []
+  deny: []
+  /** Closed without a decision: nothing is sent anywhere — the node's own
+   * timeout declines the pending action. Never treated as an approval. */
+  dismiss: []
+}>()
+
+const modalRef = ref<HTMLElement | null>(null)
+
+useModalKeyboard(
+  modalRef,
+  computed(() => props.show),
+  () => emit('dismiss'),
+)
+
+function approve() {
+  emit('approve')
+}
+
+function deny() {
+  emit('deny')
+}
+
+function dismiss() {
+  emit('dismiss')
+}
+</script>
+
+<style scoped>
+.modal-enter-active,
+.modal-leave-active {
+  transition: opacity 0.3s ease;
+}
+
+.modal-enter-from,
+.modal-leave-to {
+  opacity: 0;
+}
+
+.modal-enter-active .glass-card,
+.modal-leave-active .glass-card {
+  transition: transform 0.3s ease;
+}
+
+.modal-enter-from .glass-card {
+  transform: scale(0.95);
+}
+
+.modal-leave-to .glass-card {
+  transform: scale(0.95);
+}
+</style>

neode-ui/src/components/cloud/ShareModal.vue

@@ -161,6 +161,57 @@
   </Teleport>
 </template>
 
+<script lang="ts">
+/**
+ * Extension → MIME map used when sharing a file that isn't already in the
+ * catalog (`save()` below, `content.add`). Historically listed exactly four
+ * audio extensions (`mp3`/`flac`/`ogg`/`wav`) and left `m4a`/`aac`/`opus`/
+ * `wma` to fall through to the generic `application/octet-stream` fallback
+ * — those four then never routed to the global audio player (which decides
+ * purely on `mime.startsWith('audio/')`, see `usePaidItemViewer.ts`) and
+ * auto-filed to Documents instead of Music (`content.rs`'s paid-download
+ * auto-filing, same `starts_with("audio/")` check) — 13-CONTEXT.md's
+ * landmine, T-13-72. This fix adds the four missing entries; it does not
+ * change the fallback strategy and does not guess at unknown extensions.
+ *
+ * Kept in sync with two other maps that must agree on every audio
+ * extension (13-11 Task 2's own acceptance criterion):
+ * - `archyContentAdapter.ts`'s `classifyByMime`/`AUDIO_EXT_FALLBACK` (13-06)
+ * - `content.rs`'s auto-filing check (`mime_type.starts_with("audio/")`) —
+ *   that check is prefix-only, so any correct `audio/*` value here already
+ *   agrees with it; the specific `audio/*` strings below are chosen to
+ *   match `classifyByMime`'s own test fixtures exactly, so a byte-for-byte
+ *   MIME string never diverges between the two even though the node-side
+ *   check itself only cares about the prefix.
+ *
+ * Module-scope (not a local const inside `save()`) and exported so it is a
+ * table `archyContentAdapter.test.ts`-style fixture tests can pin directly,
+ * per this task's own `read_first` guidance to follow
+ * `useFileType.test.ts`'s fixture-table convention.
+ */
+export const SHARE_MIME_MAP: Record<string, string> = {
+  jpg: 'image/jpeg',
+  jpeg: 'image/jpeg',
+  png: 'image/png',
+  gif: 'image/gif',
+  webp: 'image/webp',
+  mp4: 'video/mp4',
+  webm: 'video/webm',
+  mkv: 'video/x-matroska',
+  mp3: 'audio/mpeg',
+  flac: 'audio/flac',
+  ogg: 'audio/ogg',
+  wav: 'audio/wav',
+  m4a: 'audio/mp4',
+  aac: 'audio/aac',
+  opus: 'audio/opus',
+  wma: 'audio/x-ms-wma',
+  pdf: 'application/pdf',
+  zip: 'application/zip',
+  txt: 'text/plain',
+}
+</script>
+
 <script setup lang="ts">
 import { ref, onMounted } from 'vue'
 import { rpcClient } from '@/api/rpc-client'
@@ -352,17 +403,11 @@ async function save() {
       // Add if not in catalog
       if (!itemId) {
         const ext = props.filename.split('.').pop()?.toLowerCase() || ''
-        const mimeMap: Record<string, string> = {
-          jpg: 'image/jpeg', jpeg: 'image/jpeg', png: 'image/png', gif: 'image/gif',
-          webp: 'image/webp', mp4: 'video/mp4', webm: 'video/webm', mkv: 'video/x-matroska',
-          mp3: 'audio/mpeg', flac: 'audio/flac', ogg: 'audio/ogg', wav: 'audio/wav',
-          pdf: 'application/pdf', zip: 'application/zip', txt: 'text/plain',
-        }
         const addRes = await rpcClient.call<{ item: { id: string } }>({
           method: 'content.add',
           params: {
             filename: (props.filepath || props.filename).replace(/^\/+/, ''),
-            mime_type: mimeMap[ext] || 'application/octet-stream',
+            mime_type: SHARE_MIME_MAP[ext] || 'application/octet-stream',
             description: '',
           },
         })

neode-ui/src/components/cloud/__tests__/ShareModal.test.ts

@@ -0,0 +1,73 @@
+import { describe, it, expect } from 'vitest'
+import { SHARE_MIME_MAP } from '../ShareModal.vue'
+
+// 13-11 Task 2: ShareModal.vue's extension-to-MIME map historically listed
+// exactly four audio extensions (mp3/flac/ogg/wav) and left
+// m4a/aac/opus/wma to fall through to `application/octet-stream` — those
+// four never routed to the global audio player and auto-filed to Documents
+// instead of Music. This pins all eight audio extensions plus the existing
+// non-audio entries, following useFileType.test.ts's fixture-table
+// convention.
+
+describe('ShareModal SHARE_MIME_MAP', () => {
+  it.each([
+    ['mp3', 'audio/mpeg'],
+    ['flac', 'audio/flac'],
+    ['ogg', 'audio/ogg'],
+    ['wav', 'audio/wav'],
+    ['m4a', 'audio/mp4'],
+    ['aac', 'audio/aac'],
+    ['opus', 'audio/opus'],
+    ['wma', 'audio/x-ms-wma'],
+  ])('maps .%s to the audio MIME %s', (ext, expected) => {
+    expect(SHARE_MIME_MAP[ext]).toBe(expected)
+  })
+
+  it('every one of the eight audio extensions maps to a real audio/* MIME (not application/octet-stream)', () => {
+    const audioExts = ['mp3', 'flac', 'ogg', 'wav', 'm4a', 'aac', 'opus', 'wma']
+    for (const ext of audioExts) {
+      const mime = SHARE_MIME_MAP[ext]
+      expect(mime).toBeDefined()
+      expect(mime!.startsWith('audio/')).toBe(true)
+    }
+  })
+
+  it('existing non-audio entries are unchanged', () => {
+    expect(SHARE_MIME_MAP.jpg).toBe('image/jpeg')
+    expect(SHARE_MIME_MAP.mp4).toBe('video/mp4')
+    expect(SHARE_MIME_MAP.pdf).toBe('application/pdf')
+    expect(SHARE_MIME_MAP.zip).toBe('application/zip')
+    expect(SHARE_MIME_MAP.txt).toBe('text/plain')
+  })
+
+  it('an unknown extension is absent from the map — the fix adds coverage, it does not guess', () => {
+    expect(SHARE_MIME_MAP.xyz123).toBeUndefined()
+  })
+
+  it('agrees with archyContentAdapter.ts\'s classifyByMime on all eight audio extensions', async () => {
+    const { classifyByMime } = await import('../../../composables/archyContentAdapter')
+    const audioExts = ['mp3', 'flac', 'ogg', 'wav', 'm4a', 'aac', 'opus', 'wma']
+    for (const ext of audioExts) {
+      const mime = SHARE_MIME_MAP[ext]!
+      expect(classifyByMime({ mime_type: mime, filename: `track.${ext}` })).toBe('audio')
+    }
+  })
+})
+
+describe('an audio MIME never opens the lightbox', () => {
+  it('usePaidItemViewer routes every audio/* mime to the global player before its image/video lightbox branch is ever reached', () => {
+    // usePaidItemViewer.ts's routing order is: audio -> global bottom-bar
+    // player (return); image/video -> lightbox (return); anything else ->
+    // browser-tab fallback. The audio branch is checked FIRST and always
+    // returns, so no audio/* mime can ever reach the lightbox branch —
+    // pinned here structurally (mirrors the real predicate, avoids a heavy
+    // component mount) rather than re-implementing usePaidItemViewer's
+    // async RPC/blob flow in a unit test.
+    const audioExts = ['mp3', 'flac', 'ogg', 'wav', 'm4a', 'aac', 'opus', 'wma']
+    for (const ext of audioExts) {
+      const mime = SHARE_MIME_MAP[ext]!
+      const routesToAudioPlayerFirst = mime.startsWith('audio/')
+      expect(routesToAudioPlayerFirst).toBe(true)
+    }
+  })
+})

neode-ui/src/composables/__tests__/archyContentAdapter.test.ts

@@ -0,0 +1,448 @@
+import { describe, it, expect } from 'vitest'
+import {
+  adaptContentItems,
+  adaptToFilm,
+  adaptToPodcast,
+  adaptLibraryTracks,
+  adaptLibraryAlbums,
+  classifyByMime,
+  sortDeterministic,
+  type ArchyContentItem,
+  type ArchyLibraryTrack,
+} from '../archyContentAdapter'
+
+function item(overrides: Partial<ArchyContentItem>): ArchyContentItem {
+  return {
+    id: 'id-1',
+    filename: 'file.bin',
+    mime_type: 'application/octet-stream',
+    size_bytes: 1024,
+    ...overrides,
+  }
+}
+
+describe('classifyByMime', () => {
+  it('classifies a video mime as video', () => {
+    expect(classifyByMime(item({ mime_type: 'video/mp4', filename: 'movie.mp4' }))).toBe('video')
+  })
+
+  it('classifies an audio mime as audio', () => {
+    expect(classifyByMime(item({ mime_type: 'audio/mpeg', filename: 'song.mp3' }))).toBe('audio')
+  })
+
+  it('classifies images as image, and still excludes documents', () => {
+    expect(classifyByMime(item({ mime_type: 'image/jpeg', filename: 'photo.jpg' }))).toBe('image')
+    expect(classifyByMime(item({ mime_type: 'application/pdf', filename: 'doc.pdf' }))).toBe('excluded')
+  })
+
+  it('classifies images by extension when the mime is generic', () => {
+    // A node whose catalog is mostly photos shared with an unidentified
+    // mime must not present as empty.
+    expect(classifyByMime(item({ mime_type: 'application/octet-stream', filename: 'p.webp' }))).toBe('image')
+    expect(classifyByMime(item({ mime_type: 'application/octet-stream', filename: 'p.heic' }))).toBe('image')
+  })
+
+  it('classifies m4a, aac, opus and wma as audio via extension fallback (ShareModal blind spot)', () => {
+    expect(classifyByMime(item({ mime_type: 'application/octet-stream', filename: 'track.m4a' }))).toBe('audio')
+    expect(classifyByMime(item({ mime_type: 'application/octet-stream', filename: 'track.aac' }))).toBe('audio')
+    expect(classifyByMime(item({ mime_type: 'application/octet-stream', filename: 'track.opus' }))).toBe('audio')
+    expect(classifyByMime(item({ mime_type: 'application/octet-stream', filename: 'track.wma' }))).toBe('audio')
+  })
+
+  it('also classifies the correct audio/* mime for those four extensions', () => {
+    expect(classifyByMime(item({ mime_type: 'audio/mp4', filename: 'track.m4a' }))).toBe('audio')
+    expect(classifyByMime(item({ mime_type: 'audio/aac', filename: 'track.aac' }))).toBe('audio')
+    expect(classifyByMime(item({ mime_type: 'audio/opus', filename: 'track.opus' }))).toBe('audio')
+    expect(classifyByMime(item({ mime_type: 'audio/x-ms-wma', filename: 'track.wma' }))).toBe('audio')
+  })
+})
+
+describe('adaptContentItems', () => {
+  it('maps a video-mime item to a Film with id carried through and one source entry', () => {
+    const bundle = adaptContentItems(
+      [item({ id: 'film-1', filename: 'The Movie.mp4', mime_type: 'video/mp4', added_at: '2026-01-01T00:00:00Z' })],
+      { source: 'own' },
+    )
+    expect(bundle.films).toHaveLength(1)
+    expect(bundle.films[0]!.id).toBe('film-1')
+    expect(bundle.films[0]!.title).toBe('The Movie')
+    expect(bundle.films[0]!.sources).toHaveLength(1)
+    expect(bundle.songs).toHaveLength(0)
+    expect(bundle.podcasts).toHaveLength(0)
+  })
+
+  it('maps an audio-mime item to a Song', () => {
+    const bundle = adaptContentItems(
+      [item({ id: 'song-1', filename: 'Track.mp3', mime_type: 'audio/mpeg', added_at: '2026-01-01T00:00:00Z' })],
+      { source: 'own' },
+    )
+    expect(bundle.songs).toHaveLength(1)
+    expect(bundle.songs[0]!.id).toBe('song-1')
+    expect(bundle.films).toHaveLength(0)
+  })
+
+  it('routes images to the images bucket and still excludes documents', () => {
+    const bundle = adaptContentItems(
+      [
+        item({ id: 'img-1', filename: 'photo.jpg', mime_type: 'image/jpeg' }),
+        item({ id: 'doc-1', filename: 'report.pdf', mime_type: 'application/pdf' }),
+      ],
+      { source: 'own' },
+    )
+    expect(bundle.films).toHaveLength(0)
+    expect(bundle.songs).toHaveLength(0)
+    expect(bundle.podcasts).toHaveLength(0)
+    // The photo renders; the PDF has no grid, so it stays out of every bucket.
+    expect(bundle.images).toHaveLength(1)
+    expect(bundle.images[0]!.id).toBe('img-1')
+    expect(bundle.images[0]!.url).toBe('/content/img-1')
+  })
+
+  it('never locks an OWN paid image: the node serves the authenticated owner (owner-bypass), price stays as a badge', () => {
+    const bundle = adaptContentItems(
+      [item({ id: 'p-1', filename: 'photo.jpg', mime_type: 'image/jpeg', access: { paid: { price_sats: 100 } } })],
+      { source: 'own' },
+    )
+    expect(bundle.images[0]!.locked).toBe(false)
+    expect(bundle.images[0]!.priceSats).toBe(100)
+    expect(bundle.images[0]!.url).toBe('/content/p-1')
+  })
+
+  it('locks a PEER paid image: price carried, no URL to fetch bytes the user has not bought', () => {
+    const bundle = adaptContentItems(
+      [item({ id: 'p-1', filename: 'photo.jpg', mime_type: 'image/jpeg', access: { paid: { price_sats: 100 } } })],
+      { source: 'peer', peerOnion: 'seller.onion' },
+    )
+    expect(bundle.images[0]!.locked).toBe(true)
+    expect(bundle.images[0]!.priceSats).toBe(100)
+    expect(bundle.images[0]!.url).toBe('')
+  })
+
+  it('maps an access:Paid item with a price and a locked flag, and no playable source URL', () => {
+    const bundle = adaptContentItems(
+      [
+        item({
+          id: 'paid-1',
+          filename: 'premium.mp4',
+          mime_type: 'video/mp4',
+          access: { paid: { price_sats: 5000 } },
+        }),
+      ],
+      { source: 'peer', peerOnion: 'abc123.onion' },
+    )
+    const film = bundle.films[0]!
+    expect(film.locked).toBe(true)
+    expect(film.priceSats).toBe(5000)
+    expect(film.sources[0]!.url).toBe('')
+  })
+
+  it('gives two items with identical filename and size but different id two distinct cards (adjacency)', () => {
+    const bundle = adaptContentItems(
+      [
+        item({ id: 'peer-a', filename: 'same.mp4', mime_type: 'video/mp4', size_bytes: 500, added_at: '2026-01-01T00:00:00Z' }),
+        item({ id: 'peer-b', filename: 'same.mp4', mime_type: 'video/mp4', size_bytes: 500, added_at: '2026-01-01T00:00:00Z' }),
+      ],
+      { source: 'peer', peerOnion: 'peer.onion' },
+    )
+    expect(bundle.films).toHaveLength(2)
+    const ids = bundle.films.map((f) => f.id)
+    expect(new Set(ids).size).toBe(2)
+    expect(ids).toContain('peer-a')
+    expect(ids).toContain('peer-b')
+  })
+
+  it('an item present both in own library and a peer share appears once per source (adjacency, cross-source)', () => {
+    const own = adaptContentItems(
+      [item({ id: 'shared-item', filename: 'clip.mp4', mime_type: 'video/mp4', size_bytes: 100, added_at: '2026-01-01T00:00:00Z' })],
+      { source: 'own' },
+    )
+    const peer = adaptContentItems(
+      [item({ id: 'shared-item', filename: 'clip.mp4', mime_type: 'video/mp4', size_bytes: 100, added_at: '2026-01-01T00:00:00Z' })],
+      { source: 'peer', peerOnion: 'peer.onion' },
+    )
+    // Each source's bundle carries its own single card for the id — the
+    // broker (Task 2) is responsible for not silently merging bundles from
+    // different sources into one deduplicated list.
+    expect(own.films).toHaveLength(1)
+    expect(peer.films).toHaveLength(1)
+    expect(own.films[0]!.sources[0]!.type).not.toBe(peer.films[0]!.sources[0]!.type)
+  })
+
+  it('an empty input array produces empty films/songs/podcasts arrays, not undefined or an error', () => {
+    const bundle = adaptContentItems([], { source: 'own' })
+    expect(bundle).toEqual({ films: [], songs: [], podcasts: [], images: [] })
+  })
+
+  it('handles null/undefined input the same as an empty array', () => {
+    expect(adaptContentItems(null, { source: 'own' })).toEqual({ films: [], songs: [], podcasts: [], images: [] })
+    expect(adaptContentItems(undefined, { source: 'own' })).toEqual({ films: [], songs: [], podcasts: [], images: [] })
+  })
+
+  it('maps a null/absent description to an empty string, never the literal "null"', () => {
+    const withNull = adaptContentItems(
+      [item({ id: 'f1', filename: 'a.mp4', mime_type: 'video/mp4', description: null })],
+      { source: 'own' },
+    )
+    const withAbsent = adaptContentItems(
+      [item({ id: 'f2', filename: 'b.mp4', mime_type: 'video/mp4' })],
+      { source: 'own' },
+    )
+    expect(withNull.films[0]!.synopsis).toBe('')
+    expect(withAbsent.films[0]!.synopsis).toBe('')
+  })
+
+  it('sorts added_at descending with id ascending as the deterministic tiebreak', () => {
+    const bundle = adaptContentItems(
+      [
+        item({ id: 'z', filename: 'a.mp4', mime_type: 'video/mp4', added_at: '2026-01-01T00:00:00Z' }),
+        item({ id: 'a', filename: 'b.mp4', mime_type: 'video/mp4', added_at: '2026-01-01T00:00:00Z' }),
+        item({ id: 'm', filename: 'c.mp4', mime_type: 'video/mp4', added_at: '2026-02-01T00:00:00Z' }),
+      ],
+      { source: 'own' },
+    )
+    // Newest added_at first (m), then the 2026-01-01 pair tie-broken by id ascending (a, z).
+    expect(bundle.films.map((f) => f.id)).toEqual(['m', 'a', 'z'])
+  })
+
+  it('a null added_at sorts last rather than crashing the comparator', () => {
+    const bundle = adaptContentItems(
+      [
+        item({ id: 'has-date', filename: 'a.mp4', mime_type: 'video/mp4', added_at: '2026-01-01T00:00:00Z' }),
+        item({ id: 'no-date', filename: 'b.mp4', mime_type: 'video/mp4', added_at: null }),
+      ],
+      { source: 'own' },
+    )
+    expect(bundle.films.map((f) => f.id)).toEqual(['has-date', 'no-date'])
+  })
+
+  it('produces identical output order regardless of input array order (repeat-call stability)', () => {
+    const items = [
+      item({ id: 'a', filename: 'a.mp4', mime_type: 'video/mp4', added_at: '2026-01-01T00:00:00Z' }),
+      item({ id: 'b', filename: 'b.mp4', mime_type: 'video/mp4', added_at: '2026-02-01T00:00:00Z' }),
+      item({ id: 'c', filename: 'c.mp4', mime_type: 'video/mp4', added_at: '2026-01-15T00:00:00Z' }),
+    ]
+    const first = adaptContentItems(items, { source: 'own' })
+    const second = adaptContentItems([...items].reverse(), { source: 'own' })
+    expect(first.films.map((f) => f.id)).toEqual(second.films.map((f) => f.id))
+  })
+
+  it('never produces a URL carrying a credential as a query parameter', () => {
+    const bundle = adaptContentItems(
+      [
+        item({ id: 'own-1', filename: 'a.mp4', mime_type: 'video/mp4' }),
+        item({ id: 'song-1', filename: 'b.mp3', mime_type: 'audio/mpeg' }),
+      ],
+      { source: 'own' },
+    )
+    const peerBundle = adaptContentItems(
+      [item({ id: 'peer-1', filename: 'c.mp4', mime_type: 'video/mp4' })],
+      { source: 'peer', peerOnion: 'somepeer.onion' },
+    )
+    const allUrls = [
+      ...bundle.films.flatMap((f) => f.sources.map((s) => s.url)),
+      ...bundle.songs.flatMap((s) => (s.sources ?? []).map((src) => src.url)),
+      ...peerBundle.films.flatMap((f) => f.sources.map((s) => s.url)),
+    ]
+    for (const url of allUrls) {
+      expect(url).not.toMatch(/[?&](auth|token)=/)
+    }
+  })
+
+  it('shape-pins every field FilmGrid.vue and SongGrid.vue read', () => {
+    const bundle = adaptContentItems(
+      [
+        item({ id: 'film-shape', filename: 'Shape Test.mp4', mime_type: 'video/mp4', added_at: '2026-01-01T00:00:00Z' }),
+        item({ id: 'song-shape', filename: 'Shape Song.mp3', mime_type: 'audio/mpeg', added_at: '2026-01-01T00:00:00Z' }),
+      ],
+      { source: 'own' },
+    )
+    const film = bundle.films[0]!
+    // FilmGrid.vue reads: id, title, year, director, cast (search/aria-label),
+    // rating, sources[].type (badges), coverSrc()/fallbackSrc() consume
+    // posterUrl/backdropUrl/title/year, genres (topGenres filter).
+    expect(typeof film.id).toBe('string')
+    expect(typeof film.title).toBe('string')
+    expect(typeof film.year).toBe('number')
+    expect(typeof film.director).toBe('string')
+    expect(Array.isArray(film.cast)).toBe(true)
+    expect(typeof film.rating).toBe('number')
+    expect(Array.isArray(film.genres)).toBe(true)
+    expect(Array.isArray(film.sources)).toBe(true)
+    expect(film.sources.length).toBeGreaterThan(0)
+    expect(typeof film.sources[0]!.type).toBe('string')
+
+    const song = bundle.songs[0]!
+    // SongGrid.vue reads: id, title, artist (search/aria-label), album
+    // (search), genres (topGenres), coverUrl, sources[].type (badges).
+    expect(typeof song.id).toBe('string')
+    expect(typeof song.title).toBe('string')
+    expect(typeof song.artist).toBe('string')
+    expect(Array.isArray(song.sources)).toBe(true)
+    expect((song.sources ?? []).length).toBeGreaterThan(0)
+    expect(typeof song.sources![0]!.type).toBe('string')
+  })
+
+  it('pins the three source-badge literal values for own/peer/indeehub films', () => {
+    const own = adaptToFilm(item({ id: 'x', filename: 'x.mp4', mime_type: 'video/mp4' }), { source: 'own' })
+    const peer = adaptToFilm(item({ id: 'y', filename: 'y.mp4', mime_type: 'video/mp4' }), { source: 'peer', peerOnion: 'p.onion' })
+    const indeehub = adaptToFilm(item({ id: 'z', filename: 'z.mp4', mime_type: 'video/mp4' }), { source: 'indeehub' })
+    expect(own.sources[0]!.type).toBe('nextcloud')
+    expect(peer.sources[0]!.type).toBe('plex')
+    expect(indeehub.sources[0]!.type).toBe('indeehub')
+  })
+})
+
+describe('adaptToPodcast', () => {
+  it('maps a ContentItem to a Podcast shape (exported for completeness; not reachable via adaptContentItems today)', () => {
+    const podcast = adaptToPodcast(
+      item({ id: 'pod-1', filename: 'Episode One.mp3', mime_type: 'audio/mpeg', description: 'A description' }),
+      { source: 'own' },
+    )
+    expect(podcast.id).toBe('pod-1')
+    expect(podcast.title).toBe('Episode One')
+    expect(podcast.description).toBe('A description')
+    expect(Array.isArray(podcast.sources)).toBe(true)
+  })
+})
+
+describe('sortDeterministic', () => {
+  it('is a pure function that does not mutate its input', () => {
+    const items = [
+      item({ id: 'b', filename: 'b.mp4', added_at: '2026-01-01T00:00:00Z' }),
+      item({ id: 'a', filename: 'a.mp4', added_at: '2026-02-01T00:00:00Z' }),
+    ]
+    const copy = [...items]
+    sortDeterministic(items)
+    expect(items).toEqual(copy)
+  })
+})
+
+// ─── Library mapping (13-11) ────────────────────────────────────────────
+
+function track(overrides: Partial<ArchyLibraryTrack>): ArchyLibraryTrack {
+  return {
+    id: { source: 'OwnLibrary', path: '/var/lib/archipelago/filebrowser/Music/Artist/Album/01 Song.flac' },
+    title: 'Song',
+    artist: 'Artist',
+    album: 'Album',
+    album_artist: 'Artist',
+    track_number: 1,
+    disc_number: 1,
+    year: 2024,
+    duration_secs: 210,
+    has_tags: true,
+    content_hash: null,
+    ...overrides,
+  }
+}
+
+describe('adaptLibraryTracks', () => {
+  it('maps a music.list-tracks record to a Song with title/artist/album/duration carried through from tags', () => {
+    const [song] = adaptLibraryTracks([
+      track({ title: 'Night Drive', artist: 'The Synths', album: 'Neon', duration_secs: 187 }),
+    ])
+    expect(song!.title).toBe('Night Drive')
+    expect(song!.artist).toBe('The Synths')
+    expect(song!.album).toBe('Neon')
+    expect(song!.duration).toBe(187)
+  })
+
+  it('falls back to album_artist when artist is absent, and to an empty string when both are absent — never null/undefined', () => {
+    const [withAlbumArtist] = adaptLibraryTracks([track({ artist: null, album_artist: 'Various' })])
+    expect(withAlbumArtist!.artist).toBe('Various')
+
+    const [withNeither] = adaptLibraryTracks([track({ artist: null, album_artist: null })])
+    expect(withNeither!.artist).toBe('')
+    expect(withNeither!.artist).not.toBe('null')
+    expect(withNeither!.artist).not.toBeUndefined()
+  })
+
+  it('preserves the index\'s own deterministic order — calling the adapter twice on the same input yields the same order', () => {
+    const tracks = [
+      track({ id: { source: 'OwnLibrary', path: '/a' }, title: 'A' }),
+      track({ id: { source: 'OwnLibrary', path: '/b' }, title: 'B' }),
+      track({ id: { source: 'OwnLibrary', path: '/c' }, title: 'C' }),
+    ]
+    const first = adaptLibraryTracks(tracks).map((s) => s.title)
+    const second = adaptLibraryTracks(tracks).map((s) => s.title)
+    expect(first).toEqual(['A', 'B', 'C'])
+    expect(second).toEqual(first)
+  })
+
+  it('a track with no cover art maps with an absent coverUrl, not a broken-image URL', () => {
+    const [song] = adaptLibraryTracks([track({})])
+    expect(song!.coverUrl).toBeUndefined()
+  })
+
+  it('a peer-sourced track carries a source entry distinguishing it from an own-library track (same three pinned literals)', () => {
+    const [own] = adaptLibraryTracks([track({ id: { source: 'OwnLibrary', path: '/x' } })])
+    const [peer] = adaptLibraryTracks([
+      track({ id: { source: { Peer: { onion: 'abc123.onion' } }, path: '/var/lib/archipelago/purchased-content/abc123.onion/content-1' } }),
+    ])
+    expect(own!.sources![0]!.type).toBe('funkwhale')
+    expect(peer!.sources![0]!.type).toBe('plex')
+    expect(own!.sources![0]!.type).not.toBe(peer!.sources![0]!.type)
+  })
+
+  it('never produces a playback URL carrying a credential as a query parameter', () => {
+    const songs = adaptLibraryTracks([
+      track({ id: { source: 'OwnLibrary', path: '/var/lib/archipelago/filebrowser/Music/a.flac' } }),
+      track({
+        id: { source: { Peer: { onion: 'peer.onion' } }, path: '/var/lib/archipelago/purchased-content/peer.onion/content-9' },
+      }),
+    ])
+    for (const song of songs) {
+      for (const source of song.sources ?? []) {
+        expect(source.url).not.toMatch(/[?&](auth|token)=/)
+      }
+    }
+  })
+
+  it('an own-library track resolves through the existing FileBrowser raw-file route with no query string', () => {
+    const [song] = adaptLibraryTracks([
+      track({ id: { source: 'OwnLibrary', path: '/var/lib/archipelago/filebrowser/Music/Artist/Song.flac' } }),
+    ])
+    expect(song!.sources![0]!.url).toBe('/app/filebrowser/api/raw/Music/Artist/Song.flac')
+  })
+
+  it('a peer track resolves through the existing peer Range-streaming proxy', () => {
+    const [song] = adaptLibraryTracks([
+      track({
+        id: { source: { Peer: { onion: 'xyz.onion' } }, path: '/var/lib/archipelago/purchased-content/xyz.onion/content-42' },
+      }),
+    ])
+    expect(song!.sources![0]!.url).toBe('/api/peer-content/xyz.onion/content-42')
+  })
+
+  it('an empty library produces an empty songs array, not undefined', () => {
+    expect(adaptLibraryTracks([])).toEqual([])
+    expect(adaptLibraryTracks(null)).toEqual([])
+    expect(adaptLibraryTracks(undefined)).toEqual([])
+  })
+})
+
+describe('adaptLibraryAlbums', () => {
+  it('groups tracks by (album_artist, album), preserving first-seen order', () => {
+    const tracks = [
+      track({ id: { source: 'OwnLibrary', path: '/1' }, title: 'T1', album: 'Beta', album_artist: 'X' }),
+      track({ id: { source: 'OwnLibrary', path: '/2' }, title: 'T2', album: 'Alpha', album_artist: 'Y' }),
+      track({ id: { source: 'OwnLibrary', path: '/3' }, title: 'T3', album: 'Beta', album_artist: 'X' }),
+    ]
+    const albums = adaptLibraryAlbums(tracks)
+    expect(albums.map((a) => a.album)).toEqual(['Beta', 'Alpha'])
+    expect(albums[0]!.tracks.map((t) => t.title)).toEqual(['T1', 'T3'])
+    expect(albums[1]!.tracks.map((t) => t.title)).toEqual(['T2'])
+  })
+
+  it('a track with no album tag forms no album bucket', () => {
+    const albums = adaptLibraryAlbums([track({ album: null })])
+    expect(albums).toEqual([])
+  })
+
+  it('is stable across repeat calls on the same input', () => {
+    const tracks = [track({ id: { source: 'OwnLibrary', path: '/1' }, album: 'A' })]
+    const first = adaptLibraryAlbums(tracks)
+    const second = adaptLibraryAlbums(tracks)
+    expect(first).toEqual(second)
+  })
+})

neode-ui/src/composables/__tests__/useTxExplorer.test.ts

@@ -0,0 +1,86 @@
+// Regression suite for the recurring "tx link opens tx1138.com instead of
+// the local Mempool app" bug (reported again on .228, 2026-08-06).
+//
+// The root cause was never the explorer preference — it was that
+// `getAppState` reports `not-installed` for an app whose container list has
+// not been fetched yet. A click that landed before the list arrived sent
+// the user to a third-party explorer, telling that operator which
+// transaction they cared about. These tests pin the fix: the decision waits
+// for real data, and the local app wins whenever it exists.
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { setActivePinia, createPinia } from 'pinia'
+
+const openSession = vi.fn()
+vi.mock('@/stores/appLauncher', () => ({
+  useAppLauncherStore: () => ({ openSession }),
+}))
+
+let containerState: string
+let fetched: boolean
+const ensureFetched = vi.fn(async () => {
+  // Mirrors the real store: state only becomes knowable after the fetch.
+  fetched = true
+})
+vi.mock('@/stores/container', () => ({
+  useContainerStore: () => ({
+    ensureFetched,
+    getAppState: (_id: string) => (fetched ? containerState : 'not-installed'),
+  }),
+}))
+
+import { useTxExplorer, DEFAULT_TX_EXPLORER } from '../useTxExplorer'
+
+const TX = 'a'.repeat(64)
+
+describe('useTxExplorer.openTx', () => {
+  beforeEach(() => {
+    setActivePinia(createPinia())
+    vi.clearAllMocks()
+    localStorage.clear()
+    fetched = false
+    containerState = 'running'
+    // Reset module-scope prefs/pending between tests.
+    const { setExplorer, cancelPending } = useTxExplorer()
+    setExplorer(DEFAULT_TX_EXPLORER, false)
+    cancelPending()
+  })
+
+  it('opens the local Mempool app when it is running', async () => {
+    const { openTx, pendingTx } = useTxExplorer()
+    await openTx(TX)
+    expect(openSession).toHaveBeenCalledWith('mempool', { path: `/tx/${TX}` })
+    expect(pendingTx.value).toBeNull()
+  })
+
+  it('waits for the container list rather than assuming not-installed (the race)', async () => {
+    const { openTx, pendingTx } = useTxExplorer()
+    // fetched=false at click time — the old synchronous check read
+    // 'not-installed' here and went external.
+    await openTx(TX)
+    expect(ensureFetched).toHaveBeenCalled()
+    expect(openSession).toHaveBeenCalledWith('mempool', { path: `/tx/${TX}` })
+    expect(pendingTx.value).toBeNull()
+  })
+
+  it('still prefers the local app when it is installed but stopped', async () => {
+    containerState = 'stopped'
+    const { openTx } = useTxExplorer()
+    await openTx(TX)
+    expect(openSession).toHaveBeenCalledWith('mempool', { path: `/tx/${TX}` })
+  })
+
+  it('prefers the local app mid-restart rather than leaking to a third party', async () => {
+    containerState = 'restarting'
+    const { openTx } = useTxExplorer()
+    await openTx(TX)
+    expect(openSession).toHaveBeenCalledWith('mempool', { path: `/tx/${TX}` })
+  })
+
+  it('asks for consent only when Mempool genuinely is not installed', async () => {
+    containerState = 'not-installed'
+    const { openTx, pendingTx } = useTxExplorer()
+    await openTx(TX)
+    expect(openSession).not.toHaveBeenCalled()
+    expect(pendingTx.value).toBe(TX)
+  })
+})

neode-ui/src/composables/archyContentAdapter.ts

@@ -0,0 +1,667 @@
+/**
+ * Archy content adapter — maps `core/archipelago/src/content_server.rs`'s
+ * `ContentItem` (peer files, this node's own shared files, IndeeHub movies,
+ * paid/owned purchases) onto AIUI's `Film`/`Song`/`Podcast` shapes so its
+ * existing `FilmGrid`/`SongGrid`/`NewsGrid` components can render real node
+ * data instead of records regex-scraped out of the model's own reply text
+ * (D-12, 13-CONTEXT.md).
+ *
+ * RESEARCH Pitfall 4: `ContentItem` (`id`, `filename`, `mime_type`,
+ * `size_bytes`, `description`, `access`, `availability`, `added_at`) has NO
+ * shape overlap with `Film`/`Song`/`Podcast` (`posterUrl`, `coverUrl`,
+ * `sources[]`, `genres`, `runtime`, `director`, ...). This is a hand-written
+ * adapter, not a pass-through — every field below is a deliberate mapping
+ * decision, pinned by `__tests__/archyContentAdapter.test.ts`.
+ *
+ * neode-ui does not depend on `@aiui/core` (D-19 keeps the two packages
+ * decoupled even though they now live in one repo), so the target shapes are
+ * declared locally here rather than imported. They are kept structurally
+ * identical to `aiui/packages/core/src/types/content.ts`'s `Film`/`Song`/
+ * `Podcast`, plus a small Archipelago-only extension (`locked`/`priceSats`)
+ * that AIUI's grids simply ignore today (D-14's paid-unlock state) — the
+ * "shape pinning" test below is the regression pin against silent drift.
+ */
+
+// ─── Target shapes (structurally match aiui/packages/core/src/types/content.ts) ───
+
+export interface FilmSource {
+  type: 'plex' | 'nextcloud' | 'youtube' | 'free-web' | 'indeehub'
+  name: string
+  url: string
+  quality?: string
+  icon: string
+}
+
+export interface Film {
+  id: string
+  title: string
+  year: number
+  posterUrl: string
+  backdropUrl?: string
+  synopsis: string
+  genres: string[]
+  rating: number
+  runtime: number
+  director: string
+  cast: string[]
+  trailerUrl?: string
+  sources: FilmSource[]
+  /** Archipelago extension (not part of AIUI's `Film` type): set when this
+   * item is `access: 'Paid'` and not yet unlocked. AIUI's `FilmGrid` reads
+   * only the fields above and ignores unknown ones, so this is additive. */
+  locked?: boolean
+  priceSats?: number
+}
+
+export interface SongSource {
+  type:
+    | 'plex'
+    | 'spotify'
+    | 'youtube'
+    | 'apple-music'
+    | 'bandcamp'
+    | 'soundcloud'
+    | 'wavlake'
+    | 'internet_archive'
+    | 'jamendo'
+    | 'odysee'
+    | 'funkwhale'
+  name: string
+  url: string
+  icon?: string
+}
+
+export interface Song {
+  id: string
+  title: string
+  artist: string
+  album?: string
+  year?: number
+  coverUrl?: string
+  duration?: number
+  genres?: string[]
+  sources?: SongSource[]
+  locked?: boolean
+  priceSats?: number
+}
+
+export interface PodcastSource {
+  type: 'fountain' | 'rumble' | 'youtube' | 'podcastindex' | 'castopod' | 'odysee' | 'podverse' | 'ipfs' | 'rss'
+  name: string
+  url: string
+  icon?: string
+}
+
+export interface Podcast {
+  id: string
+  title: string
+  host?: string
+  description?: string
+  coverUrl?: string
+  year?: number
+  episodeCount?: number
+  genres?: string[]
+  sources: PodcastSource[]
+  locked?: boolean
+  priceSats?: number
+}
+
+/** Structurally matches `aiui/packages/core/src/types/content.ts`'s
+ * `ImageItem` — declared locally for the same D-19 reason as the shapes
+ * above (neode-ui does not depend on `@aiui/core`). */
+export interface ImageItem {
+  id: string
+  url: string
+  title?: string
+  description?: string
+  alt?: string
+  width?: number
+  height?: number
+  source?: string
+  attribution?: string
+  locked?: boolean
+  priceSats?: number
+}
+
+// ─── Source shape: content_server.rs's ContentItem, as seen over RPC ───
+
+/** `AccessControl` (`core/archipelago/src/content_server.rs`) serializes via
+ * serde's default externally-tagged representation with `rename_all =
+ * "lowercase"`: unit variants become bare strings, the struct variant
+ * becomes `{ paid: { price_sats, accepted } }`. */
+export type ArchyAccessControl =
+  | 'free'
+  | 'peersonly'
+  | { paid: { price_sats: number; accepted?: string[] } }
+
+/** `Availability`, same serialization convention. Not consumed by the
+ * adapter's mapping logic today (RPC scope already decides what's fetched);
+ * kept on the type for fixture fidelity and future use. */
+export type ArchyAvailability = 'nobody' | 'allpeers' | { specific: { peers: string[] } }
+
+/** The wire shape of `content_server::ContentItem`, mirrored field-for-field. */
+export interface ArchyContentItem {
+  id: string
+  filename: string
+  mime_type: string
+  size_bytes: number
+  description?: string | null
+  access?: ArchyAccessControl
+  availability?: ArchyAvailability
+  added_at?: string | null
+}
+
+export interface ArchyContentBundle {
+  films: Film[]
+  songs: Song[]
+  podcasts: Podcast[]
+  /** Shared photos. Images were previously classified 'excluded' and
+   * dropped on the floor, so a node sharing mostly photos rendered as an
+   * empty grid — the single biggest gap between what the assistant could
+   * DESCRIBE and what the surface could SHOW. AIUI has had an image grid
+   * (`panelImages`/`ImageGrid`) the whole time; nothing fed it. */
+  images: ImageItem[]
+}
+
+export interface AdaptContentOptions {
+  /** Where this batch of items came from — decides the `sources[]` badge
+   * and how a playable URL is built. Not a per-item field: a whole RPC
+   * response (one node's catalog, one peer's catalog, or IndeeHub) shares
+   * one source. */
+  source: 'own' | 'peer' | 'indeehub'
+  /** Required when `source === 'peer'` — the peer's onion address, needed
+   * to build the Range-streaming proxy URL. */
+  peerOnion?: string
+}
+
+// ─── Classification ───────────────────────────────────────────────────────
+
+type ContentBucket = 'video' | 'audio' | 'image' | 'excluded'
+
+// `m4a`, `aac`, `opus` and `wma` classify as audio via this extension
+// fallback — `ShareModal.vue`'s mime map omits exactly these four today, so
+// files shared with those extensions arrive here as generic
+// `application/octet-stream` (or another wrong mime) rather than `audio/*`.
+// Without the fallback they would be silently mis-typed as `excluded`
+// instead of routing to the Songs bucket. 13-11 fixes the share side; this
+// adapter must not inherit the same blind spot in the meantime.
+const AUDIO_EXT_FALLBACK = new Set([
+  'm4a',
+  'aac',
+  'opus',
+  'wma',
+  'mp3',
+  'flac',
+  'wav',
+  'ogg',
+])
+
+const VIDEO_EXT_FALLBACK = new Set(['mp4', 'mkv', 'avi', 'mov', 'webm', 'm4v'])
+
+// Same reasoning as the audio fallback above: a photo shared with a mime
+// this node could not identify still has an unambiguous extension, and a
+// node whose catalog is mostly photos should not present as empty.
+const IMAGE_EXT_FALLBACK = new Set(['jpg', 'jpeg', 'png', 'gif', 'webp', 'avif', 'heic', 'bmp'])
+
+function extensionOf(filename: string): string {
+  const base = filename.includes('/') ? filename.slice(filename.lastIndexOf('/') + 1) : filename
+  const idx = base.lastIndexOf('.')
+  return idx > 0 ? base.slice(idx + 1).toLowerCase() : ''
+}
+
+/** Strip the extension from a filename to derive a display title. Directory
+ * separators are stripped first so a full relative path collapses to a
+ * bare filename-derived title. */
+function stripExtension(filename: string): string {
+  const base = filename.includes('/') ? filename.slice(filename.lastIndexOf('/') + 1) : filename
+  const idx = base.lastIndexOf('.')
+  return idx > 0 ? base.slice(0, idx) : base
+}
+
+/**
+ * Decide which grid bucket a `ContentItem` belongs to. Video and audio mimes
+ * (and, as a fallback for a wrong/generic mime, video and audio extensions)
+ * route to Film/Song respectively; everything else (image, document, or
+ * anything unrecognized) is excluded from all three buckets rather than
+ * mis-typed into one. `ContentItem` carries no podcast-specific signal
+ * (no episode/feed metadata), so nothing classifies as `podcast` here —
+ * `adaptToPodcast` exists for shape completeness and future reuse (e.g. an
+ * RSS/podcast-feed source) but `adaptContentItems` never calls it today.
+ */
+export function classifyByMime(item: Pick<ArchyContentItem, 'mime_type' | 'filename'>): ContentBucket {
+  const mime = (item.mime_type || '').toLowerCase().trim()
+  if (mime.startsWith('video/')) return 'video'
+  if (mime.startsWith('audio/')) return 'audio'
+  if (mime.startsWith('image/')) return 'image'
+
+  const ext = extensionOf(item.filename || '')
+  if (AUDIO_EXT_FALLBACK.has(ext)) return 'audio'
+  if (VIDEO_EXT_FALLBACK.has(ext)) return 'video'
+  if (IMAGE_EXT_FALLBACK.has(ext)) return 'image'
+  return 'excluded'
+}
+
+// ─── Access / paid-lock helpers ────────────────────────────────────────────
+
+function paidPriceSats(access: ArchyAccessControl | undefined): number | null {
+  if (access && typeof access === 'object' && 'paid' in access) {
+    return access.paid.price_sats
+  }
+  return null
+}
+
+// ─── Source badge + URL building ───────────────────────────────────────────
+
+// FilmSource's type union has no literal that means "this node" or "a peer"
+// by name — these are infrastructure-flavored badges borrowed from AIUI's
+// existing (unmodified, D-12) vocabulary. 'nextcloud' (self-hosted file
+// storage) stands in for this node's own catalog; 'plex' (a media server)
+// stands in for a peer's shared catalog; 'indeehub' is IndeeHub's own
+// literal. SongSource's union has no 'nextcloud' entry at all, so the
+// self-hosted analogue there is 'funkwhale' (a self-hosted, federated audio
+// server) — the closest existing badge to "this node". These three literal
+// values are pinned by the adapter's tests so a later refactor cannot
+// quietly change what a grid badge means (13-06-PLAN.md Task 1).
+const FILM_SOURCE_TYPE: Record<AdaptContentOptions['source'], FilmSource['type']> = {
+  own: 'nextcloud',
+  peer: 'plex',
+  indeehub: 'indeehub',
+}
+
+const SONG_SOURCE_TYPE: Record<AdaptContentOptions['source'], SongSource['type']> = {
+  own: 'funkwhale',
+  peer: 'plex',
+  // IndeeHub carries no audio catalog in this plan's scope — audio arriving
+  // tagged 'indeehub' is not an expected path, so this falls back to the
+  // generic peer-media badge rather than an invalid literal.
+  indeehub: 'plex',
+}
+
+const PODCAST_SOURCE_TYPE: Record<AdaptContentOptions['source'], PodcastSource['type']> = {
+  own: 'rss',
+  peer: 'rss',
+  indeehub: 'rss',
+}
+
+const SOURCE_LABEL: Record<AdaptContentOptions['source'], string> = {
+  own: 'This node',
+  peer: 'Peer',
+  indeehub: 'IndeeHub',
+}
+
+/**
+ * Build a playable media URL for an unlocked item. **Never** builds a URL
+ * containing a credential in its query string (T-13-32): own-node media
+ * resolves through the existing content endpoint (`/content/<id>`, which is
+ * itself unauthenticated by design — content_server access control is
+ * per-item, not per-session), and peer media through the existing Rust
+ * Range-streaming proxy (`/api/peer-content/<onion>/<id>`, which rides the
+ * page's own session cookie automatically as a same-origin request). Both
+ * already exist; this function names them, it does not mint anything new.
+ */
+function buildMediaUrl(item: ArchyContentItem, opts: AdaptContentOptions): string {
+  if (opts.source === 'peer') {
+    if (!opts.peerOnion) return ''
+    return `/api/peer-content/${encodeURIComponent(opts.peerOnion)}/${encodeURIComponent(item.id)}`
+  }
+  // 'own' and 'indeehub' items both live in this node's own catalog once
+  // added (IndeeHub ingestion still lands an entry in the same catalog —
+  // D-14 routes it through the existing content subsystem, not a new one).
+  return `/content/${encodeURIComponent(item.id)}`
+}
+
+// ─── Per-type mapping ───────────────────────────────────────────────────────
+
+export function adaptToFilm(item: ArchyContentItem, opts: AdaptContentOptions): Film {
+  const priceSats = paidPriceSats(item.access)
+  // 'own' items are served to the authenticated owner by the node's
+  // owner-bypass (`serve_content`) even when they're listed paid for
+  // buyers — the operator never pays for their own files, so never lock
+  // them (a locked card suppresses the playable URL, which is exactly the
+  // placeholder-only grid the operator reported).
+  const locked = opts.source !== 'own' && priceSats !== null
+  const sourceType = FILM_SOURCE_TYPE[opts.source]
+  return {
+    id: item.id,
+    title: stripExtension(item.filename || ''),
+    year: 0,
+    posterUrl: '',
+    synopsis: item.description ?? '',
+    genres: [],
+    rating: 0,
+    runtime: 0,
+    director: '',
+    cast: [],
+    sources: [
+      {
+        type: sourceType,
+        name: SOURCE_LABEL[opts.source],
+        url: locked ? '' : buildMediaUrl(item, opts),
+        icon: sourceType,
+      },
+    ],
+    locked,
+    ...(priceSats !== null ? { priceSats } : {}),
+  }
+}
+
+/**
+ * Map a shared photo onto AIUI's `ImageItem`. A locked (paid, not yet
+ * bought) image gets an EMPTY `url` for the same reason a locked film
+ * does: the card should render its price and lock, not silently fetch
+ * bytes the operator has not paid for.
+ */
+export function adaptToImage(item: ArchyContentItem, opts: AdaptContentOptions): ImageItem {
+  const priceSats = paidPriceSats(item.access)
+  // 'own' items are served to the authenticated owner by the node's
+  // owner-bypass (`serve_content`) even when they're listed paid for
+  // buyers — the operator never pays for their own files, so never lock
+  // them (a locked card suppresses the playable URL, which is exactly the
+  // placeholder-only grid the operator reported).
+  const locked = opts.source !== 'own' && priceSats !== null
+  const title = stripExtension(item.filename || '')
+  return {
+    id: item.id,
+    url: locked ? '' : buildMediaUrl(item, opts),
+    title,
+    description: item.description ?? '',
+    // `alt` falls back to the title rather than being left empty — a photo
+    // grid with no alt text is unreadable to a screen reader.
+    alt: title,
+    source: SOURCE_LABEL[opts.source],
+    locked,
+    ...(priceSats !== null ? { priceSats } : {}),
+  }
+}
+
+export function adaptToSong(item: ArchyContentItem, opts: AdaptContentOptions): Song {
+  const priceSats = paidPriceSats(item.access)
+  // 'own' items are served to the authenticated owner by the node's
+  // owner-bypass (`serve_content`) even when they're listed paid for
+  // buyers — the operator never pays for their own files, so never lock
+  // them (a locked card suppresses the playable URL, which is exactly the
+  // placeholder-only grid the operator reported).
+  const locked = opts.source !== 'own' && priceSats !== null
+  const sourceType = SONG_SOURCE_TYPE[opts.source]
+  return {
+    id: item.id,
+    title: stripExtension(item.filename || ''),
+    artist: '',
+    sources: [
+      {
+        type: sourceType,
+        name: SOURCE_LABEL[opts.source],
+        url: locked ? '' : buildMediaUrl(item, opts),
+        icon: sourceType,
+      },
+    ],
+    locked,
+    ...(priceSats !== null ? { priceSats } : {}),
+  }
+}
+
+/** Exported for shape completeness and future reuse (see `classifyByMime`'s
+ * doc comment) — not called by `adaptContentItems` today, since
+ * `ContentItem` carries no signal that would classify an item as a podcast
+ * rather than a song. */
+export function adaptToPodcast(item: ArchyContentItem, opts: AdaptContentOptions): Podcast {
+  const priceSats = paidPriceSats(item.access)
+  // 'own' items are served to the authenticated owner by the node's
+  // owner-bypass (`serve_content`) even when they're listed paid for
+  // buyers — the operator never pays for their own files, so never lock
+  // them (a locked card suppresses the playable URL, which is exactly the
+  // placeholder-only grid the operator reported).
+  const locked = opts.source !== 'own' && priceSats !== null
+  const sourceType = PODCAST_SOURCE_TYPE[opts.source]
+  return {
+    id: item.id,
+    title: stripExtension(item.filename || ''),
+    description: item.description ?? '',
+    sources: [
+      {
+        type: sourceType,
+        name: SOURCE_LABEL[opts.source],
+        url: locked ? '' : buildMediaUrl(item, opts),
+        icon: sourceType,
+      },
+    ],
+    locked,
+    ...(priceSats !== null ? { priceSats } : {}),
+  }
+}
+
+// ─── Deterministic ordering ─────────────────────────────────────────────────
+
+/**
+ * Sort by `added_at` descending, `id` ascending as the tiebreak. A missing
+ * `added_at` sorts as the oldest possible value rather than throwing or
+ * sorting first. Calling this twice on the same input in a different array
+ * order yields identical output order — the property the AIUI-03 "ordering"
+ * edge requires.
+ */
+export function sortDeterministic(items: ArchyContentItem[]): ArchyContentItem[] {
+  return [...items].sort((a, b) => {
+    const at = a.added_at ?? ''
+    const bt = b.added_at ?? ''
+    if (at !== bt) return at > bt ? -1 : 1
+    if (a.id === b.id) return 0
+    return a.id < b.id ? -1 : 1
+  })
+}
+
+// ─── Entry point ─────────────────────────────────────────────────────────
+
+/**
+ * Map a batch of `ContentItem`s (all from the same source — this node, one
+ * peer, or IndeeHub) into grid-ready `Film`/`Song`/`Podcast` records.
+ *
+ * - An empty input produces `{ films: [], songs: [], podcasts: [] }` — never
+ *   `undefined`, never a thrown error.
+ * - Two items with identical `filename`/`size_bytes` but different `id`
+ *   produce two distinct cards — cards key on `id`, never on filename+size
+ *   (the AIUI-03 "adjacency" edge; also T-13-37).
+ * - Output ordering is deterministic (see `sortDeterministic`).
+ */
+export function adaptContentItems(
+  items: ArchyContentItem[] | null | undefined,
+  opts: AdaptContentOptions,
+): ArchyContentBundle {
+  const sorted = sortDeterministic(items ?? [])
+  const films: Film[] = []
+  const songs: Song[] = []
+  const podcasts: Podcast[] = []
+  const images: ImageItem[] = []
+
+  for (const item of sorted) {
+    const bucket = classifyByMime(item)
+    if (bucket === 'video') films.push(adaptToFilm(item, opts))
+    else if (bucket === 'audio') songs.push(adaptToSong(item, opts))
+    else if (bucket === 'image') images.push(adaptToImage(item, opts))
+    // 'excluded' (documents/archives/other) — no grid renders these, so
+    // they stay out of every bucket rather than being mistyped into one.
+  }
+
+  return { films, songs, podcasts, images }
+}
+
+// ─── Library mapping (13-11) ────────────────────────────────────────────
+//
+// `music.list-tracks` (13-07, `core/archipelago/src/api/rpc/music.rs`)
+// returns real tag-extracted metadata (title/artist/album/duration) for
+// this node's indexed library — a materially different, richer input than
+// `ContentItem` above (which carries no tag data at all; `adaptToSong`
+// above always sets `artist: ''`). `adaptLibraryTracks` is a sibling
+// mapping, not a replacement: it feeds the same `songs` bucket of the
+// `ArchyContentBundle`/`content:push` shape with real metadata instead of
+// filename-derived guesses.
+
+/** `MusicSource` (`core/archipelago/src/music/mod.rs`), as seen over RPC.
+ * Serde's default externally-tagged representation: the unit variant
+ * `OwnLibrary` becomes the bare string `"OwnLibrary"`; the struct variant
+ * `Peer { onion }` becomes `{ "Peer": { "onion": string } }`. */
+export type ArchyMusicSource = 'OwnLibrary' | { Peer: { onion: string } }
+
+/** The wire shape of `core/archipelago/src/music/mod.rs`'s `Track`, as
+ * returned by `music.list-tracks` — field names match the Rust struct
+ * verbatim (no serde rename). */
+export interface ArchyLibraryTrack {
+  id: { source: ArchyMusicSource; path: string }
+  title: string
+  artist?: string | null
+  album?: string | null
+  album_artist?: string | null
+  track_number?: number | null
+  disc_number?: number | null
+  year?: number | null
+  duration_secs: number
+  has_tags: boolean
+  content_hash?: string | null
+}
+
+/** A library track grouped under its album — exported for shape
+ * completeness and future reuse (`adaptLibraryAlbums`'s doc comment),
+ * mirroring `adaptToPodcast`'s status in this same file: not consumed by
+ * this plan's own wiring (`SongGrid` renders a flat track list), but a
+ * real, tested mapping a future album-detail view can reuse without
+ * re-deriving the grouping. */
+export interface ArchyLibraryAlbum {
+  album: string
+  albumArtist: string
+  tracks: Song[]
+}
+
+function isPeerMusicSource(source: ArchyMusicSource): source is { Peer: { onion: string } } {
+  return typeof source === 'object' && source !== null && 'Peer' in source
+}
+
+/** Build a playable URL for a library track. **Never** builds a URL
+ * carrying a credential in its query string (T-13-71, same rule as
+ * `buildMediaUrl` above).
+ *
+ * An `OwnLibrary` track's `path` is an absolute, canonicalized filesystem
+ * path rooted at `media_roots()`'s first entry
+ * (`data_dir/filebrowser/Music`, 13-04/13-07) — everything after the
+ * `/filebrowser/` path segment is the exact same FileBrowser-relative path
+ * `filebrowser-client.ts`'s `streamUrl` already serves via
+ * `/app/filebrowser/api/raw<path>` (the T-13-39 fix, 13-06), so this reuses
+ * that existing route rather than minting a new one.
+ *
+ * A `Peer` track's `path` is the local byte-cache layout
+ * `<data_dir>/purchased-content/<onion>/<content_id>` (13-07's second media
+ * root) and resolves through the existing peer Range-streaming proxy —
+ * exactly `buildMediaUrl`'s peer branch above, just deriving `onion` from
+ * `MusicSource::Peer` instead of an adapter option and `content_id` from
+ * the path's own basename. */
+function buildLibraryTrackUrl(track: ArchyLibraryTrack): string {
+  if (isPeerMusicSource(track.id.source)) {
+    const onion = track.id.source.Peer.onion
+    const segments = track.id.path.split('/').filter(Boolean)
+    const contentId = segments[segments.length - 1]
+    if (!onion || !contentId) return ''
+    return `/api/peer-content/${encodeURIComponent(onion)}/${encodeURIComponent(contentId)}`
+  }
+  const marker = '/filebrowser/'
+  const idx = track.id.path.indexOf(marker)
+  if (idx === -1) return ''
+  const relative = track.id.path.slice(idx + marker.length)
+  if (!relative) return ''
+  const encoded = relative
+    .split('/')
+    .filter(Boolean)
+    .map((seg) => encodeURIComponent(seg))
+    .join('/')
+  return `/app/filebrowser/api/raw/${encoded}`
+}
+
+function librarySourceKey(source: ArchyMusicSource): string {
+  return isPeerMusicSource(source) ? `peer:${source.Peer.onion}` : 'own'
+}
+
+/** Stable per-track id: `TrackId` (`{ source, path }`) has no single string
+ * identity on the wire, so one is derived here deterministically from the
+ * same two fields — the same input always produces the same id. */
+function libraryTrackId(track: ArchyLibraryTrack): string {
+  return `${librarySourceKey(track.id.source)}:${track.id.path}`
+}
+
+/**
+ * Map `music.list-tracks` records onto AIUI's `Song` shape.
+ *
+ * - Title/artist/album/duration are carried through from the extracted
+ *   tags (`title`, `artist`, `album`, `duration_secs` → `duration`).
+ * - A track whose `artist` tag is absent falls back to `album_artist`, and
+ *   to `''` if that is absent too — never the literal `null`/`undefined`.
+ * - Ordering is **not** recomputed here: `music.list-tracks`'s own
+ *   response is already deterministically ordered
+ *   `(disc, track number, title)` with `(source, path)` as the final
+ *   tiebreak (13-07) — re-sorting by a different key in the browser would
+ *   make the grid and the RPC disagree about what "first" means, so this
+ *   is a straight, order-preserving map.
+ * - No cover art is ever set (`coverUrl` stays `undefined`): `Track`
+ *   carries no artwork field at all, and AIUI's own artwork sources are
+ *   dev-server-only Vite middleware, 404 on a node (13-CONTEXT.md
+ *   landmine) — `SongGrid`'s existing no-artwork fallback renders instead
+ *   of a broken image, unchanged.
+ * - A peer-sourced track's `sources[0].type` differs from an own-library
+ *   track's, using the same `'funkwhale'`/`'plex'` literals `SONG_SOURCE_TYPE`
+ *   already pins above (13-06).
+ * - No produced URL ever carries a credential in its query string.
+ * - `null`/`undefined`/empty input produces `[]`, never `undefined`.
+ */
+export function adaptLibraryTracks(tracks: ArchyLibraryTrack[] | null | undefined): Song[] {
+  return (tracks ?? []).map((track) => {
+    const peer = isPeerMusicSource(track.id.source)
+    const sourceType: SongSource['type'] = peer ? 'plex' : 'funkwhale'
+    const artist = track.artist ?? track.album_artist ?? ''
+    return {
+      id: libraryTrackId(track),
+      title: track.title,
+      artist,
+      album: track.album ?? undefined,
+      year: track.year ?? undefined,
+      duration: track.duration_secs,
+      sources: [
+        {
+          type: sourceType,
+          name: peer ? 'Peer' : 'This node',
+          url: buildLibraryTrackUrl(track),
+          icon: sourceType,
+        },
+      ],
+    }
+  })
+}
+
+/**
+ * Group `music.list-tracks` records into albums, keyed on
+ * `(album_artist, album)` — the same derived-albums grouping
+ * `13-MUSIC-MODEL.md` defines server-side for `music.list-albums`, computed
+ * here over already-adapted `Song`s so a future album-detail view can reuse
+ * it without a second RPC round trip. A track with no `album` tag forms no
+ * album bucket (nothing to group it under) but is still present in
+ * `adaptLibraryTracks`'s flat output. Grouping preserves the input's own
+ * order — first-seen album first, tracks in the order they appear — so
+ * calling this twice on the same input array yields identical output order.
+ */
+export function adaptLibraryAlbums(tracks: ArchyLibraryTrack[] | null | undefined): ArchyLibraryAlbum[] {
+  const list = tracks ?? []
+  const songs = adaptLibraryTracks(list)
+  const albums: ArchyLibraryAlbum[] = []
+  const index = new Map<string, ArchyLibraryAlbum>()
+
+  list.forEach((track, i) => {
+    const album = track.album ?? ''
+    if (!album) return
+    const albumArtist = track.album_artist ?? track.artist ?? ''
+    const key = `${albumArtist}::${album}`
+    let bucket = index.get(key)
+    if (!bucket) {
+      bucket = { album, albumArtist, tracks: [] }
+      index.set(key, bucket)
+      albums.push(bucket)
+    }
+    bucket.tracks.push(songs[i]!)
+  })
+
+  return albums
+}

neode-ui/src/composables/useTxExplorer.ts

@@ -59,9 +59,25 @@ export function useTxExplorer() {
     window.open(`${explorerUrl()}/tx/${txHash}`, '_blank', 'noopener,noreferrer')
   }
 
-  /** Entry point for every "view transaction" affordance in the app. */
-  function openTx(txHash: string) {
-    if (containers.getAppState('mempool') === 'running') {
+  /**
+   * Entry point for every "view transaction" affordance in the app.
+   *
+   * The local Mempool app WINS whenever it is installed — including while
+   * it is stopped or restarting, where the app session's own controls are
+   * the right place to land. Only a node that genuinely does not have the
+   * app (the pruned-node case this file was written for) ever reaches an
+   * external explorer.
+   *
+   * The await is load-bearing, not incidental. `getAppState` reports
+   * `not-installed` for an app it simply has not fetched yet, so the old
+   * synchronous check sent a user with a perfectly healthy local Mempool
+   * to a third-party explorer whenever they clicked before the container
+   * list arrived — a privacy leak decided by a race, and the reason this
+   * regression kept coming back (reported again on .228, 2026-08-06).
+   */
+  async function openTx(txHash: string) {
+    await containers.ensureFetched()
+    if (containers.getAppState('mempool') !== 'not-installed') {
       launcher.openSession('mempool', { path: `/tx/${txHash}` })
       return
     }

neode-ui/src/locales/en.json

@@ -368,7 +368,9 @@
     "loadingAssistant": "Loading AI assistant...",
     "aiAssistant": "AI Assistant",
     "notConfigured": "AI Assistant needs to be enabled before use.",
-    "deployCta": "Go to Settings to configure your AI provider API key, then return here to start chatting."
+    "deployCta": "Go to Settings to configure your AI provider API key, then return here to start chatting.",
+    "permissionNeeded": "The assistant needed access to {categories}, which is switched off.",
+    "openAISettings": "Open AI settings"
   },
   "web5": {
     "title": "Web5",

neode-ui/src/locales/es.json

@@ -361,6 +361,8 @@
   },
   "chat": {
     "close": "Cerrar",
+    "permissionNeeded": "El asistente necesitaba acceso a {categories}, que está desactivado.",
+    "openAISettings": "Abrir ajustes de IA",
     "aiuiConnected": "AIUI conectado",
     "closeAssistant": "Cerrar asistente de IA",
     "loadingAssistant": "Cargando asistente de IA...",

neode-ui/src/services/__tests__/contextBroker.test.ts

@@ -20,6 +20,8 @@ vi.mock('@/api/filebrowser-client', () => ({
 
 import { ContextBroker } from '../contextBroker'
 import { useAIPermissionsStore } from '@/stores/aiPermissions'
+import { rpcClient } from '@/api/rpc-client'
+import { fileBrowserClient } from '@/api/filebrowser-client'
 
 describe('ContextBroker', () => {
   let broker: ContextBroker
@@ -160,4 +162,338 @@ describe('ContextBroker', () => {
       expect(redact(line)).toBe(line)
     })
   })
+
+  describe('content:request', () => {
+    const callContentRequest = (id: string, kind: string, scope?: string) =>
+      (
+        broker as unknown as {
+          handleContentRequest: (id: string, kind: string, scope?: string) => Promise<void>
+        }
+      ).handleContentRequest(id, kind, scope)
+
+    it('refuses with permitted:false and makes no RPC call when neither media nor files is granted', async () => {
+      await callContentRequest('req-denied', 'films', 'own')
+
+      expect(rpcClient.call).not.toHaveBeenCalled()
+      expect(mockPostMessage).toHaveBeenCalledWith(
+        {
+          type: 'content:push',
+          id: 'req-denied',
+          kind: 'films',
+          permitted: false,
+          films: [],
+          songs: [],
+          podcasts: [],
+          images: [],
+        },
+        expect.any(String),
+      )
+    })
+
+    it('adapts content.list-mine results into a content:push with permitted:true when media is granted', async () => {
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+      vi.mocked(rpcClient.call).mockResolvedValueOnce({
+        items: [
+          { id: 'a', filename: 'movie.mp4', mime_type: 'video/mp4', size_bytes: 10, added_at: '2026-01-01T00:00:00Z' },
+        ],
+      })
+
+      await callContentRequest('req-1', 'films', 'own')
+
+      expect(rpcClient.call).toHaveBeenCalledWith(expect.objectContaining({ method: 'content.list-mine' }))
+      expect(mockPostMessage).toHaveBeenCalledWith(
+        expect.objectContaining({
+          type: 'content:push',
+          id: 'req-1',
+          kind: 'films',
+          permitted: true,
+          films: expect.arrayContaining([expect.objectContaining({ id: 'a' })]),
+        }),
+        expect.any(String),
+      )
+    })
+
+    it('discards a stale in-flight response when a newer content:request has since started (out-of-order / AIUI-03 concurrency edge)', async () => {
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+
+      let resolveFirst: (v: { items: unknown[] }) => void = () => {}
+      const firstPromise = new Promise<{ items: unknown[] }>((resolve) => {
+        resolveFirst = resolve
+      })
+
+      vi.mocked(rpcClient.call)
+        .mockImplementationOnce(() => firstPromise as unknown as Promise<never>)
+        .mockResolvedValueOnce({
+          items: [
+            { id: 'fresh', filename: 'fresh.mp4', mime_type: 'video/mp4', size_bytes: 1, added_at: '2026-02-01T00:00:00Z' },
+          ],
+        })
+
+      const firstCall = callContentRequest('stale-req', 'films', 'own')
+      const secondCall = callContentRequest('fresh-req', 'films', 'own')
+      await secondCall
+
+      // The slow first request resolves AFTER the second one already
+      // completed — its result must be discarded, not posted.
+      resolveFirst({
+        items: [
+          { id: 'old', filename: 'old.mp4', mime_type: 'video/mp4', size_bytes: 1, added_at: '2026-01-01T00:00:00Z' },
+        ],
+      })
+      await firstCall
+
+      const staleCalls = mockPostMessage.mock.calls.filter(
+        ([msg]) => (msg as { type?: string; id?: string }).type === 'content:push' && (msg as { id?: string }).id === 'stale-req',
+      )
+      expect(staleCalls).toHaveLength(0)
+
+      const freshCalls = mockPostMessage.mock.calls.filter(
+        ([msg]) => (msg as { type?: string; id?: string }).type === 'content:push' && (msg as { id?: string }).id === 'fresh-req',
+      )
+      expect(freshCalls).toHaveLength(1)
+    })
+
+    it('delivers BOTH results when two different kinds are requested together', async () => {
+      // Regression: the guard used one counter for every kind, so requests for
+      // different kinds cancelled each other. useArchy.ts init fires
+      // content('all','own') then library('own') back to back and both sequence
+      // numbers are assigned synchronously before either awaits — so the first
+      // ALWAYS resolved stale and was dropped. Films, podcasts and own files
+      // never reached the grid; only music ever did. Different kinds populate
+      // different grids and cannot stale each other by definition.
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+
+      vi.mocked(rpcClient.call).mockResolvedValue({ items: [], tracks: [] } as never)
+
+      const films = callContentRequest('films-req', 'films', 'own')
+      const library = callContentRequest('library-req', 'library', 'own')
+      await Promise.all([films, library])
+
+      const pushed = mockPostMessage.mock.calls
+        .map(([msg]) => msg as { type?: string; id?: string })
+        .filter((m) => m.type === 'content:push')
+        .map((m) => m.id)
+
+      expect(pushed).toContain('films-req')
+      expect(pushed).toContain('library-req')
+    })
+
+    it('still discards a stale response within the same kind and scope', async () => {
+      // The guard's real purpose must survive being made per-key.
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+      vi.mocked(rpcClient.call).mockResolvedValue({ items: [] } as never)
+
+      await callContentRequest('older', 'films', 'own')
+      await callContentRequest('newer', 'films', 'own')
+
+      // Both completed in order here, so both post; the ordering guarantee is
+      // covered by the out-of-order test above. What this pins is that the key
+      // is kind+scope, so a DIFFERENT scope does not collide with this one.
+      const scoped = callContentRequest('peer-scope', 'films', 'peers')
+      await scoped
+      const pushed = mockPostMessage.mock.calls
+        .map(([msg]) => msg as { type?: string; id?: string })
+        .filter((m) => m.type === 'content:push')
+        .map((m) => m.id)
+      expect(pushed).toContain('peer-scope')
+    })
+
+    // 13-11: kind: 'library' is the one addition this wave makes to the
+    // discriminator — it resolves to music.list-tracks, not content.*,
+    // since a library track carries real tag-extracted metadata
+    // (artist/album/duration) ContentItem has no field for.
+    it("kind: 'library' calls music.list-tracks (not content.list-mine) and adapts the result into the songs bucket", async () => {
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+      vi.mocked(rpcClient.call).mockResolvedValueOnce({
+        tracks: [
+          {
+            id: { source: 'OwnLibrary', path: '/var/lib/archipelago/filebrowser/Music/Artist/Song.flac' },
+            title: 'Song',
+            artist: 'Artist',
+            album: 'Album',
+            album_artist: 'Artist',
+            duration_secs: 200,
+            has_tags: true,
+          },
+        ],
+      })
+
+      await callContentRequest('req-lib', 'library', 'own')
+
+      expect(rpcClient.call).toHaveBeenCalledWith(expect.objectContaining({ method: 'music.list-tracks' }))
+      expect(rpcClient.call).not.toHaveBeenCalledWith(expect.objectContaining({ method: 'content.list-mine' }))
+      expect(mockPostMessage).toHaveBeenCalledWith(
+        expect.objectContaining({
+          type: 'content:push',
+          id: 'req-lib',
+          kind: 'library',
+          permitted: true,
+          films: [],
+          songs: expect.arrayContaining([expect.objectContaining({ title: 'Song', artist: 'Artist', album: 'Album' })]),
+        }),
+        expect.any(String),
+      )
+    })
+
+    it("kind: 'library' degrades to an empty songs bucket (not a thrown error) when music.list-tracks fails", async () => {
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+      vi.mocked(rpcClient.call).mockRejectedValueOnce(new Error('no index yet'))
+
+      await callContentRequest('req-lib-err', 'library', 'own')
+
+      expect(mockPostMessage).toHaveBeenCalledWith(
+        expect.objectContaining({
+          type: 'content:push',
+          id: 'req-lib-err',
+          kind: 'library',
+          permitted: true,
+          films: [],
+          songs: [],
+          podcasts: [],
+          images: [],
+        }),
+        expect.any(String),
+      )
+    })
+  })
+
+  describe('adaptChatSurfaces', () => {
+    const callAdapt = (surfaces: unknown) =>
+      (
+        broker as unknown as {
+          adaptChatSurfaces: (s?: unknown) => { tool: string; scope?: string; bundle: { films: unknown[]; songs: unknown[]; podcasts: unknown[]; images: { id: string; url: string; locked: boolean }[] } }[] | undefined
+        }
+      ).adaptChatSurfaces(surfaces)
+
+    // Live bug (archi-dev-box 2026-08-07): a purchased-scope chat surface
+    // adapted the OwnedRpcItem wire shape as if it were ArchyContentItem —
+    // id came out undefined, peerOnion was never passed, every URL was ''
+    // — so three purchased images rendered as placeholders beside a correct
+    // prose answer.
+    it('purchased scope normalizes owned items and builds per-seller URLs', () => {
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+      const out = callAdapt([
+        {
+          tool: 'content_list',
+          scope: 'purchased',
+          data: {
+            items: [
+              {
+                onion: 'peer-one.onion',
+                content_id: 'cid-1',
+                filename: 'signal-test.jpeg',
+                mime_type: 'image/jpeg',
+                size_bytes: 170000,
+                paid_sats: 100,
+                purchased_at: '2026-06-20T00:00:00Z',
+              },
+              {
+                onion: 'peer-two.onion',
+                content_id: 'cid-2',
+                filename: 'got it!.jpg',
+                mime_type: 'image/jpeg',
+                size_bytes: 253000,
+                paid_sats: 100,
+                purchased_at: '2026-08-04T00:00:00Z',
+              },
+            ],
+          },
+        },
+      ])
+      expect(out).toHaveLength(1)
+      const images = out![0]!.bundle.images
+      expect(images).toHaveLength(2)
+      // Real ids, real per-seller URLs, and already-paid items are unlocked.
+      expect(images.map((i) => i.id)).toEqual(expect.arrayContaining(['cid-1', 'cid-2']))
+      expect(images[0]!.url).toBe('/api/peer-content/peer-one.onion/cid-1')
+      expect(images[1]!.url).toBe('/api/peer-content/peer-two.onion/cid-2')
+      expect(images.every((i) => !i.locked)).toBe(true)
+    })
+
+    it('peers scope adapts per-seller so every item URL carries its own onion', () => {
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+      const out = callAdapt([
+        {
+          tool: 'content_list',
+          scope: 'peers',
+          data: {
+            items: [
+              { id: 'x', filename: 'a.jpg', mime_type: 'image/jpeg', size_bytes: 1, peer: 'seller-a.onion' },
+              { id: 'y', filename: 'b.jpg', mime_type: 'image/jpeg', size_bytes: 1, peer: 'seller-b.onion' },
+            ],
+          },
+        },
+      ])
+      const images = out![0]!.bundle.images
+      expect(images.map((i) => i.url).sort()).toEqual([
+        '/api/peer-content/seller-a.onion/x',
+        '/api/peer-content/seller-b.onion/y',
+      ])
+    })
+  })
+
+  describe('context gathering always answers', () => {
+    it('responds when the gatherer never settles — the reported files hang', async () => {
+      // A File Browser that accepts the connection and then says nothing:
+      // the promise stays PENDING rather than rejecting, which is precisely
+      // what sanitizeFiles' try/catch cannot see. Before the timeout, no
+      // context:response was ever posted and AIUI waited out its own bridge
+      // timeout instead — reported as "`files` context request times out".
+      vi.useFakeTimers()
+      try {
+        const perms = useAIPermissionsStore()
+        perms.enableAll()
+        ;(fileBrowserClient.login as ReturnType<typeof vi.fn>).mockReturnValue(
+          new Promise(() => {}),
+        )
+
+        const pending = (
+          broker as unknown as {
+            handleContextRequest(id: string, category: string): Promise<void>
+          }
+        ).handleContextRequest('req-hang', 'files')
+
+        await vi.advanceTimersByTimeAsync(10_000)
+        await pending
+
+        expect(mockPostMessage).toHaveBeenCalledWith(
+          expect.objectContaining({
+            type: 'context:response',
+            id: 'req-hang',
+            data: null,
+            permitted: true,
+          }),
+          expect.anything(),
+        )
+      } finally {
+        vi.useRealTimers()
+      }
+    })
+
+    it('a healthy category still returns its data, not null', async () => {
+      const perms = useAIPermissionsStore()
+      perms.enableAll()
+
+      await (
+        broker as unknown as {
+          handleContextRequest(id: string, category: string): Promise<void>
+        }
+      ).handleContextRequest('req-ok', 'apps')
+
+      const posted = mockPostMessage.mock.calls.find(
+        (c) => (c[0] as { id?: string }).id === 'req-ok',
+      )
+      expect(posted).toBeDefined()
+      expect((posted![0] as { permitted: boolean }).permitted).toBe(true)
+      expect((posted![0] as { data: unknown }).data).not.toBeNull()
+    })
+  })
 })

neode-ui/src/services/__tests__/toolConfirm.test.ts

@@ -0,0 +1,415 @@
+// 13-08 Task 2: the trusted-chrome tool-confirmation flow (D-07/D-11).
+// The dialog text is RPC-fetched from the node (assistant.pending), drawn
+// by neode-ui outside the AIUI iframe, and the decision travels back over
+// the page's own authenticated RPC session (assistant.confirm-tool) — the
+// iframe is never in that path and cannot open, restyle or resolve it.
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+import { ref, type Ref } from 'vue'
+import { setActivePinia, createPinia } from 'pinia'
+import { mount } from '@vue/test-utils'
+
+vi.mock('@/api/rpc-client', () => ({
+  rpcClient: {
+    call: vi.fn(),
+  },
+}))
+
+vi.mock('@/api/filebrowser-client', () => ({
+  fileBrowserClient: {
+    login: vi.fn(),
+    isAuthenticated: false,
+    getUsage: vi.fn(),
+    listDirectory: vi.fn(),
+    readFileAsText: vi.fn(),
+  },
+}))
+
+import { ContextBroker } from '../contextBroker'
+import { rpcClient } from '@/api/rpc-client'
+import ToolConfirmModal from '@/components/ToolConfirmModal.vue'
+
+const PENDING_IMMICH = {
+  req_id: 'confirm-1',
+  nonce: 'node-minted-nonce-1',
+  description: 'Restart the app "immich". Only "immich" is affected.',
+  tool_name: 'app_restart',
+}
+
+const PENDING_GITEA = {
+  req_id: 'confirm-2',
+  nonce: 'node-minted-nonce-2',
+  description: 'Restart the app "gitea". Only "gitea" is affected.',
+  tool_name: 'app_restart',
+}
+
+describe('tool confirmation — ContextBroker half', () => {
+  let broker: ContextBroker
+  let iframeRef: Ref<HTMLIFrameElement | null>
+  let mockPostMessage: ReturnType<typeof vi.fn>
+  let confirmRequests: CustomEvent[]
+  const captureRequest = (e: Event) => confirmRequests.push(e as CustomEvent)
+
+  beforeEach(() => {
+    setActivePinia(createPinia())
+    vi.clearAllMocks()
+    vi.useFakeTimers()
+    confirmRequests = []
+    window.addEventListener('aiui:tool-confirm-request', captureRequest)
+
+    mockPostMessage = vi.fn()
+    iframeRef = ref<HTMLIFrameElement | null>({
+      contentWindow: { postMessage: mockPostMessage },
+    } as unknown as HTMLIFrameElement)
+    broker = new ContextBroker(iframeRef, 'http://localhost:8100')
+  })
+
+  afterEach(() => {
+    window.removeEventListener('aiui:tool-confirm-request', captureRequest)
+    broker.stop()
+    vi.useRealTimers()
+  })
+
+  /** Mock a chat turn that stays in flight (the node is suspended on its
+   * confirm gate) while assistant.pending reports `pending`. */
+  function mockChatSuspendedWithPending(pending: typeof PENDING_IMMICH | null) {
+    let releaseChat: (v: unknown) => void = () => {}
+    vi.mocked(rpcClient.call).mockImplementation((opts: { method: string }) => {
+      if (opts.method === 'assistant.chat') {
+        return new Promise<unknown>((resolve) => {
+          releaseChat = resolve
+        }) as Promise<never>
+      }
+      if (opts.method === 'assistant.pending') {
+        return Promise.resolve({ pending }) as Promise<never>
+      }
+      return Promise.resolve({}) as Promise<never>
+    })
+    return () => releaseChat({ text: 'done' })
+  }
+
+  const startChat = () =>
+    (
+      broker as unknown as {
+        handleChatRequest: (id: string, text: string) => Promise<void>
+      }
+    ).handleChatRequest('chat-1', 'restart immich please')
+
+  it('a pending confirmation reported by the node opens the host dialog with the node-fetched description', async () => {
+    const releaseChat = mockChatSuspendedWithPending(PENDING_IMMICH)
+
+    const chat = startChat()
+    await vi.advanceTimersByTimeAsync(2000)
+
+    expect(confirmRequests).toHaveLength(1)
+    expect(confirmRequests[0]!.detail.reqId).toBe('confirm-1')
+    expect(confirmRequests[0]!.detail.description).toBe(PENDING_IMMICH.description)
+
+    // The same pending action is never re-announced while it is open.
+    await vi.advanceTimersByTimeAsync(3000)
+    expect(confirmRequests).toHaveLength(1)
+
+    releaseChat()
+    await chat
+  })
+
+  it('a confirmation that vanishes node-side is expired to the chrome so the dialog closes', async () => {
+    let currentPending: typeof PENDING_IMMICH | null = PENDING_IMMICH
+    let releaseChat: (v: unknown) => void = () => {}
+    vi.mocked(rpcClient.call).mockImplementation((opts: { method: string }) => {
+      if (opts.method === 'assistant.chat') {
+        return new Promise<unknown>((resolve) => {
+          releaseChat = resolve
+        }) as Promise<never>
+      }
+      if (opts.method === 'assistant.pending') {
+        return Promise.resolve({ pending: currentPending }) as Promise<never>
+      }
+      return Promise.resolve({}) as Promise<never>
+    })
+    const expired: CustomEvent[] = []
+    const captureExpired = (e: Event) => expired.push(e as CustomEvent)
+    window.addEventListener('aiui:tool-confirm-expired', captureExpired)
+
+    const chat = startChat()
+    await vi.advanceTimersByTimeAsync(2000)
+    expect(confirmRequests).toHaveLength(1)
+
+    // The node times the confirmation out: pending goes null mid-turn.
+    currentPending = null
+    await vi.advanceTimersByTimeAsync(2000)
+    expect(expired).toHaveLength(1)
+    expect(expired[0]!.detail.reqId).toBe('confirm-1')
+
+    window.removeEventListener('aiui:tool-confirm-expired', captureExpired)
+    releaseChat({ text: 'done' })
+    await chat
+  })
+
+  it('the chat turn ending expires any confirmation still on screen', async () => {
+    const releaseChat = mockChatSuspendedWithPending(PENDING_IMMICH)
+    const expired: CustomEvent[] = []
+    const captureExpired = (e: Event) => expired.push(e as CustomEvent)
+    window.addEventListener('aiui:tool-confirm-expired', captureExpired)
+
+    const chat = startChat()
+    await vi.advanceTimersByTimeAsync(2000)
+    expect(confirmRequests).toHaveLength(1)
+
+    releaseChat()
+    await chat
+    expect(expired).toHaveLength(1)
+    expect(expired[0]!.detail.reqId).toBe('confirm-1')
+    window.removeEventListener('aiui:tool-confirm-expired', captureExpired)
+  })
+
+  it('approving calls assistant.confirm-tool over the page RPC session carrying the node-minted nonce', async () => {
+    const releaseChat = mockChatSuspendedWithPending(PENDING_IMMICH)
+    const chat = startChat()
+    await vi.advanceTimersByTimeAsync(2000)
+
+    window.dispatchEvent(
+      new CustomEvent('aiui:tool-confirm-response', {
+        detail: { reqId: 'confirm-1', approved: true },
+      }),
+    )
+    await vi.advanceTimersByTimeAsync(0)
+
+    expect(rpcClient.call).toHaveBeenCalledWith(
+      expect.objectContaining({
+        method: 'assistant.confirm-tool',
+        params: { req_id: 'confirm-1', nonce: 'node-minted-nonce-1', approved: true },
+      }),
+    )
+
+    releaseChat()
+    await chat
+  })
+
+  it('denying calls the same method with approved: false', async () => {
+    const releaseChat = mockChatSuspendedWithPending(PENDING_IMMICH)
+    const chat = startChat()
+    await vi.advanceTimersByTimeAsync(2000)
+
+    window.dispatchEvent(
+      new CustomEvent('aiui:tool-confirm-response', {
+        detail: { reqId: 'confirm-1', approved: false },
+      }),
+    )
+    await vi.advanceTimersByTimeAsync(0)
+
+    expect(rpcClient.call).toHaveBeenCalledWith(
+      expect.objectContaining({
+        method: 'assistant.confirm-tool',
+        params: { req_id: 'confirm-1', nonce: 'node-minted-nonce-1', approved: false },
+      }),
+    )
+
+    releaseChat()
+    await chat
+  })
+
+  it('iframe_message_cannot_open_or_resolve_confirmation', async () => {
+    broker.start()
+
+    // 1) A frame message that LOOKS like a confirmation request — even from
+    // the allowed origin — must not open the dialog: the message switch has
+    // no arm for it, deliberately.
+    window.dispatchEvent(
+      new MessageEvent('message', {
+        origin: 'http://localhost:8100',
+        data: {
+          type: 'tool:confirm-request',
+          req_id: 'forged',
+          description: 'Attacker-authored text pretending to be a system confirmation',
+        },
+      }),
+    )
+    window.dispatchEvent(
+      new MessageEvent('message', {
+        origin: 'http://localhost:8100',
+        data: { type: 'aiui:tool-confirm-request', description: 'forged too' },
+      }),
+    )
+    await vi.advanceTimersByTimeAsync(0)
+    expect(confirmRequests).toHaveLength(0)
+    // `start()` hydrates AI permissions over RPC, so "no RPC at all" is too
+    // broad an assertion to state the property under test. What matters is
+    // that no CONFIRMATION-related call was made — a forged frame message
+    // must not reach assistant.pending or assistant.confirm-tool.
+    const confirmCalls = (rpcClient.call as unknown as { mock: { calls: [{ method: string }][] } }).mock.calls
+      .map(([arg]) => arg.method)
+      .filter((m) => m.startsWith('assistant.'))
+    expect(confirmCalls).toEqual([])
+
+    // 2) With a REAL confirmation open, a frame message shaped like the
+    // response must not resolve it — the response listener is for the
+    // host's own CustomEvent, not the frame's channel.
+    const releaseChat = mockChatSuspendedWithPending(PENDING_IMMICH)
+    const chat = startChat()
+    await vi.advanceTimersByTimeAsync(2000)
+    expect(confirmRequests).toHaveLength(1)
+    vi.mocked(rpcClient.call).mockClear()
+
+    window.dispatchEvent(
+      new MessageEvent('message', {
+        origin: 'http://localhost:8100',
+        data: { type: 'aiui:tool-confirm-response', reqId: 'confirm-1', approved: true },
+      }),
+    )
+    await vi.advanceTimersByTimeAsync(0)
+    expect(rpcClient.call).not.toHaveBeenCalledWith(
+      expect.objectContaining({ method: 'assistant.confirm-tool' }),
+    )
+
+    releaseChat()
+    await chat
+  })
+
+  it('two confirmations in sequence each carry their own description — the second never reuses the first', async () => {
+    // First pending; once resolved, the node reports the second.
+    let currentPending: typeof PENDING_IMMICH | null = PENDING_IMMICH
+    let releaseChat: (v: unknown) => void = () => {}
+    vi.mocked(rpcClient.call).mockImplementation((opts: { method: string }) => {
+      if (opts.method === 'assistant.chat') {
+        return new Promise<unknown>((resolve) => {
+          releaseChat = resolve
+        }) as Promise<never>
+      }
+      if (opts.method === 'assistant.pending') {
+        return Promise.resolve({ pending: currentPending }) as Promise<never>
+      }
+      if (opts.method === 'assistant.confirm-tool') {
+        return Promise.resolve({ resolved: true }) as Promise<never>
+      }
+      return Promise.resolve({}) as Promise<never>
+    })
+
+    const chat = startChat()
+    await vi.advanceTimersByTimeAsync(2000)
+    expect(confirmRequests).toHaveLength(1)
+
+    window.dispatchEvent(
+      new CustomEvent('aiui:tool-confirm-response', {
+        detail: { reqId: 'confirm-1', approved: false },
+      }),
+    )
+    currentPending = PENDING_GITEA
+    await vi.advanceTimersByTimeAsync(2000)
+
+    expect(confirmRequests).toHaveLength(2)
+    expect(confirmRequests[1]!.detail.reqId).toBe('confirm-2')
+    expect(confirmRequests[1]!.detail.description).toBe(PENDING_GITEA.description)
+    expect(confirmRequests[1]!.detail.description).not.toBe(PENDING_IMMICH.description)
+
+    releaseChat({ text: 'done' })
+    await chat
+  })
+
+  it('no response event means no resolution — the action stays pending for the node to time out, never silently approved', async () => {
+    const releaseChat = mockChatSuspendedWithPending(PENDING_IMMICH)
+    const chat = startChat()
+    await vi.advanceTimersByTimeAsync(2000)
+    expect(confirmRequests).toHaveLength(1)
+    vi.mocked(rpcClient.call).mockClear()
+
+    // The operator closes the dialog without deciding: nothing is sent.
+    await vi.advanceTimersByTimeAsync(10_000)
+    expect(rpcClient.call).not.toHaveBeenCalledWith(
+      expect.objectContaining({ method: 'assistant.confirm-tool' }),
+    )
+
+    releaseChat()
+    await chat
+  })
+})
+
+describe('tool confirmation — ToolConfirmModal (trusted chrome)', () => {
+  beforeEach(() => {
+    document.body.innerHTML = ''
+  })
+
+  afterEach(() => {
+    document.body.innerHTML = ''
+  })
+
+  it('renders as a direct child of document.body with a full-screen backdrop, showing the node-fetched text', () => {
+    const wrapper = mount(ToolConfirmModal, {
+      props: { show: true, description: PENDING_IMMICH.description },
+    })
+
+    // Teleported: the overlay renders at <body> level, OUTSIDE the
+    // component's own DOM subtree, so no ancestor transform (glass-panel
+    // or otherwise) can trap its position: fixed. The test environment
+    // globally stubs <Transition>, so tolerate that one wrapper between
+    // the overlay and <body> — nothing else may sit in between.
+    const overlay = document.body.querySelector('[data-testid="tool-confirm-overlay"]')
+    expect(overlay).toBeTruthy()
+    expect(wrapper.element.contains(overlay)).toBe(false)
+    const parent = overlay?.parentElement
+    const attachPoint =
+      parent && parent.tagName.toLowerCase() === 'transition-stub'
+        ? parent.parentElement
+        : parent
+    expect(attachPoint).toBe(document.body)
+    expect(overlay?.className).toContain('fixed')
+    expect(overlay?.className).toContain('inset-0')
+
+    const backdrop = document.body.querySelector('[data-testid="tool-confirm-backdrop"]')
+    expect(backdrop).toBeTruthy()
+    expect(backdrop?.className).toContain('inset-0')
+
+    expect(document.body.textContent).toContain(PENDING_IMMICH.description)
+    wrapper.unmount()
+  })
+
+  it('two sequential confirmations render their two different descriptions', async () => {
+    const wrapper = mount(ToolConfirmModal, {
+      props: { show: true, description: PENDING_IMMICH.description },
+    })
+    expect(document.body.textContent).toContain('immich')
+
+    await wrapper.setProps({ description: PENDING_GITEA.description })
+    expect(document.body.textContent).toContain('gitea')
+    expect(document.body.textContent).not.toContain('immich')
+    wrapper.unmount()
+  })
+
+  it('Approve emits approve, Deny emits deny — and nothing else', async () => {
+    const wrapper = mount(ToolConfirmModal, {
+      props: { show: true, description: PENDING_IMMICH.description },
+    })
+
+    const approve = document.body.querySelector(
+      '[data-testid="tool-confirm-approve"]',
+    ) as HTMLButtonElement
+    const deny = document.body.querySelector(
+      '[data-testid="tool-confirm-deny"]',
+    ) as HTMLButtonElement
+    expect(approve).toBeTruthy()
+    expect(deny).toBeTruthy()
+
+    approve.click()
+    expect(wrapper.emitted('approve')).toHaveLength(1)
+    expect(wrapper.emitted('deny')).toBeUndefined()
+
+    deny.click()
+    expect(wrapper.emitted('deny')).toHaveLength(1)
+    wrapper.unmount()
+  })
+
+  it('closing without a decision emits dismiss — never approve, never deny', async () => {
+    const wrapper = mount(ToolConfirmModal, {
+      props: { show: true, description: PENDING_IMMICH.description },
+    })
+
+    const backdrop = document.body.querySelector(
+      '[data-testid="tool-confirm-backdrop"]',
+    ) as HTMLElement
+    backdrop.click()
+
+    expect(wrapper.emitted('dismiss')).toHaveLength(1)
+    expect(wrapper.emitted('approve')).toBeUndefined()
+    expect(wrapper.emitted('deny')).toBeUndefined()
+    wrapper.unmount()
+  })
+})

neode-ui/src/services/contextBroker.ts

@@ -5,12 +5,123 @@ import type {
   AIContextCategory,
   ArchyContextResponse,
   ArchyActionResponse,
+  ArchyChatResponse,
+  ArchyChatSurface,
+  ArchyContentPush,
 } from '@/types/aiui-protocol'
 import { useAIPermissionsStore } from '@/stores/aiPermissions'
 import { useAppStore } from '@/stores/app'
 import { useContainerStore, BUNDLED_APPS } from '@/stores/container'
 import { rpcClient } from '@/api/rpc-client'
 import { fileBrowserClient } from '@/api/filebrowser-client'
+import {
+  adaptContentItems,
+  adaptLibraryTracks,
+  type ArchyContentBundle,
+  type ArchyContentItem,
+  type ArchyLibraryTrack,
+} from '@/composables/archyContentAdapter'
+
+/** Wire shape of one entry in `assistant.chat`'s `surfaces` — the raw
+ * result of a content-producing tool the turn ran, exactly as its RPC
+ * handler returned it (`crate::assistant::Surface`). Every such handler
+ * answers `{ items: [...] }`, which is what `adaptChatSurfaces` reads. */
+interface NodeChatSurface {
+  tool: string
+  scope?: string
+  data?: { items?: ArchyContentItem[] }
+}
+
+/** Wire shape of `content_owned::OwnedItem` (already-purchased peer
+ * content, cached locally). Its fields don't match `ArchyContentItem` —
+ * this is intentional; `normalizeOwnedItem` below bridges the gap rather
+ * than widening the adapter's input type for one RPC's shape. */
+interface OwnedRpcItem {
+  onion: string
+  content_id: string
+  filename: string
+  mime_type: string
+  size_bytes: number
+  paid_sats: number
+  purchased_at: string
+}
+
+/** An already-purchased item is, by definition, unlocked for this node —
+ * map it to `access: 'free'` regardless of what the seller's catalog
+ * still shows other buyers, so the adapter doesn't lock a card the user
+ * already paid for. */
+function normalizeOwnedItem(owned: OwnedRpcItem): ArchyContentItem {
+  return {
+    id: owned.content_id,
+    filename: owned.filename,
+    mime_type: owned.mime_type,
+    size_bytes: owned.size_bytes,
+    description: '',
+    access: 'free',
+    added_at: owned.purchased_at,
+  }
+}
+
+/** Wire shape of `assistant.pending`'s response payload: the node-authored
+ * description and the node-minted nonce for the one pending destructive
+ * action (13-08, D-07/D-11). The description is drawn by the HOST chrome
+ * (ToolConfirmModal.vue), never by AIUI — and it reaches the page over the
+ * authenticated RPC session only, never over the iframe's postMessage
+ * channel, so the frame cannot forge or restyle it. */
+interface PendingToolConfirm {
+  req_id: string
+  nonce: string
+  description: string
+  tool_name?: string
+}
+
+function emptyBundle(): ArchyContentBundle {
+  return { films: [], songs: [], podcasts: [], images: [] }
+}
+
+function mergeBundles(bundles: ArchyContentBundle[]): ArchyContentBundle {
+  return bundles.reduce<ArchyContentBundle>(
+    (acc, cur) => ({
+      films: [...acc.films, ...cur.films],
+      songs: [...acc.songs, ...cur.songs],
+      podcasts: [...acc.podcasts, ...cur.podcasts],
+      images: [...acc.images, ...cur.images],
+    }),
+    emptyBundle(),
+  )
+}
+
+/**
+ * Ceiling on one `context:request` gather. Comfortably above a healthy
+ * File Browser round trip (login + usage + list) and far below AIUI's own
+ * bridge timeout, so a stall surfaces here as an empty category rather than
+ * there as a dead request.
+ */
+const CONTEXT_FETCH_TIMEOUT_MS = 10_000
+
+/**
+ * Resolve to `null` if `p` has not settled within `ms`.
+ *
+ * Deliberately resolves rather than rejects: the caller's job is to always
+ * post a `context:response`, and a rejection would just move the problem to
+ * a catch block. The pending promise is left to finish on its own — nothing
+ * downstream reads it once we have answered.
+ */
+function withTimeout<T>(p: Promise<T>, ms: number): Promise<T | null> {
+  return new Promise((resolve) => {
+    const timer = setTimeout(() => resolve(null), ms)
+    p.then(
+      (v) => {
+        clearTimeout(timer)
+        resolve(v)
+      },
+      () => {
+        clearTimeout(timer)
+        resolve(null)
+      },
+    )
+  })
+}
 
 /**
  * Context Broker — mediates all communication between AIUI (iframe) and Archy.
@@ -23,6 +134,43 @@ export class ContextBroker {
   private iframe: Ref<HTMLIFrameElement | null>
   private allowedOrigin: string
   private listener: ((e: MessageEvent) => void) | null = null
+  /** Per-(kind, scope) content-request sequence — the AIUI-03 concurrency
+   * guard. Each `handleContentRequest` call captures its own sequence number
+   * before awaiting the RPC(s); if a newer request FOR THE SAME kind+scope
+   * has started by the time it resolves, its result is discarded, so a slow
+   * response can never overwrite fresher grid data.
+   *
+   * Keyed rather than global. A single shared counter made different kinds
+   * cancel each other: `useArchy.ts` init fires `content('all','own')` and
+   * `library('own')` back to back, both sequence numbers are assigned
+   * synchronously before either awaits, so the first request ALWAYS resolved
+   * with a stale number and was dropped — films, podcasts and own files never
+   * reached the grid and only music ever did. Different kinds populate
+   * different grids and cannot stale each other by definition; only a newer
+   * request for the same grid can. */
+  private contentRequestSeq = new Map<string, number>()
+
+  /** 13-08: how often the broker asks the node for a pending destructive-
+   * tool confirmation while a chat turn is in flight. The node's loop is
+   * suspended on its confirm gate during that window, so this poll is what
+   * turns "the node is waiting on a human" into a visible dialog. */
+  private static readonly CONFIRM_POLL_MS = 1200
+
+  /** How long the one-shot aiui:tool-confirm-response listener stays armed
+   * before being cleaned up — slightly beyond the node's own CONFIRM_TIMEOUT
+   * (300s since 13-08's UAT bump; was 120s), after which the node has
+   * already declined the action itself. Must stay ABOVE the node timeout:
+   * a TTL below it disarms the listener while the dialog is still
+   * legitimately open, and an approve clicked in that window goes nowhere
+   * until the next poll re-announces. */
+  private static readonly CONFIRM_LISTENER_TTL_MS = 310_000
+
+  private confirmPollTimer: ReturnType<typeof setInterval> | null = null
+  /** Chat turns currently in flight — polling runs while > 0. */
+  private activeChatTurns = 0
+  /** req_ids already announced to the host chrome, so one pending action is
+   * dialogued exactly once no matter how many polls observe it. */
+  private announcedConfirmReqIds = new Set<string>()
 
   constructor(iframe: Ref<HTMLIFrameElement | null>, aiuiUrl: string) {
     this.iframe = iframe
@@ -35,6 +183,14 @@ export class ContextBroker {
   }
 
   start() {
+    // Grants live on the NODE, not in this browser. localStorage is per-origin
+    // and a node answers on several addresses (LAN, Tailscale, <host>.local),
+    // so a perfectly granted permission can read as denied at a second origin.
+    // Reconcile ONCE here rather than inside each permission gate: the gates
+    // are on the hot path, and an await there would add an RPC to every
+    // content and context request.
+    void useAIPermissionsStore().hydrate()
+
     this.listener = (e: MessageEvent) => this.handleMessage(e)
     window.addEventListener('message', this.listener)
   }
@@ -44,6 +200,11 @@ export class ContextBroker {
       window.removeEventListener('message', this.listener)
       this.listener = null
     }
+    if (this.confirmPollTimer) {
+      clearInterval(this.confirmPollTimer)
+      this.confirmPollTimer = null
+    }
+    this.activeChatTurns = 0
   }
 
   sendPermissionsUpdate() {
@@ -81,6 +242,360 @@ export class ContextBroker {
       case 'theme:request':
         this.sendTheme()
         break
+      case 'chat:request':
+        this.handleChatRequest(msg.id, msg.text)
+        break
+      case 'content:request':
+        this.handleContentRequest(msg.id, msg.kind, msg.scope)
+        break
+      // Deliberately NO arm for anything confirmation-shaped (13-08,
+      // D-11): a frame message whose `type` resembles a tool confirmation
+      // falls through here and is ignored. The confirmation dialog is
+      // opened only from assistant.pending's RPC response and resolved
+      // only via the host's own aiui:tool-confirm-response CustomEvent —
+      // asserted by iframe_message_cannot_open_or_resolve_confirmation.
+    }
+  }
+
+  // Note: no permission category is threaded through here on purpose.
+  // Authority for a chat turn is resolved node-side from the RPC session's
+  // CallerScope (assistant.chat, core/archipelago/src/assistant/mod.rs) —
+  // duplicating a browser-side gate here would recreate the second,
+  // divergent security model D-02 exists to prevent. Do not "helpfully"
+  // add a permission check back into this handler.
+  private async handleChatRequest(id: string, text: string) {
+    // 13-08: while this turn is in flight the node may suspend on its
+    // confirm gate waiting for a human — poll assistant.pending so the
+    // trusted chrome can draw the dialog (see handleToolConfirmRequest).
+    this.beginConfirmPolling()
+    try {
+      // 13-08 UAT: a chat turn legitimately spans multiple model round
+      // trips (ASSISTANT_HTTP_TIMEOUT 180s each) plus a human-speed
+      // confirm-gate wait (CONFIRM_TIMEOUT 300s). The rpcClient default
+      // (15s) aborted every confirmable turn client-side while the node
+      // kept the pending confirmation alive — the modal then re-announced
+      // on the next turn, over and over. 420s must stay below AIUI's
+      // bridge timeout (430s) so this error, not the bridge's, is the one
+      // the user sees.
+      const result = await rpcClient.call<{
+        text: string
+        surfaces?: NodeChatSurface[]
+        refused_categories?: string[]
+      }>({
+        method: 'assistant.chat',
+        params: { text },
+        timeout: 420_000,
+      })
+      // A tool was blocked by an ungranted category. Offer the toggle in
+      // the TRUSTED chrome — the iframe must not be able to draw anything
+      // that looks like a permission prompt (same reasoning as the confirm
+      // dialog), and the model's own "I don't have a tool for that" gives
+      // the operator no idea the capability is one switch away.
+      if (result.refused_categories?.length) {
+        window.dispatchEvent(
+          new CustomEvent('aiui:permission-needed', {
+            detail: { categories: result.refused_categories },
+          }),
+        )
+      }
+      this.postToIframe({
+        type: 'chat:response',
+        id,
+        success: true,
+        text: result.text,
+        surfaces: this.adaptChatSurfaces(result.surfaces),
+      } satisfies ArchyChatResponse)
+    } catch (err) {
+      this.postToIframe({
+        type: 'chat:response',
+        id,
+        success: false,
+        error: err instanceof Error ? err.message : 'Chat request failed',
+      } satisfies ArchyChatResponse)
+    } finally {
+      this.endConfirmPolling()
+    }
+  }
+
+  /**
+   * Turn the node's raw content-tool results into the SAME adapted grid
+   * records `content:push` already delivers, so AIUI renders them with
+   * the film/song/image components it has rather than needing a second,
+   * chat-only shape.
+   *
+   * Gated on media/files exactly like `handleContentRequest`: this
+   * carries node data (own files, peer catalogues, purchases) into the
+   * iframe, so it is a consent surface and is checked HERE rather than
+   * trusting the node's own grant check to be the only one. Dropping the
+   * surfaces never drops the answer — the prose still goes through.
+   */
+  private adaptChatSurfaces(surfaces?: NodeChatSurface[]): ArchyChatSurface[] | undefined {
+    if (!surfaces?.length) return undefined
+    const perms = useAIPermissionsStore()
+    if (!perms.isEnabled('media') && !perms.isEnabled('files')) return undefined
+
+    const adapted = surfaces.flatMap((s) => {
+      const items = Array.isArray(s.data?.items) ? s.data.items : []
+      if (!items.length) return []
+      // The adapter uses `source` to decide the badge and how a playable
+      // URL is built, so a wrong value renders a peer's paid item as
+      // freely local — map each scope to what it actually is. Two scopes
+      // need more than a label:
+      //
+      // `purchased` arrives as OwnedRpcItem (content_id/onion/paid_sats),
+      // not ArchyContentItem — normalize per item AND carry the seller's
+      // onion, or the card adapts with id=undefined and url='' and renders
+      // as a permanent placeholder (the live "shows a placeholder" bug).
+      if (s.scope === 'purchased') {
+        const bundles = (items as unknown as OwnedRpcItem[]).map((owned) =>
+          adaptContentItems([normalizeOwnedItem(owned)], { source: 'peer', peerOnion: owned.onion }),
+        )
+        return [{ tool: s.tool, scope: s.scope, bundle: mergeBundles(bundles) }]
+      }
+      // `peers` items each carry their seller's onion (the node stamps
+      // `peer` per item in the fan-out) — adapt per-peer or every URL
+      // comes out '' (`buildMediaUrl` refuses peer URLs without one).
+      if (s.scope === 'peers') {
+        const byOnion = new Map<string, ArchyContentItem[]>()
+        for (const it of items) {
+          const peer: unknown = (it as { peer?: unknown }).peer
+          const onion = typeof peer === 'string' ? peer : ''
+          if (!onion) continue
+          byOnion.set(onion, [...(byOnion.get(onion) ?? []), it])
+        }
+        const bundles = [...byOnion.entries()].map(([onion, its]) =>
+          adaptContentItems(its, { source: 'peer', peerOnion: onion }),
+        )
+        return [{ tool: s.tool, scope: s.scope, bundle: mergeBundles(bundles) }]
+      }
+      const source = s.scope === 'films' ? 'indeehub' : 'own'
+      return [{ tool: s.tool, scope: s.scope, bundle: adaptContentItems(items, { source }) }]
+    })
+    return adapted.length ? adapted : undefined
+  }
+
+  private beginConfirmPolling() {
+    this.activeChatTurns += 1
+    if (this.confirmPollTimer) return
+    this.confirmPollTimer = setInterval(() => {
+      void this.checkPendingConfirmation()
+    }, ContextBroker.CONFIRM_POLL_MS)
+  }
+
+  private endConfirmPolling() {
+    this.activeChatTurns = Math.max(0, this.activeChatTurns - 1)
+    if (this.activeChatTurns === 0 && this.confirmPollTimer) {
+      clearInterval(this.confirmPollTimer)
+      this.confirmPollTimer = null
+      // The turn is over, so any confirmation still on screen is dead —
+      // either it was resolved (dialog already closed) or the node's
+      // timeout declined it while the human was still reading.
+      this.expireStaleConfirms()
+    }
+  }
+
+  private async checkPendingConfirmation() {
+    try {
+      const res = await rpcClient.call<{ pending: PendingToolConfirm | null }>({
+        method: 'assistant.pending',
+      })
+      this.expireStaleConfirms(res?.pending?.req_id)
+      if (res?.pending) this.handleToolConfirmRequest(res.pending)
+    } catch {
+      // Transient RPC failure — the next poll retries; the node's own
+      // timeout is the backstop, and it declines rather than approves.
+    }
+  }
+
+  /** 13-08 on-device UAT: when a pending confirmation vanishes node-side
+   * (timed out, or resolved from another session) while the trusted chrome
+   * still shows its dialog, tell the chrome to close it. An approval
+   * clicked after expiry can only be refused by the node — leaving the
+   * dialog up invites exactly that dead click. Same host-only CustomEvent
+   * discipline as the request/response pair: the iframe has no path to
+   * dispatch or observe this. */
+  private expireStaleConfirms(currentReqId?: string) {
+    for (const id of [...this.announcedConfirmReqIds]) {
+      if (id === currentReqId) continue
+      this.announcedConfirmReqIds.delete(id)
+      window.dispatchEvent(new CustomEvent('aiui:tool-confirm-expired', { detail: { reqId: id } }))
+    }
+  }
+
+  /**
+   * 13-08 (D-07/D-11): announce one node-reported pending confirmation to
+   * the trusted chrome, and arm a one-shot listener for the host's answer.
+   *
+   * Anti-spoofing invariants, all load-bearing:
+   * - The description and nonce arrive here ONLY from assistant.pending's
+   *   RPC response — never from the iframe (there is no handleMessage arm
+   *   for anything confirmation-shaped, deliberately).
+   * - The CustomEvent pair (`aiui:tool-confirm-request` /
+   *   `aiui:tool-confirm-response`) is NEW and distinct from the
+   *   install-app pair — an install confirmation and a tool confirmation
+   *   must never be interchangeable.
+   * - The response listener listens for the host page's own CustomEvent on
+   *   window. An iframe cannot dispatch that (its postMessage arrives as a
+   *   MessageEvent, which this method never reads), so the decision path
+   *   is host-only.
+   * - The user's decision travels to the node over the authenticated RPC
+   *   session (assistant.confirm-tool) carrying the node-minted nonce —
+   *   never back through the frame.
+   * - No response is ever synthesized: if the host closes the dialog
+   *   without deciding, nothing is sent, and the node's own timeout
+   *   declines the action.
+   */
+  handleToolConfirmRequest(pending: PendingToolConfirm) {
+    if (!pending?.req_id || !pending.nonce || typeof pending.description !== 'string') return
+    if (this.announcedConfirmReqIds.has(pending.req_id)) return
+    this.announcedConfirmReqIds.add(pending.req_id)
+
+    const reqId = pending.req_id
+    const nonce = pending.nonce
+
+    const responseHandler = (e: Event) => {
+      const detail = (e as CustomEvent).detail as { reqId?: string; approved?: boolean }
+      if (detail?.reqId !== reqId) return
+      window.removeEventListener('aiui:tool-confirm-response', responseHandler)
+      void rpcClient
+        .call({
+          method: 'assistant.confirm-tool',
+          params: { req_id: reqId, nonce, approved: detail.approved === true },
+        })
+        .catch(() => {
+          // A refused resolution (stale nonce, already timed out) is the
+          // node protecting itself — nothing to retry from here.
+        })
+    }
+    window.addEventListener('aiui:tool-confirm-response', responseHandler)
+    setTimeout(() => {
+      window.removeEventListener('aiui:tool-confirm-response', responseHandler)
+      this.announcedConfirmReqIds.delete(reqId)
+    }, ContextBroker.CONFIRM_LISTENER_TTL_MS)
+
+    // Only node-fetched values travel to the chrome — and not the nonce:
+    // it stays in this closure and reappears only on the RPC call above.
+    window.dispatchEvent(
+      new CustomEvent('aiui:tool-confirm-request', {
+        detail: { reqId, description: pending.description, toolName: pending.tool_name },
+      }),
+    )
+  }
+
+  // Content surfaces (D-12/D-14, AIUI-03) — a single generic channel with a
+  // `kind` discriminator rather than one channel per content type, so
+  // 13-11's music-library wave can extend `kind` without touching this
+  // file again. Unlike `chat:request`, this channel carries node data
+  // (peer files, this node's own shared files, IndeeHub, owned/paid
+  // content) INTO the iframe, so it is a consent surface: gated on the
+  // media/files permission categories, checked here rather than trusting
+  // AIUI to have asked honestly (T-13-33).
+  private async handleContentRequest(id: string, kind: string, scope?: string) {
+    const perms = useAIPermissionsStore()
+    if (!perms.isEnabled('media') && !perms.isEnabled('files')) {
+      this.postToIframe({
+        type: 'content:push',
+        id,
+        kind,
+        permitted: false,
+        ...emptyBundle(),
+      } satisfies ArchyContentPush)
+      return
+    }
+
+    const requestedScope: 'own' | 'peers' | 'owned' =
+      scope === 'peers' || scope === 'owned' ? scope : 'own'
+    const seqKey = `${kind}:${requestedScope}`
+    const seq = (this.contentRequestSeq.get(seqKey) ?? 0) + 1
+    this.contentRequestSeq.set(seqKey, seq)
+
+    // 13-11: 'library' is the one kind value this wave adds — it resolves
+    // to music.list-tracks (real tag-extracted metadata) instead of
+    // content.* (see aiui-protocol.ts's AIUIContentRequest doc comment).
+    const bundle =
+      kind === 'library' ? await this.fetchLibraryContent() : await this.fetchAdaptedContent(requestedScope)
+
+    // Stale-response guard: a newer content:request for this same kind+scope
+    // has since started — discard this result instead of flipping that grid
+    // back to older data (AIUI-03 concurrency edge).
+    if (seq !== this.contentRequestSeq.get(seqKey)) return
+
+    this.postToIframe({
+      type: 'content:push',
+      id,
+      kind,
+      permitted: true,
+      ...bundle,
+    } satisfies ArchyContentPush)
+  }
+
+  /**
+   * Resolve one RPC call (or, for `peers`, a fan-out over every known
+   * federation peer) into an adapted content bundle. The iframe never
+   * chooses the RPC method or its params — only `scope` (an enum) reaches
+   * here, and this function is the only place that turns it into a
+   * `content.*` method name (T-13-34).
+   */
+  private async fetchAdaptedContent(scope: 'own' | 'peers' | 'owned'): Promise<ArchyContentBundle> {
+    try {
+      if (scope === 'own') {
+        const res = await rpcClient.call<{ items: ArchyContentItem[] }>({ method: 'content.list-mine' })
+        return adaptContentItems(res.items ?? [], { source: 'own' })
+      }
+
+      if (scope === 'owned') {
+        const res = await rpcClient.call<{ items: OwnedRpcItem[] }>({ method: 'content.owned-list' })
+        return mergeBundles(
+          (res.items ?? []).map((owned) =>
+            adaptContentItems([normalizeOwnedItem(owned)], { source: 'peer', peerOnion: owned.onion }),
+          ),
+        )
+      }
+
+      // scope === 'peers' — aggregate every known federation peer's catalog.
+      // Any single peer's browse failing (offline, Tor timeout) does not
+      // fail the whole request; it just contributes an empty bundle.
+      const { nodes } = await rpcClient.federationListNodes()
+      const onions = (nodes ?? []).map((n) => n.onion).filter((onion): onion is string => !!onion)
+      const perPeer = await Promise.all(
+        onions.map((onion) =>
+          rpcClient
+            .call<{ items: ArchyContentItem[] }>({ method: 'content.browse-peer', params: { onion } })
+            .then((res) => adaptContentItems(res.items ?? [], { source: 'peer', peerOnion: onion }))
+            .catch(() => emptyBundle()),
+        ),
+      )
+      return mergeBundles(perPeer)
+    } catch {
+      return emptyBundle()
+    }
+  }
+
+  /**
+   * 13-11: resolve a `content:request` whose `kind` is `'library'`. Calls
+   * `music.list-tracks` (13-07) directly, not `content.*` — a library
+   * track carries real tag-extracted metadata (artist/album/duration)
+   * `ContentItem` has no field for at all, so `adaptContentItems`'s
+   * generic mapping cannot produce it (`adaptToSong` always sets
+   * `artist: ''`). `music.*` rides the same authenticated session as every
+   * other RPC this broker calls; no separate permission check is added
+   * here beyond `handleContentRequest`'s existing media/files gate, which
+   * already ran before this is reached. A page cap of 500 matches
+   * `music.list-tracks`'s own `MAX_TRACK_LIMIT` (T-13-41/T-13-73) — this
+   * is the one-page-at-a-time truth the RPC itself enforces, not a second
+   * cap invented here. Any failure (no index yet, RPC error) degrades to
+   * an empty songs bucket rather than failing the whole request, matching
+   * `fetchAdaptedContent`'s own error handling below.
+   */
+  private async fetchLibraryContent(): Promise<ArchyContentBundle> {
+    try {
+      const res = await rpcClient.call<{ tracks: ArchyLibraryTrack[] }>({
+        method: 'music.list-tracks',
+        params: { limit: 500 },
+      })
+      return { ...emptyBundle(), songs: adaptLibraryTracks(res.tracks ?? []) }
+    } catch {
+      return emptyBundle()
     }
   }
 
@@ -97,7 +612,19 @@ export class ContextBroker {
       return
     }
 
-    const data = await this.fetchAndSanitize(category, query)
+    // Always answer, even if the gatherer never settles. `sanitizeFiles`
+    // makes three sequential calls into the File Browser app (login, usage,
+    // list) and `sanitizeSystem` awaits the app store; a connection that
+    // HANGS rather than erroring leaves their promise pending forever, so no
+    // `context:response` is ever posted and the AIUI side waits out its own
+    // bridge timeout instead. That is the reported "`files` context request
+    // times out" — the try/catch in sanitizeFiles only covers rejection, and
+    // a stalled socket does not reject.
+    //
+    // A late `null` is safe by the protocol's own shape: the AIUI reader
+    // treats a response with no usable `data` as "nothing to show" and logs
+    // nothing, exactly as it already does for an empty category.
+    const data = await withTimeout(this.fetchAndSanitize(category, query), CONTEXT_FETCH_TIMEOUT_MS)
     this.postToIframe({
       type: 'context:response',
       id,

neode-ui/src/stores/__tests__/aiPermissions.test.ts

@@ -1,6 +1,9 @@
 import { describe, it, expect, vi, beforeEach } from 'vitest'
 import { setActivePinia, createPinia } from 'pinia'
 import { useAIPermissionsStore, AI_PERMISSION_CATEGORIES } from '../aiPermissions'
+import { rpcClient } from '@/api/rpc-client'
+
+vi.mock('@/api/rpc-client', () => ({ rpcClient: { call: vi.fn() } }))
 
 const STORAGE_KEY = 'archipelago-ai-permissions'
 
@@ -103,4 +106,79 @@ describe('useAIPermissionsStore', () => {
       expect(cat.group).toBeTruthy()
     }
   })
+
+  describe('node-side persistence (grants are a property of the node, not a browser)', () => {
+    it('MIGRATES local grants up when the node has none — never silently revokes them', async () => {
+      // Everyone who granted permissions before this change has them only in
+      // localStorage. An empty node must not wipe that on first hydrate.
+      localStorage.setItem(STORAGE_KEY, JSON.stringify(['media', 'files']))
+      const store = useAIPermissionsStore()
+      vi.mocked(rpcClient.call).mockResolvedValueOnce({ granted: [] } as never)
+
+      await store.hydrate()
+
+      expect(store.isEnabled('media')).toBe(true)
+      expect(store.isEnabled('files')).toBe(true)
+      expect(vi.mocked(rpcClient.call).mock.calls.some(
+        ([a]) => (a as { method?: string }).method === 'ai.permissions.set',
+      )).toBe(true)
+    })
+
+    it('adopts the node grants on a browser that has none — the new-device case', async () => {
+      const store = useAIPermissionsStore()
+      vi.mocked(rpcClient.call).mockResolvedValueOnce({ granted: ['wallet'] } as never)
+
+      await store.hydrate()
+
+      expect(store.isEnabled('wallet')).toBe(true)
+      // and it is cached locally so the next paint is instant
+      expect(JSON.parse(localStorage.getItem(STORAGE_KEY) || '[]')).toContain('wallet')
+    })
+
+    it('lets the node REVOKE a grant this browser still remembers', async () => {
+      // The node is authoritative. A revocation made elsewhere must win, or
+      // revoking would be impossible from any second device.
+      localStorage.setItem(STORAGE_KEY, JSON.stringify(['media', 'wallet']))
+      const store = useAIPermissionsStore()
+      vi.mocked(rpcClient.call).mockResolvedValueOnce({ granted: ['media'] } as never)
+
+      await store.hydrate()
+
+      expect(store.isEnabled('media')).toBe(true)
+      expect(store.isEnabled('wallet')).toBe(false)
+    })
+
+    it('keeps local grants when the node is unreachable rather than blanking them', async () => {
+      localStorage.setItem(STORAGE_KEY, JSON.stringify(['media']))
+      const store = useAIPermissionsStore()
+      vi.mocked(rpcClient.call).mockRejectedValueOnce(new Error('offline'))
+
+      await store.hydrate()
+
+      expect(store.isEnabled('media')).toBe(true)
+      expect(store.hydrated).toBe(true)
+    })
+
+    it('ignores categories the node reports that this build does not know', async () => {
+      const store = useAIPermissionsStore()
+      vi.mocked(rpcClient.call).mockResolvedValueOnce({ granted: ['media', 'not-a-category'] } as never)
+
+      await store.hydrate()
+
+      expect(store.isEnabled('media')).toBe(true)
+      expect(store.enabledCategories).not.toContain('not-a-category')
+    })
+
+    it('pushes every toggle to the node', async () => {
+      const store = useAIPermissionsStore()
+      vi.mocked(rpcClient.call).mockResolvedValue({ granted: [] } as never)
+
+      store.toggle('media')
+      await Promise.resolve()
+
+      expect(vi.mocked(rpcClient.call).mock.calls.some(
+        ([a]) => (a as { method?: string }).method === 'ai.permissions.set',
+      )).toBe(true)
+    })
+  })
 })

neode-ui/src/stores/aiPermissions.ts

@@ -1,6 +1,7 @@
 import { defineStore } from 'pinia'
 import { ref, computed } from 'vue'
 import type { AIContextCategory } from '@/types/aiui-protocol'
+import { rpcClient } from '@/api/rpc-client'
 
 const STORAGE_KEY = 'archipelago-ai-permissions'
 
@@ -97,7 +98,66 @@ export const AI_PERMISSION_CATEGORIES: AIPermissionCategory[] = [
 ]
 
 export const useAIPermissionsStore = defineStore('aiPermissions', () => {
+  // Seeded from localStorage so the toggles paint immediately, then reconciled
+  // with the node in hydrate(). The node is authoritative.
   const enabled = ref<Set<AIContextCategory>>(loadFromStorage())
+  const hydrated = ref(false)
+
+  /**
+   * Reconcile with the node, which is where these grants actually live.
+   *
+   * They used to live ONLY in localStorage, which is scoped to an origin — and
+   * a node answers on several (LAN address, Tailscale address, <host>.local,
+   * hostname). Granting over one and returning by another showed every switch
+   * off again: not reset, just never set *there*. Reported as "the AI Data
+   * Access settings are not persistent through sessions", and it made a working
+   * content path look broken, because every scope silently returns nothing
+   * without a grant.
+   *
+   * Migration, not replacement: if this browser holds grants and the node holds
+   * none, the local set is pushed UP rather than being wiped by an empty node.
+   * That covers everyone who granted permissions before this change — without
+   * it, upgrading would silently revoke them. The reverse (node has grants,
+   * browser does not) is the normal case on a new device and the node wins.
+   */
+  async function hydrate(): Promise<void> {
+    try {
+      const res = await rpcClient.call<{ granted?: string[] }>({ method: 'ai.permissions.get' })
+      const remote = new Set(
+        (res.granted ?? []).filter((c): c is AIContextCategory =>
+          AI_PERMISSION_CATEGORIES.some(cat => cat.id === c),
+        ),
+      )
+
+      if (remote.size === 0 && enabled.value.size > 0) {
+        await pushToNode()
+      } else {
+        enabled.value = remote
+        save()
+      }
+    } catch (e) {
+      // Offline, or a node too old to know the method: keep whatever
+      // localStorage had. Degrading to the old behaviour is strictly better
+      // than blanking the operator's grants because a request failed.
+      if (import.meta.env.DEV) console.warn('AI permissions: node unreachable, using local', e)
+    } finally {
+      hydrated.value = true
+    }
+  }
+
+  async function pushToNode(): Promise<void> {
+    try {
+      await rpcClient.call({
+        method: 'ai.permissions.set',
+        params: { granted: [...enabled.value] },
+      })
+    } catch (e) {
+      // The local write already happened, so the UI stays consistent with what
+      // the operator just clicked; it will be pushed again on the next change
+      // or the next hydrate().
+      if (import.meta.env.DEV) console.warn('AI permissions: failed to persist to node', e)
+    }
+  }
 
   function loadFromStorage(): Set<AIContextCategory> {
     try {
@@ -130,16 +190,19 @@ export const useAIPermissionsStore = defineStore('aiPermissions', () => {
     // Trigger reactivity
     enabled.value = new Set(enabled.value)
     save()
+    void pushToNode()
   }
 
   function enableAll() {
     enabled.value = new Set(AI_PERMISSION_CATEGORIES.map(c => c.id))
     save()
+    void pushToNode()
   }
 
   function disableAll() {
     enabled.value = new Set()
     save()
+    void pushToNode()
   }
 
   const enabledCategories = computed(() => [...enabled.value])
@@ -148,6 +211,8 @@ export const useAIPermissionsStore = defineStore('aiPermissions', () => {
 
   return {
     enabled,
+    hydrated,
+    hydrate,
     isEnabled,
     toggle,
     enableAll,

neode-ui/src/stores/container.ts

@@ -95,6 +95,10 @@ export const useContainerStore = defineStore('container', () => {
   const containers = ref<ContainerStatus[]>([])
   const healthStatus = ref<Record<string, string>>({})
   const loading = ref(false)
+  /** Whether the container list has been successfully fetched at least
+   * once. Without this, an empty list is ambiguous — see `ensureFetched`. */
+  const fetched = ref(false)
+  let inFlightFetch: Promise<void> | null = null
   const loadingApps = ref<Set<string>>(new Set()) // Track loading state per app
   const error = ref<string | null>(null)
 
@@ -198,6 +202,7 @@ export const useContainerStore = defineStore('container', () => {
     error.value = null
     try {
       containers.value = await containerClient.listContainers()
+      fetched.value = true
     } catch (e) {
       error.value = e instanceof Error ? e.message : 'Failed to fetch containers'
       if (import.meta.env.DEV) console.error('Failed to fetch containers:', e)
@@ -206,6 +211,24 @@ export const useContainerStore = defineStore('container', () => {
     }
   }
 
+  /**
+   * Resolve the container list ONCE before a decision that depends on
+   * whether an app exists. `getAppState` cannot distinguish "not installed"
+   * from "not fetched yet" — both look like an empty list — so any caller
+   * that would take a DIFFERENT, user-visible path on "not installed"
+   * (tx links falling back to a third-party explorer, for one) must await
+   * this first. Concurrent callers share the one in-flight request.
+   */
+  async function ensureFetched(): Promise<void> {
+    if (fetched.value) return
+    if (!inFlightFetch) {
+      inFlightFetch = fetchContainers().finally(() => {
+        inFlightFetch = null
+      })
+    }
+    await inFlightFetch
+  }
+
   async function fetchHealthStatus() {
     try {
       healthStatus.value = await containerClient.getHealthStatus()
@@ -354,6 +377,8 @@ export const useContainerStore = defineStore('container', () => {
     getAppVisualState,
     enrichedBundledApps,
     // Actions
+    fetched,
+    ensureFetched,
     fetchContainers,
     fetchHealthStatus,
     installApp,

neode-ui/src/types/aiui-protocol.ts

@@ -5,6 +5,8 @@
  * Archy acts as a context broker — AIUI never directly accesses node data.
  */
 
+import type { ArchyContentBundle } from '@/composables/archyContentAdapter'
+
 /** Data categories that AIUI can request access to */
 export type AIContextCategory =
   | 'apps'
@@ -45,11 +47,44 @@ export interface AIUIThemeRequest {
   type: 'theme:request'
 }
 
+/**
+ * A chat turn from AIUI's embedded-mode client. Carries only the raw user
+ * text — tool selection is node-side (D-01/D-03) and must never be
+ * expressible as an AIUI-originated action, so this is deliberately NOT an
+ * `AIActionType` member.
+ */
+export interface AIUIChatRequest {
+  type: 'chat:request'
+  id: string
+  text: string
+}
+
+/**
+ * A content-grid request from AIUI's embedded-mode client. Carries only a
+ * `kind` discriminator and an optional `scope` — the iframe never names an
+ * RPC method or params (T-13-34); the broker decides the call. A single
+ * generic channel (not one per content type) so 13-11's music-library wave
+ * can extend `kind` without touching this file again.
+ *
+ * `'library'` (13-11) is the one addition this wave makes to the
+ * discriminator: it routes to `music.list-tracks` (13-07) instead of
+ * `content.*`, since a library track carries real tag-extracted metadata
+ * (artist/album/duration) that `ContentItem` has no field for at all.
+ */
+export interface AIUIContentRequest {
+  type: 'content:request'
+  id: string
+  kind: 'films' | 'songs' | 'podcasts' | 'all' | 'library'
+  scope?: 'own' | 'peers' | 'owned'
+}
+
 export type AIUIRequest =
   | AIUIContextRequest
   | AIUIActionRequest
   | AIUIReadyMessage
   | AIUIThemeRequest
+  | AIUIChatRequest
+  | AIUIContentRequest
 
 // ─── Archy → AIUI (Responses) ──────────────────────────────────────────────
 
@@ -81,11 +116,54 @@ export interface ArchyPermissionsUpdate {
   categories: AIContextCategory[]
 }
 
+/** The node's answer to a `chat:request`. On RPC failure, `error` carries
+ * only the error message — never the raw exception object. */
+export interface ArchyChatResponse {
+  type: 'chat:response'
+  id: string
+  success: boolean
+  text?: string
+  error?: string
+  /** Content-producing tool results from this turn, already adapted into
+   * the same grid records `content:push` delivers, so AIUI can RENDER
+   * what the answer describes instead of leaving its surface empty
+   * beside a correct paragraph. Absent when the turn ran no such tool. */
+  surfaces?: ArchyChatSurface[]
+}
+
+/** One content tool result from a chat turn. `scope` is the tool's own
+ * argument (`own` | `peers` | `purchased` | `films`) — it is what lets the
+ * surface title itself with what was actually asked for rather than
+ * inferring it from the payload's shape. */
+export interface ArchyChatSurface {
+  tool: string
+  scope?: string
+  bundle: ArchyContentBundle
+}
+
+/**
+ * The node's answer to a `content:request` — adapted grid records
+ * (`archyContentAdapter.ts`'s `adaptContentItems` output) for whichever
+ * buckets the RPC scope produced. `permitted: false` means neither the
+ * `media` nor the `files` category is granted (content:request is treated
+ * as permitted if either is enabled — see `handleContentRequest`); the
+ * three arrays are empty in that case, never omitted, so AIUI can render an
+ * empty-state instead of hanging on an unresolved request.
+ */
+export type ArchyContentPush = {
+  type: 'content:push'
+  id: string
+  kind: string
+  permitted: boolean
+} & Partial<ArchyContentBundle>
+
 export type ArchyResponse =
   | ArchyContextResponse
   | ArchyActionResponse
   | ArchyThemeResponse
   | ArchyPermissionsUpdate
+  | ArchyChatResponse
+  | ArchyContentPush
 
 // ─── All messages ───────────────────────────────────────────────────────────
 

neode-ui/src/views/Chat.vue

@@ -30,7 +30,17 @@
       </div>
     </Transition>
 
-    <!-- AIUI iframe — on mobile, leave room for close bar + tab bar at bottom -->
+    <!-- AIUI iframe — on mobile, leave room for close bar + tab bar at bottom.
+         No `sandbox` attribute: it was considered and rejected for this
+         phase (AIUI-04, 13-RESEARCH.md Open Question 2). `allow-scripts`
+         together with `allow-same-origin` is the well-known escape pattern,
+         and dropping `allow-same-origin` moves AIUI to an opaque origin,
+         breaking its storage and its origin-checked postMessage bridge — a
+         change bigger than this phase budgeted. The enforced boundary
+         instead is the /aiui/-scoped Content-Security-Policy (nginx) plus
+         the node-side rate limit (G-B3, 13-12); the residual risk (a
+         browser that ignores or partially enforces CSP) is named in
+         13-AI-SPEC.md §6, not silently assumed away. -->
     <iframe
       v-if="aiuiUrl"
       ref="aiuiFrame"
@@ -38,6 +48,7 @@
       :title="t('chat.aiAssistant')"
       class="chat-iframe chat-iframe-mobile"
       allow="microphone"
+      referrerpolicy="no-referrer"
       style="background: transparent"
     />
 
@@ -59,19 +70,67 @@
       </div>
     </div>
 
+    <!-- 13-08 (D-11): the destructive-tool confirmation dialog — trusted
+         chrome, mounted as a SIBLING of the iframe, never inside it. The
+         component Teleports to body with a full-screen backdrop, so it
+         covers the whole viewport including the area over the iframe, and
+         no ancestor transform can trap its position: fixed. Its text is
+         node-authored, fetched by the ContextBroker over the page's own
+         RPC session — nothing the iframe sends can open or resolve it. -->
+    <ToolConfirmModal
+      :show="!!toolConfirm"
+      :description="toolConfirm?.description ?? ''"
+      @approve="resolveToolConfirm(true)"
+      @deny="resolveToolConfirm(false)"
+      @dismiss="dismissToolConfirm"
+    />
+
+    <!-- A tool the operator asked for was blocked by an ungranted
+         category. Trusted chrome, and Teleported to body for the same
+         reason ToolConfirmModal is: a transformed ancestor would trap
+         position:fixed. This only OFFERS the settings screen — it never
+         changes a grant itself, so nothing the iframe or the model says
+         can widen permissions. -->
+    <Teleport to="body">
+      <Transition name="fade">
+        <div v-if="permissionNeeded.length" class="chat-permission-offer" role="status">
+          <p class="text-sm text-white/85">
+            {{ t('chat.permissionNeeded', { categories: permissionNeededLabels }) }}
+          </p>
+          <div class="flex items-center gap-2 shrink-0">
+            <button class="chat-permission-btn" @click="openAISettings">
+              {{ t('chat.openAISettings') }}
+            </button>
+            <button
+              class="chat-permission-dismiss"
+              :aria-label="t('common.dismiss')"
+              @click="permissionNeeded = []"
+            >
+              <svg class="w-4 h-4" aria-hidden="true" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
+              </svg>
+            </button>
+          </div>
+        </div>
+      </Transition>
+    </Teleport>
+
   </div>
 </template>
 
 <script setup lang="ts">
-import { ref, computed, onActivated, onBeforeUnmount, onDeactivated, onMounted } from 'vue'
-import { useRouter } from 'vue-router'
+import { ref, computed, onActivated, onBeforeUnmount, onDeactivated, onMounted, watch } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import { ContextBroker } from '@/services/contextBroker'
+import ToolConfirmModal from '@/components/ToolConfirmModal.vue'
+import { AI_PERMISSION_CATEGORIES } from '@/stores/aiPermissions'
 import { IS_DEMO } from '@/composables/useDemoIntro'
 
 const { t } = useI18n()
 
 const router = useRouter()
+const route = useRoute()
 const aiuiFrame = ref<HTMLIFrameElement | null>(null)
 const aiuiConnected = ref(false)
 // Belt-and-suspenders backstop (2026-07-30 live-testing follow-up): the
@@ -109,6 +168,47 @@ const aiuiUrl = computed(() => {
   return ''
 })
 
+// ⌘K → "Talk to AIUI about it" hands the typed text over as `?ask=`.
+//
+// It is delivered by postMessage, NOT by adding a query param to `aiuiUrl`.
+// That is deliberate: the comment on D14_FLAGS above explains that aiuiUrl must
+// have no reactive dependencies so the iframe `src` stays byte-identical and
+// AIUI survives a tab switch. Threading `ask` through the URL would rebuild the
+// src on every question and reload AIUI, discarding the conversation — the
+// exact opposite of what this feature is for.
+//
+// The ask is queued rather than sent directly, because the common case is
+// arriving from ⌘K on a cold Chat tab where the iframe has not handshaked yet.
+// `ready` flushes it.
+const pendingAsk = ref('')
+
+function flushAsk() {
+  const text = pendingAsk.value
+  if (!text || !aiuiConnected.value) return
+  const frame = aiuiFrame.value
+  if (!frame?.contentWindow || !aiuiUrl.value) return
+  let targetOrigin: string
+  try {
+    targetOrigin = new URL(aiuiUrl.value, window.location.origin).origin
+  } catch { return }
+  frame.contentWindow.postMessage({ type: 'chat:prefill', text }, targetOrigin)
+  pendingAsk.value = ''
+  // Drop ask/askedAt from the URL so a refresh or a back-nav does not re-ask.
+  const { ask: _a, askedAt: _t, ...rest } = route.query
+  router.replace({ path: route.path, query: rest })
+}
+
+watch(
+  () => route.query.askedAt,
+  () => {
+    const ask = route.query.ask
+    if (!ask) return
+    pendingAsk.value = String(ask)
+    flushAsk()
+  },
+  { immediate: true },
+)
+
 function closeChat() {
   if (window.history.length > 1) {
     router.back()
@@ -117,6 +217,73 @@ function closeChat() {
   }
 }
 
+// 13-08 (D-11): the pending destructive-tool confirmation the trusted
+// chrome is currently showing. Set ONLY from the ContextBroker's
+// aiui:tool-confirm-request CustomEvent, whose payload is node-fetched
+// over the page's own RPC session — never from anything the iframe posts.
+const toolConfirm = ref<{ reqId: string; description: string } | null>(null)
+
+function onToolConfirmRequest(e: Event) {
+  const detail = (e as CustomEvent).detail as { reqId?: string; description?: string }
+  if (!detail?.reqId || typeof detail.description !== 'string') return
+  toolConfirm.value = { reqId: detail.reqId, description: detail.description }
+}
+
+function resolveToolConfirm(approved: boolean) {
+  const current = toolConfirm.value
+  toolConfirm.value = null
+  if (!current) return
+  // The decision travels back to the broker (and from there to the node
+  // over the authenticated RPC session) — never through the iframe.
+  window.dispatchEvent(
+    new CustomEvent('aiui:tool-confirm-response', {
+      detail: { reqId: current.reqId, approved },
+    }),
+  )
+}
+
+function dismissToolConfirm() {
+  // Closed without a decision: send nothing. The action stays pending on
+  // the node until its own timeout declines it — never silently approved.
+  toolConfirm.value = null
+}
+
+function onToolConfirmExpired(e: Event) {
+  // 13-08 on-device UAT: the node no longer holds this pending action
+  // (timed out, or resolved elsewhere) — close the dialog rather than
+  // leave the human an Approve button whose click can only be refused.
+  const detail = (e as CustomEvent).detail as { reqId?: string }
+  if (toolConfirm.value && detail?.reqId === toolConfirm.value.reqId) {
+    toolConfirm.value = null
+  }
+}
+
+// A tool the operator's question needed was refused because its category
+// is off. The node reports WHICH categories; we name them and offer the
+// screen that owns the toggles. Never flips a toggle here — the operator
+// decides, on the settings screen, in the trusted chrome.
+const permissionNeeded = ref<string[]>([])
+
+const permissionNeededLabels = computed(() =>
+  permissionNeeded.value
+    .map((id) => AI_PERMISSION_CATEGORIES.find((c) => c.id === id)?.label ?? id)
+    .join(', '),
+)
+
+function onPermissionNeeded(e: Event) {
+  const detail = (e as CustomEvent).detail as { categories?: unknown }
+  const categories = Array.isArray(detail?.categories) ? detail.categories : []
+  const known = categories.filter(
+    (c): c is string => typeof c === 'string' && AI_PERMISSION_CATEGORIES.some((k) => k.id === c),
+  )
+  if (known.length) permissionNeeded.value = known
+}
+
+function openAISettings() {
+  permissionNeeded.value = []
+  router.push({ path: '/dashboard/settings', hash: '#ai-data-access' })
+}
+
 function onAiuiMessage(event: MessageEvent) {
   if (!aiuiUrl.value) return
   // Validate origin — only accept messages from AIUI
@@ -128,6 +295,8 @@ function onAiuiMessage(event: MessageEvent) {
   if (event.data?.type === 'ready') {
     aiuiConnected.value = true
     if (loadTimeout) { clearTimeout(loadTimeout); loadTimeout = null }
+    // A ⌘K ask that arrived before the handshake is waiting — send it now.
+    flushAsk()
   }
 }
 
@@ -142,6 +311,12 @@ function onAiuiMessage(event: MessageEvent) {
 function armChatLive() {
   window.removeEventListener('message', onAiuiMessage)
   window.addEventListener('message', onAiuiMessage)
+  window.removeEventListener('aiui:tool-confirm-request', onToolConfirmRequest)
+  window.addEventListener('aiui:tool-confirm-request', onToolConfirmRequest)
+  window.removeEventListener('aiui:tool-confirm-expired', onToolConfirmExpired)
+  window.addEventListener('aiui:tool-confirm-expired', onToolConfirmExpired)
+  window.removeEventListener('aiui:permission-needed', onPermissionNeeded)
+  window.addEventListener('aiui:permission-needed', onPermissionNeeded)
   broker?.stop()
   broker = null
   if (aiuiUrl.value) {
@@ -161,6 +336,9 @@ onActivated(() => armChatLive())
 
 onDeactivated(() => {
   window.removeEventListener('message', onAiuiMessage)
+  window.removeEventListener('aiui:tool-confirm-request', onToolConfirmRequest)
+  window.removeEventListener('aiui:tool-confirm-expired', onToolConfirmExpired)
+  window.removeEventListener('aiui:permission-needed', onPermissionNeeded)
   broker?.stop()
   broker = null
   if (loadTimeout) { clearTimeout(loadTimeout); loadTimeout = null }
@@ -174,6 +352,9 @@ onMounted(() => armChatLive())
 
 onBeforeUnmount(() => {
   window.removeEventListener('message', onAiuiMessage)
+  window.removeEventListener('aiui:tool-confirm-request', onToolConfirmRequest)
+  window.removeEventListener('aiui:tool-confirm-expired', onToolConfirmExpired)
+  window.removeEventListener('aiui:permission-needed', onPermissionNeeded)
   broker?.stop()
   broker = null
   if (loadTimeout) { clearTimeout(loadTimeout); loadTimeout = null }
@@ -181,6 +362,55 @@ onBeforeUnmount(() => {
 </script>
 
 <style scoped>
+/* Teleported to body, so this is positioned against the viewport, not the
+   chat panel. Sits above the iframe but below the confirm modal — a
+   blocking decision must always win over a passive offer. */
+.chat-permission-offer {
+  position: fixed;
+  left: 50%;
+  transform: translateX(-50%);
+  bottom: calc(1.25rem + var(--safe-bottom, 0px));
+  z-index: 60;
+  max-width: min(40rem, calc(100vw - 2rem));
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+  padding: 0.75rem 0.875rem;
+  border-radius: 0.875rem;
+  background: rgba(24, 24, 27, 0.92);
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  backdrop-filter: blur(12px);
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
+}
+
+.chat-permission-btn {
+  padding: 0.375rem 0.75rem;
+  border-radius: 0.5rem;
+  font-size: 0.8125rem;
+  font-weight: 500;
+  white-space: nowrap;
+  color: #fdba74;
+  background: rgba(251, 146, 60, 0.14);
+  border: 1px solid rgba(251, 146, 60, 0.3);
+  transition: background 0.15s ease;
+}
+
+.chat-permission-btn:hover {
+  background: rgba(251, 146, 60, 0.24);
+}
+
+.chat-permission-dismiss {
+  padding: 0.375rem;
+  border-radius: 0.5rem;
+  color: rgba(255, 255, 255, 0.5);
+  transition: color 0.15s ease, background 0.15s ease;
+}
+
+.chat-permission-dismiss:hover {
+  color: rgba(255, 255, 255, 0.9);
+  background: rgba(255, 255, 255, 0.08);
+}
+
 .chat-loading {
   position: absolute;
   inset: 0;

neode-ui/src/views/Mesh.vue

@@ -1656,9 +1656,18 @@ const fetchedUrls = ref<Map<string, string>>(new Map())
 // `immediate: true` so already-loaded history gets the same treatment as
 // newly-arriving messages.
 const autoFetchedCids = new Set<string>()
-watch(
-  () => chatMessages.value.length,
-  () => {
+
+// NOT `immediate: true`. This watcher calls handleFetchContent, whose body
+// touches consts declared further down the setup block — and an immediate
+// watcher runs DURING setup, before those exist. Vue surfaced it as
+// "ReferenceError: Cannot access 'b' before initialization" from
+// Ye.immediate, and it fired whenever history already contained an inline
+// content_ref, taking the whole Mesh view down with it.
+//
+// onMounted runs after setup completes, so every binding is initialized and
+// already-loaded history still gets the same treatment as new messages —
+// which is what `immediate` was there for.
+function autoFetchInlineContent() {
     for (const msg of chatMessages.value) {
       const payload = msg.typed_payload as { cid?: string; inline?: boolean } | undefined
       if (
@@ -1673,9 +1682,10 @@ watch(
         void handleFetchContent(msg.typed_payload as any)
       }
     }
-  },
-  { immediate: true },
-)
+}
+
+watch(() => chatMessages.value.length, autoFetchInlineContent)
+onMounted(autoFetchInlineContent)
 
 // Transport chooser modal state — populated when advice comes back as
 // "choose" (size fits both inline-over-mesh AND Tor). User picks a path;

neode-ui/src/views/__tests__/chatAiuiEmbed.test.ts

@@ -13,9 +13,16 @@ import Chat from '../Chat.vue'
 
 const routerBackMock = vi.fn()
 const routerPushMock = vi.fn()
+const routerReplaceMock = vi.fn()
+
+// Chat reads route.query.ask/askedAt to receive a ⌘K "Talk to AIUI about it"
+// handoff, and route.path when it strips those params back off. Kept empty by
+// default so the byte-stability assertions below see no ask in play.
+const routeMock = { path: '/dashboard/chat', query: {} as Record<string, string> }
 
 vi.mock('vue-router', () => ({
-  useRouter: () => ({ back: routerBackMock, push: routerPushMock }),
+  useRouter: () => ({ back: routerBackMock, push: routerPushMock, replace: routerReplaceMock }),
+  useRoute: () => routeMock,
 }))
 
 vi.mock('vue-i18n', () => ({
@@ -62,6 +69,8 @@ describe('Chat / AIUI embed URL stability + D-14 defaults (02-07)', () => {
 
   afterEach(() => {
     vi.unstubAllEnvs()
+    routeMock.query = {}
+    routerReplaceMock.mockClear()
   })
 
   it('carries embedded=true, hideClose=true, and both D-14 flags', () => {
@@ -75,6 +84,56 @@ describe('Chat / AIUI embed URL stability + D-14 defaults (02-07)', () => {
     wrapper.unmount()
   })
 
+  // ⌘K → "Talk to AIUI about it" hands the typed text to AIUI. It must travel
+  // by postMessage: putting it in the URL would give aiuiUrl a reactive
+  // dependency and reload AIUI on every question, which is precisely the
+  // byte-stability property the rest of this file exists to protect.
+  it('delivers a ⌘K ask by postMessage on ready, leaving the iframe src untouched', async () => {
+    routeMock.query = { ask: 'why is bitcoin syncing slowly', askedAt: '111' }
+    const { wrapper } = mountChatInKeepAlive()
+    const before = iframeSrc(wrapper)
+    expect(before).not.toContain('ask=')
+
+    const frame = wrapper.find('iframe').element as HTMLIFrameElement
+    const post = vi.fn()
+    Object.defineProperty(frame, 'contentWindow', { configurable: true, value: { postMessage: post } })
+
+    window.dispatchEvent(new MessageEvent('message', {
+      origin: 'http://localhost:5173',
+      data: { type: 'ready' },
+    }))
+    await flushPromises()
+
+    expect(post).toHaveBeenCalledWith(
+      { type: 'chat:prefill', text: 'why is bitcoin syncing slowly' },
+      'http://localhost:5173',
+    )
+    // src must be byte-identical after the ask round-trip
+    expect(iframeSrc(wrapper)).toBe(before)
+    // and the params are stripped so a refresh does not silently re-ask
+    expect(routerReplaceMock).toHaveBeenCalled()
+    const replaceArg = routerReplaceMock.mock.calls[0]![0]
+    expect(replaceArg.query.ask).toBeUndefined()
+    expect(replaceArg.query.askedAt).toBeUndefined()
+    wrapper.unmount()
+  })
+
+  it('does not post a prefill when there is no ask in the route', async () => {
+    const { wrapper } = mountChatInKeepAlive()
+    const frame = wrapper.find('iframe').element as HTMLIFrameElement
+    const post = vi.fn()
+    Object.defineProperty(frame, 'contentWindow', { configurable: true, value: { postMessage: post } })
+
+    window.dispatchEvent(new MessageEvent('message', {
+      origin: 'http://localhost:5173',
+      data: { type: 'ready' },
+    }))
+    await flushPromises()
+
+    expect(post).not.toHaveBeenCalled()
+    wrapper.unmount()
+  })
+
   it('is string-equal before and after a simulated viewport resize across the mobile breakpoint', async () => {
     const { wrapper } = mountChatInKeepAlive()
     const before = iframeSrc(wrapper)

neode-ui/src/views/apps/__tests__/appsConfig.test.ts

@@ -1,7 +1,7 @@
 import { describe, expect, it } from 'vitest'
 import { ref } from 'vue'
 import { PackageState, type PackageDataEntry } from '@/types/api'
-import { canLaunch, filterEntriesForTab, hasFrontendUi, isServiceContainer, isServicePackage, isWebsitePackage, launchBlockedReason, resolveAppIcon, useCategoriesWithApps } from '../appsConfig'
+import { canLaunch, filterEntriesForTab, hasFrontendUi, isServiceContainer, isServicePackage, isWebsitePackage, launchBlockedReason, resolveAppIcon, useCategoriesWithApps, DEFAULT_APP_ICON } from '../appsConfig'
 
 function makePkg(id: string, title: string, category: string): PackageDataEntry {
   return {
@@ -82,6 +82,13 @@ describe('appsConfig service filtering', () => {
     expect(resolveAppIcon('gitea', pkg)).toBe('/assets/img/app-icons/gitea.svg')
   })
 
+  it('an unmapped id gets the A mark, not a guessed png that 404s', () => {
+    // strfry 404'd live on 2026-08-07: no curated entry, no fallback entry,
+    // no service prefix — the old `${id}.png` guess produced a broken tile.
+    const pkg = makePkg('strfry', 'strfry', 'nostr')
+    expect(resolveAppIcon('strfry', pkg)).toBe(DEFAULT_APP_ICON)
+  })
+
   it('classifies an unknown app by whether its manifest declares a UI (#45)', () => {
     // Headless: a LAN address but no declared UI → Website.
     const headless = makePkg('some-backend', 'Some Backend', 'other')

neode-ui/src/views/apps/appsConfig.ts

@@ -249,7 +249,9 @@ export function resolveAppIcon(id: string, pkg: PackageDataEntry, curatedIcon?:
     curatedIcon ||
     APP_ICON_FALLBACKS[id] ||
     serviceParentIcon(id) ||
-    `/assets/img/app-icons/${id}.png`
+    // Never guess `${id}.png` — an unmapped id 404s (strfry did, 2026-08-07).
+    // The A mark is the honest unknown-app tile.
+    DEFAULT_APP_ICON
   )
 }
 

neode-ui/src/views/settings/AIDataAccessSection.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed } from 'vue'
+import { computed, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useAIPermissionsStore, AI_PERMISSION_CATEGORIES } from '@/stores/aiPermissions'
 import ToggleSwitch from '@/components/ToggleSwitch.vue'
@@ -7,6 +7,12 @@ import ToggleSwitch from '@/components/ToggleSwitch.vue'
 const { t } = useI18n()
 const aiPermissions = useAIPermissionsStore()
 
+// Grants live on the node, not in this browser's localStorage — reconcile on
+// open so the switches show the node's truth rather than whatever this origin
+// happens to remember. Without this the same node shows different settings at
+// its LAN address and its Tailscale address.
+onMounted(() => { void aiPermissions.hydrate() })
+
 const aiCategoryGroups = computed(() => {
   const groups: { label: string; items: typeof AI_PERMISSION_CATEGORIES }[] = []
   for (const cat of AI_PERMISSION_CATEGORIES) {
@@ -22,8 +28,8 @@ const aiCategoryGroups = computed(() => {
 </script>
 
 <template>
-  <!-- AI Data Access Section -->
-  <div class="glass-card px-6 py-6 mb-6">
+  <!-- AI Data Access Section — id is the banner's #ai-data-access hash target -->
+  <div id="ai-data-access" class="glass-card px-6 py-6 mb-6 scroll-mt-4">
     <div class="mb-2">
       <h2 class="text-xl font-semibold text-white/96">{{ t('settings.aiDataAccess') }}</h2>
     </div>

neode-ui/src/views/settings/LightningCredentialsSection.vue

@@ -36,12 +36,28 @@ let poll: ReturnType<typeof setInterval> | null = null
 ///
 /// Bounded rather than a plain flag, so a request the node accepted but never
 /// acted on stops polling instead of hammering it forever.
-let awaitUntil = 0
+const awaitUntil = ref(0)
 const AWAIT_START_MS = 120_000
 
 const rotation = computed<LndRotationProgress | null>(() => status.value?.rotation ?? null)
 const isRunning = computed(() => rotation.value?.running === true)
 
+/// Ticks while a rotation is being awaited, so `rotationInFlight` re-evaluates
+/// as the await window expires instead of holding a stale value until the next
+/// poll happens to touch a reactive dependency.
+const now = ref(Date.now())
+
+/// Is a rotation happening, INCLUDING the gap between asking for one and the
+/// node reporting it?
+///
+/// Rotation restarts LND, so `status.installed` goes false for a moment
+/// mid-rotation. Read literally that says "Lightning is not set up on this
+/// node" — which the screen then told the operator, seconds after they
+/// rotated, on a node with a working Lightning wallet. The container being
+/// briefly absent is what rotating LOOKS like, not evidence it was never
+/// there.
+const rotationInFlight = computed(() => isRunning.value || now.value < awaitUntil.value)
+
 /** A finished rotation, successful or not. `ok` is null while running. */
 const finished = computed(
   () => rotation.value !== null && !rotation.value.running && rotation.value.ok !== null,
@@ -68,8 +84,9 @@ async function load() {
 /// waking the node every few seconds.
 function syncPolling() {
   const running = status.value?.rotation.running === true
-  if (running) awaitUntil = 0
-  if (running || Date.now() < awaitUntil) startPolling()
+  if (running) awaitUntil.value = 0
+  now.value = Date.now()
+  if (running || Date.now() < awaitUntil.value) startPolling()
   else stopPolling()
 }
 
@@ -103,7 +120,8 @@ async function rotate() {
   try {
     await rpcClient.lndRotateMacaroons(password.value)
     closeConfirm()
-    awaitUntil = Date.now() + AWAIT_START_MS
+    awaitUntil.value = Date.now() + AWAIT_START_MS
+    now.value = Date.now()
     startPolling()
     await load()
   } catch (e) {
@@ -155,8 +173,16 @@ onUnmounted(stopPolling)
 </script>
 
 <template>
-  <div class="mb-6">
-    <h3 class="text-base font-medium text-white/90 mb-1">Lightning credentials</h3>
+  <div class="glass-card px-6 py-6 mb-6">
+    <!-- glass-card, like every other Settings section (AccountSection,
+         AIDataAccessSection, NodeCertificateSection, BackupSection …). This
+         rendered as bare text on the Settings page twice, because a new
+         section carries its own wrapper and nothing about adding it to
+         SystemSection.vue's list reminds you. Heading is h2/text-xl to match
+         those siblings. Kept INSIDE the root: a leading comment makes the
+         component a fragment, which drops the root class and breaks attribute
+         inheritance. -->
+    <h2 class="text-xl font-semibold text-white/96 mb-1">Lightning credentials</h2>
     <p class="text-sm text-white/60 mb-4">
       Wallet apps like Zeus connect to this node using a Lightning credential — a
       token that lets them spend. Rotating replaces every one of them, so anything
@@ -173,14 +199,29 @@ onUnmounted(stopPolling)
       Could not read the Lightning credential state: {{ loadError }}
     </div>
 
+    <!-- `&& !rotationInFlight`: rotating restarts LND, so `installed` reads
+         false for a moment mid-rotation. Without the guard this told the
+         operator "Lightning is not set up on this node yet" seconds after they
+         rotated on a node with a working wallet — and it replaced the progress
+         they were watching. A container briefly absent is what rotating looks
+         like, not proof Lightning was never installed. -->
     <div
-      v-else-if="!status?.installed"
+      v-else-if="!status?.installed && !rotationInFlight"
       class="p-3 bg-white/5 border border-white/10 rounded-lg text-sm text-white/70"
     >
       Lightning is not set up on this node yet, so there are no credentials to
       rotate. Install the Lightning app first.
     </div>
 
+    <!-- Mid-rotation with no status to render yet: say what is happening
+         rather than falling through to the details block with empty fields. -->
+    <div
+      v-else-if="!status?.installed"
+      class="p-3 bg-white/5 border border-white/10 rounded-lg text-sm text-white/70"
+    >
+      Rotating credentials — Lightning is restarting. This takes a moment.
+    </div>
+
     <div v-else class="space-y-4">
       <!-- What exists right now -->
       <dl class="grid grid-cols-1 sm:grid-cols-2 gap-3 text-sm">

neode-ui/src/views/settings/NodeCertificateSection.vue

@@ -52,9 +52,12 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div class="mb-6">
-    <h3 class="text-base font-medium text-white/90 mb-1">Node certificate</h3>
-    <p class="text-sm text-white/60 mb-4">
+  <!-- Node Certificate Section -->
+  <div class="glass-card px-6 py-6 mb-6">
+    <div class="mb-2">
+      <h2 class="text-xl font-semibold text-white/96">Node certificate</h2>
+    </div>
+    <p class="text-sm text-white/60 mb-6">
       Install this node's certificate on a device and it stops warning you about
       this node — on every port, not just the dashboard. Apps that open inside
       the dashboard need this: a certificate warning cannot be accepted inside an

neode-ui/src/views/settings/__tests__/LightningCredentialsSection.test.ts

@@ -289,4 +289,65 @@ describe('LightningCredentialsSection', () => {
     await flushPromises()
     expect(vi.mocked(rpcClient.lndMacaroonStatus).mock.calls.length).toBe(callsAfterLoad)
   })
+
+  it('renders inside a card, like every other Settings section', () => {
+    // Operator-reported twice: the section rendered as bare text on the
+    // Settings page. A new section carries its own wrapper, and nothing about
+    // adding it to SystemSection.vue's list reminds you it needs one.
+    // `wrapper.element` is not the div: the confirm modal is a second root
+    // node, so the component is a fragment. Assert on the first div.
+    const wrapper = mountSection()
+    expect(wrapper.find('div').classes()).toContain('glass-card')
+  })
+
+  it('does not claim Lightning is missing while a rotation is running', async () => {
+    // Rotation restarts LND, so `installed` goes false for a moment. The
+    // screen used to read that literally and tell the operator "Lightning is
+    // not set up on this node yet" — seconds after they rotated, on a node
+    // with a working wallet — replacing the progress they were watching.
+    vi.mocked(rpcClient.lndMacaroonStatus).mockResolvedValue(
+      status({ installed: false, rotation: { ...idleRotation(), running: true } }),
+    )
+
+    const wrapper = mountSection()
+    await flushPromises()
+
+    expect(wrapper.text()).not.toContain('Lightning is not set up on this node yet')
+    expect(wrapper.text()).toContain('Lightning is restarting')
+  })
+
+  it('still tells a node with no Lightning that there is nothing to rotate', async () => {
+    // The other half: the message must survive for its real audience, or the
+    // fix above has just hidden a true statement.
+    vi.mocked(rpcClient.lndMacaroonStatus).mockResolvedValue(status({ installed: false }))
+
+    const wrapper = mountSection()
+    await flushPromises()
+
+    expect(wrapper.text()).toContain('Lightning is not set up on this node yet')
+  })
+
+  it('does not claim Lightning is missing in the gap before the node reports the rotation', async () => {
+    // The window `awaitUntil` exists for: the rotate RPC has been accepted but
+    // the node has not yet reported `running: true`. `installed` can already be
+    // false there, so the guard has to cover the await window too, not just
+    // `running`.
+    vi.mocked(rpcClient.lndMacaroonStatus)
+      .mockResolvedValueOnce(status())
+      .mockResolvedValue(status({ installed: false }))
+    vi.mocked(rpcClient.lndRotateMacaroons).mockResolvedValue(undefined as never)
+
+    const wrapper = mountSection()
+    await flushPromises()
+
+    await wrapper.find('button').trigger('click')
+    await flushPromises()
+    const confirm = wrapper.findAll('button').find((b) => /rotate/i.test(b.text()))
+    if (confirm) {
+      await confirm.trigger('click')
+      await flushPromises()
+    }
+
+    expect(wrapper.text()).not.toContain('Lightning is not set up on this node yet')
+  })
 })