# Overnight Plan — Archy Integration, Content Hardening & Feature Completion

> **Format**: `- [ ]` = pending, `- [x]` = done.
> Make at least 30 attempts on any difficult task before moving on. Loop reads this file.

## Phase 1: Critical ContentPanel Wiring Gaps

- [ ] **T1** — Wire ImageGrid + ImageDetail into ContentPanel.vue. Import components, destructure `panelImages`, `selectedImage`, `openImageDetail`, `closeImageDetail` from `useContentPanel()`. Add ImageGrid render block following BookGrid/TVSeriesGrid pattern. Add ImageDetail overlay following BookDetail pattern. Add `selectedImage` to `hasDetailOpen` computed. Reference ContentGridView.vue for how ImageGrid is already used there.

- [ ] **T2** — Wire PlaceGrid + PlaceDetail into ContentPanel.vue. Import components, destructure `panelPlaces`, `selectedPlace`, `openPlaceDetail`, `closePlaceDetail` from `useContentPanel()`. Add PlaceGrid render block + PlaceDetail overlay. Add `selectedPlace` to `hasDetailOpen` computed. Follow same patterns as T1.

- [ ] **T3** — Verify code tab rendering in ContentPanel.vue. Ensure `panelCodeBlocks` is destructured and code content renders when the code tab is active. If missing, add a code block display component or inline rendering with syntax highlighting. The code tab should show extracted code blocks from AI responses.

- [ ] **TEST:P1** — Run `cd packages/app && npx vitest run` and `pnpm typecheck && pnpm lint`. Fix all failures before proceeding.

## Phase 2: Archy Service Integration into AIUI

- [ ] **T4** — Extend useArchy composable to support richer context categories. Add new reactive refs and fetch methods for: `wallet` (Lightning balance, channel count, node pubkey), `files` (Nextcloud file listings — name, path, size, modified date), `media` (photo count, recent photos, music files). Update `buildArchyContext()` to include wallet balance, file counts, and media summary in the AI system prompt. Update `fetchPermittedContext()` to request these new categories from the bridge. The data format should match what Archy's contextBroker will return (see archyBridge.ts categories: 'apps' | 'system' | 'network' | 'wallet' | 'files'). File: `packages/app/src/composables/useArchy.ts`

- [ ] **T5** — Create Archy app cards for AIUI. Build a data file at `packages/app/src/data/archy-apps.ts` that maps Archy service IDs to AIUI-friendly metadata: display name, description, icon (use emoji for now), category, default port, and deep-link URL pattern (e.g., `/app/nextcloud`, `/app/mempool`). Include all major services: bitcoin-core, lnd, core-lightning, btcpay-server, mempool, nextcloud, immich, nostr-rs-relay, home-assistant, grafana, searxng, ollama, penpot, onlyoffice, fedimint, meshtastic. When running in Archy, merge this with live `installedApps` data from useArchy to show actual status. File: `packages/app/src/data/archy-apps.ts`

- [ ] **T6** — Create an ArchyAppsGrid component. Build `packages/app/src/components/content/ArchyAppsGrid.vue` that displays Archy node apps in a grid. Each card shows: app name, status (running/stopped/not installed), description snippet, and an action button (Open if running, Install if not). Use glass-card styling. On click, call `useArchy().requestAction('open-app', { appId })` for running apps. When not embedded in Archy, show the apps as informational cards without action buttons. Wire this into ContentPanel.vue under a new conditional: when the 'app' tab is active AND `useArchy().isEmbedded`, show ArchyAppsGrid above or instead of the generic AppsGrid.

- [ ] **T7** — Wire Archy wallet context into AI responses. When the AI mentions Bitcoin/Lightning and Archy wallet data is available, the system prompt should include: wallet balance (sats), number of channels, total capacity. This lets the AI say things like "Your node has 500,000 sats across 3 channels" when relevant. In `useArchy.ts`, add `walletInfo` ref with `{ balanceSats?: number, channelCount?: number, totalCapacitySats?: number, nodePubkey?: string }`. In `buildArchyContext()`, append wallet section when data exists.

- [ ] **T8** — Wire Archy file context for AI awareness. When files permission is granted, the AI should know what files the user has. In `useArchy.ts`, add `fileList` ref as `{ name: string, path: string, size?: number, modified?: string, type: 'file' | 'folder' }[]`. In `buildArchyContext()`, summarize: "You have X files in Nextcloud. Recent files: file1.pdf, file2.jpg, notes/todo.md". Limit to 20 most recent files to keep prompt concise. The AI can then reference user's files conversationally.

- [ ] **TEST:P2** — Run `pnpm test && pnpm typecheck && pnpm lint`. Fix all failures before proceeding.

## Phase 3: Content Extraction Hardening

- [ ] **T9** — Expand extraction quality test suite to 100+ tests. Add tests for: podcast extraction (library `[[podcast:p1]]` tags + `[[podcast_ext:]]` tags), app extraction (`extractApps`), film extraction (library `[[film:f1]]` tags + `[[film_ext:]]` tags), magazine section extraction, websites/news detection from markdown links and bare domain extraction, edge cases (empty strings, very long text, unicode characters, special chars in titles), mixed content with 3+ types in one response, `filterTabsByContext` with every specialized path (news+TV, nostr+apps, app+code, etc). Each test should use realistic AI response text patterns. File: `packages/app/src/__tests__/extractionQuality.test.ts`

- [ ] **T10** — Fix any extraction bugs found during T9 testing. Run the expanded test suite, fix all failures in `contentExtraction.ts` and/or `contentFiltering.ts`. Iterate until all tests pass.

- [ ] **T11** — Verify filterTabsByContext prioritization for all paths. Write specific tests ensuring: news queries show news/magazine first but include TV/books/etc if present, nostr queries show nostr first, app queries show apps first, preferred tab from `preferredFirstTab()` is always first in general case, no content type is ever silently dropped. File: `packages/app/src/__tests__/extractionQuality.test.ts`

- [ ] **TEST:P3** — Run `cd packages/app && npx vitest run src/__tests__/extractionQuality.test.ts` — must have 100+ tests all passing. Then run `pnpm typecheck && pnpm lint`.

## Phase 4: Archy Integration Tests

- [ ] **T12** — Create Archy integration test suite. File: `packages/app/src/__tests__/archyIntegration.test.ts`. Test: archyBridge message handling (mock postMessage for context:response, theme:response, permissions:update), useArchy composable (init when embedded, buildArchyContext output format with various data combinations, fetchPermittedContext with mocked bridge, requestAction delegation). Mock `window.parent` and `window.addEventListener`. Test wallet/file context formatting. Test base-aware API paths resolve correctly for both `/` and `/aiui/` base paths.

- [ ] **T13** — Test ArchyAppsGrid component. Write tests verifying: renders app cards from archy-apps.ts data, shows correct status when merged with live data, action buttons work (open-app calls requestAction), graceful fallback when not embedded (shows informational cards only), glass-card styling applied.

- [ ] **TEST:P4** — Run `pnpm test && pnpm typecheck && pnpm lint`. All tests must pass.

## Phase 5: Code Mode UX Completion

- [ ] **T14** — Add Esc key to exit code mode on desktop. In ChatWindow.vue or ChatPage.vue, add a `keydown` event listener for Escape that calls `exitCodeMode()` from `useCodeContext` when code mode is active (`codeMode.value === true`). Only handle on desktop (not mobile). Add/cleanup in onMounted/onUnmounted.

- [ ] **T15** — Show selected project indicator near chat input when in code mode. When `codeMode` is true and a project is selected (`currentProject` from `useCodeContext`), display the project name as a small pill/badge near the chat input area. Use accent/orange styling (bg-accent/15, text-accent).

- [ ] **T16** — Wire selected design tokens + files into AI context. When sending a message in code mode, include selected design tokens and file contents as context in the system prompt. Read from `useCodeContext()`. Keep concise.

- [ ] **TEST:P5** — Run `pnpm typecheck && pnpm lint`. Fix all failures before proceeding.

## Phase 6: Final Verification & Cleanup

- [ ] **T17** — Final verification pass. Run `pnpm test` (all tests pass), `pnpm typecheck` (no type errors), `pnpm lint` (0 errors). Fix any issues. Commit all remaining changes with a summary commit message. Push to remote.