Attachments: inline play on audio chips (hover → ▶), and open attachments in a Quick Look overlay instead of navigating to Files

kayg commented

2026-10-01 10:14:18 +00:00

Owner

"I should be able to hit play from here to listen. Hovering over the icon should turn it into a play button, and clicking that play button should play the memo there."
"Clicking on these attached files should open in an overlay directly. It currently navigates me to the Files view into the folder, and then I have to navigate back, which is annoying."
Build:

Inline play on audio chips (attachment chips in the hover card, the Log/Event row and the Inspector; one shared AttachmentChip): on hover/focus, the chip's icon morphs into ▶ (the shared spring). Click ▶ plays in place: the icon becomes ⏸, a thin progress ring/bar shows on the chip, click to pause, and the elapsed time shows in the chip label. One audio element at a time (starting another pauses the first). Keyboard: Space/Enter on the focused icon toggles playback. Touch: tap the icon to play, tap the chip body to open.
Open in an overlay, not a navigation: clicking any attached file (audio, image, PDF, video, doc) opens Quick Look as an overlay over the current view (the shared viewer), with ‹ › through the entry's attachments, and closing returns exactly where the User was (no route change to Files; the deep link updates the URL query/hash for shareability, §33). "Show in Files" stays available as an action inside Quick Look.
Reuse the Voice Pill waveform from #617 for audio in Quick Look.
Test: an e2e hovers a Log entry with a voice memo, hovers the chip (the play icon shows), clicks play (audio currentTime advances, the chip shows ⏸), and clicking the chip body opens Quick Look over Calendar; Escape returns to the same Calendar view with the URL restored. Screenshots of the chip states.

## Owner report (2026-10-01, Calendar hover card with a voice memo attachment chip) 1. "I should be able to hit play from here to listen. Hovering over the icon should turn it into a play button, and clicking that play button should play the memo there." 2. "Clicking on these attached files should open in an overlay directly. It currently navigates me to the Files view into the folder, and then I have to navigate back, which is annoying." **Build:** - **Inline play on audio chips** (attachment chips in the hover card, the Log/Event row and the Inspector; one shared AttachmentChip): on hover/focus, the chip's icon morphs into ▶ (the shared spring). Click ▶ plays in place: the icon becomes ⏸, a thin progress ring/bar shows on the chip, click to pause, and the elapsed time shows in the chip label. One audio element at a time (starting another pauses the first). Keyboard: Space/Enter on the focused icon toggles playback. Touch: tap the icon to play, tap the chip body to open. - **Open in an overlay, not a navigation:** clicking any attached file (audio, image, PDF, video, doc) opens **Quick Look as an overlay** over the current view (the shared viewer), with ‹ › through the entry's attachments, and closing returns exactly where the User was (no route change to Files; the deep link updates the URL query/hash for shareability, §33). "Show in Files" stays available as an action inside Quick Look. - Reuse the Voice Pill waveform from #617 for audio in Quick Look. **Test:** an e2e hovers a Log entry with a voice memo, hovers the chip (the play icon shows), clicks play (audio `currentTime` advances, the chip shows ⏸), and clicking the chip body opens Quick Look over Calendar; Escape returns to the same Calendar view with the URL restored. Screenshots of the chip states.

audio-chip-390-paper.png

134 KiB

agenda-audio-1440-paper.png

556 KiB

agenda-audio-1440-tokyo-night.png

441 KiB

agenda-audio-390-paper.png

159 KiB

agenda-audio-390-tokyo-night.png

144 KiB

agenda-audio-820-paper.png

496 KiB

agenda-audio-820-tokyo-night.png

489 KiB

audio-chip-1440-paper.png

539 KiB

audio-chip-1440-tokyo-night.png

431 KiB

audio-chip-390-tokyo-night.png

131 KiB

audio-chip-820-paper.png

480 KiB

audio-chip-820-tokyo-night.png

472 KiB

audio-playing-1440-paper.png

547 KiB

audio-playing-1440-tokyo-night.png

437 KiB

audio-playing-390-paper.png

140 KiB

audio-playing-390-tokyo-night.png

135 KiB

audio-playing-820-paper.png

486 KiB

audio-playing-820-tokyo-night.png

476 KiB

quick-look-audio-1440-paper.png

37 KiB

quick-look-audio-1440-tokyo-night.png

41 KiB

quick-look-audio-390-paper.png

27 KiB

quick-look-audio-390-tokyo-night.png

30 KiB

quick-look-audio-820-paper.png

33 KiB

quick-look-audio-820-tokyo-night.png

36 KiB

agenda-audio-390-paper.png

159 KiB

agenda-audio-390-tokyo-night.png

144 KiB

agenda-audio-820-paper.png

495 KiB

agenda-audio-820-tokyo-night.png

488 KiB

audio-chip-1440-paper.png

544 KiB

audio-chip-1440-tokyo-night.png

435 KiB

audio-chip-390-paper.png

133 KiB

audio-chip-390-tokyo-night.png

133 KiB

audio-chip-820-paper.png

481 KiB

audio-chip-820-tokyo-night.png

475 KiB

quick-look-audio-820-tokyo-night.png

26 KiB

quick-look-audio-1440-tokyo-night.png

456 KiB

agenda-audio-1440-paper.png

556 KiB

agenda-audio-1440-tokyo-night.png

441 KiB

audio-playing-1440-paper.png

550 KiB

audio-playing-1440-tokyo-night.png

438 KiB

audio-playing-390-paper.png

139 KiB

audio-playing-390-tokyo-night.png

136 KiB

audio-playing-820-paper.png

486 KiB

audio-playing-820-tokyo-night.png

478 KiB

quick-look-audio-1440-paper.png

27 KiB

quick-look-audio-390-paper.png

19 KiB

quick-look-audio-390-tokyo-night.png

20 KiB

quick-look-audio-820-paper.png

25 KiB

quick-look-audio-390-paper.png

21 KiB

quick-look-audio-820-paper.png

29 KiB

quick-look-audio-1440-paper.png

31 KiB

quick-look-audio-390-tokyo-night.png

22 KiB

quick-look-audio-820-tokyo-night.png

29 KiB

quick-look-audio-1440-tokyo-night.png

454 KiB

kayg referenced this issue

2026-10-01 10:17:59 +00:00

Calendar photos: remove 'Show photos by' setting; show on date taken AND an 'N Added' picture deck on upload day, carousel hover card, overlay on click #624

kayg referenced this issue

2026-10-01 10:56:43 +00:00

Calendar items + hover card redesign: clock+time chips/title/leaf tag chips; 'Journal' everywhere; kind-labelled attachments; two bottom pills; one action path #628

kayg commented

2026-10-01 17:32:56 +00:00

Author

Owner

Starting #622 on branch job/calcard-series. Base: dev at 6527b9ef9b. Current head: fc9857d84c; #628, #608 and #603 are committed and reported. Reuse search found the shared AttachmentDeck on Agenda and Journal previews, the shared QuickLook viewer, and Files resolveItem by stable ID; there is no existing inline voice player or Voice Pill waveform component in this worktree. DESIGN §33 does not define a Calendar attachment overlay query, so I will use ?attachment= on the existing Calendar URL and preserve its path/hash, then restore the exact prior URL on close.

Starting #622 on branch job/calcard-series. Base: dev at 6527b9ef9b5a9a1ecbceedc0a01b7fd36f8c5961. Current head: fc9857d84ce685a8971ba37b35a558550431bf18; #628, #608 and #603 are committed and reported. Reuse search found the shared AttachmentDeck on Agenda and Journal previews, the shared QuickLook viewer, and Files resolveItem by stable ID; there is no existing inline voice player or Voice Pill waveform component in this worktree. DESIGN §33 does not define a Calendar attachment overlay query, so I will use ?attachment=<item-id> on the existing Calendar URL and preserve its path/hash, then restore the exact prior URL on close.

kayg commented

2026-10-01 18:05:57 +00:00

Author

Owner

The first web token gate found two new 2 px waveform/progress radii that bypassed the shared shape token (check-type-tokens.mjs). I replaced them with --radius-indicator; the next run passed that token gate. The full Svelte diagnostics are still running on the loaded host.

The first web token gate found two new 2 px waveform/progress radii that bypassed the shared shape token (`check-type-tokens.mjs`). I replaced them with `--radius-indicator`; the next run passed that token gate. The full Svelte diagnostics are still running on the loaded host.

kayg commented

2026-10-01 18:17:41 +00:00

Author

Owner

The performance fixture now uses 32 attachments, the current Journal API cap. Evidence: a 50-attachment POST /api/v1/notes/journal/log returned 400 bad_request: too many attachments; the profile uses the largest accepted set and records the 10-open burst against it.

The performance fixture now uses 32 attachments, the current Journal API cap. Evidence: a 50-attachment `POST /api/v1/notes/journal/log` returned 400 `bad_request: too many attachments`; the profile uses the largest accepted set and records the 10-open burst against it.

kayg commented

2026-10-01 18:54:02 +00:00

Author

Owner

Calendar gate finding (after merge from origin/dev): bun run test:e2e:calendar fails in the existing Composer commit-freeze section at apps/web/e2e/calendar.mjs:1425. The exact assertion output is the send carries the snapshot: 20:49 nFrozen snapshot; the assertion expects the frozen text to end with Frozen snapshot. The #622 change does not modify Composer snapshot handling, so I kept the existing expectation unchanged and recorded this for follow-up. The focused #622 audio/Quick Look e2e passes.

Calendar gate finding (after merge from `origin/dev`): `bun run test:e2e:calendar` fails in the existing Composer commit-freeze section at `apps/web/e2e/calendar.mjs:1425`. The exact assertion output is `the send carries the snapshot: 20:49 nFrozen snapshot`; the assertion expects the frozen text to end with ` Frozen snapshot`. The #622 change does not modify Composer snapshot handling, so I kept the existing expectation unchanged and recorded this for follow-up. The focused #622 audio/Quick Look e2e passes.

kayg commented

2026-10-01 19:18:57 +00:00

Author

Owner

#622 complete

Branch: job/calcard-series
Head: dd0e2571371db5191614601f177e5c6dc069e39b

Built

One lazy audio player serves the Calendar Agenda attachment deck and anchored Journal preview. Play/Pause is a separate keyboard-operable button; the chip shows elapsed time and progress, and starting another memo stops the first.
Attached file bodies open in the shared Quick Look overlay over Calendar. The query string uses the stable Files item ID (?attachment=<id>), sibling navigation updates it, and Escape restores the prior Calendar URL.
Quick Look uses the shared five-bar Voice Pill waveform (#617) and browser-native media controls. “Show in Files” stays available inside the overlay.
The focused e2e covers Space/Enter, touch taps, pointer playback, sibling navigation and URL restoration. It captures 24 real-build screenshots: Agenda deck, audio chip, playing chip and Quick Look at 390/820/1440 in Paper and Tokyo Night.

Files

apps/web/src/routes/calendar/[view]/[date]/+page.svelte
packages/ui/src/components/calendar/{AgendaList,AttachmentDeck,ItemPreview,inlineAudioPlayback.svelte.ts}
packages/ui/src/components/composer/VoiceWaveform.svelte
packages/ui/src/components/viewer/QuickLook.svelte
packages/ui/src/index.ts
apps/web/e2e/calendar-attachment-audio-622.mjs
bench/calendar-inline-audio-622.mjs
docs/perf/baseline.json

Decisions

The viewer URL is ?attachment=<stable Files item ID>; this keeps Calendar as the route and lets close restore the exact previous path, query and hash.
The Notes API currently accepts at most 32 attachment links per Journal entry. The real-server profile uses that maximum.
The profile ran locally against the production SPA and local server on calternal-dev, not on the perf VM. The host was busy, so treat the timings as load-sensitive.

Performance profile

bench/calendar-inline-audio-622.mjs used 32 real 32,044-byte WAV files, ten stable-item resolves and ten sequential Quick Look opens. This is the initial #622 profile; there was no earlier inline-audio/Quick Look baseline.

Item resolve: p50 24.4 ms, p95 47.9 ms.
Quick Look open with 32 siblings: p50 571.01 ms, p95 985.47 ms; ten-open sequential burst wall time 6844.32 ms.
Server: mean RSS 266,499,231 bytes, peak RSS 266,588,160 bytes; mean CPU 14.44%, peak CPU 99.27%.
Load average: 21.62 / 17.32 / 16.96 before; 20.61 / 17.24 / 16.94 after.

Gates

bun run check from apps/web:

$ node scripts/check-user-storage.mjs && node scripts/check-type-tokens.mjs && node scripts/check-motion-tokens.mjs && svelte-kit sync && svelte-check --tsconfig ./tsconfig.json
User browser caches use userStorage; only documented device/public-link exceptions remain.
Text sizes and UI shape values use shared role tokens.
UI transitions and animation options use shared motion tokens or documented exceptions.
Loading svelte-check in workspace: /home/kayg/Developer/calternal-wt/calcard-series/apps/web
Getting Svelte diagnostics...

svelte-check found 0 errors and 0 warnings

bun run test from apps/web:

 Test Files  148 passed (148)
      Tests  1016 passed (1016)
   Start at  20:44:53
   Duration  150.06s (transform 47%, environment 20%, import 16%, tests 11%, setup 5%)

Focused audio/Quick Look e2e:

calendar attachment audio e2e: keyboard and pointer playback, touch taps, sibling Quick Look, URL restoration, and 390/820/1440 light/dark screenshots passed

bun run test:e2e:calendar was run once and failed in the Composer commit-freeze assertion at apps/web/e2e/calendar.mjs:1425. I kept its expectation unchanged. Exact failure:

AssertionError [ERR_ASSERTION]: the send carries the snapshot: 20:49 nFrozen snapshot
    at /home/kayg/Developer/calternal-wt/calcard-series/apps/web/e2e/calendar.mjs:1425:10
    at processTicksAndRejections (native:7:39) {
  generatedMessage: true,
  actual: false,
  expected: true,
  operator: '==',
  code: 'ERR_ASSERTION',
  diff: 'simple'
}
error: script "test:e2e:calendar" exited with code 1

Screenshot attachments

Agenda attachment deck

Paper: 390px · 820px · 1440px
Tokyo Night: 390px · 820px · 1440px

Journal preview audio chip

Paper: 390px · 820px · 1440px
Tokyo Night: 390px · 820px · 1440px

Journal preview playing state

Paper: 390px · 820px · 1440px
Tokyo Night: 390px · 820px · 1440px

Quick Look audio

Paper: 390px · 820px · 1440px
Tokyo Night: 390px · 820px · 1440px

No push or deploy was performed. The branch includes the required local merge from origin/dev (55f8a17dc).

#622 complete Branch: `job/calcard-series` Head: `dd0e2571371db5191614601f177e5c6dc069e39b` ## Built - One lazy audio player serves the Calendar Agenda attachment deck and anchored Journal preview. Play/Pause is a separate keyboard-operable button; the chip shows elapsed time and progress, and starting another memo stops the first. - Attached file bodies open in the shared Quick Look overlay over Calendar. The query string uses the stable Files item ID (`?attachment=<id>`), sibling navigation updates it, and Escape restores the prior Calendar URL. - Quick Look uses the shared five-bar Voice Pill waveform (#617) and browser-native media controls. “Show in Files” stays available inside the overlay. - The focused e2e covers Space/Enter, touch taps, pointer playback, sibling navigation and URL restoration. It captures 24 real-build screenshots: Agenda deck, audio chip, playing chip and Quick Look at 390/820/1440 in Paper and Tokyo Night. ## Files - `apps/web/src/routes/calendar/[view]/[date]/+page.svelte` - `packages/ui/src/components/calendar/{AgendaList,AttachmentDeck,ItemPreview,inlineAudioPlayback.svelte.ts}` - `packages/ui/src/components/composer/VoiceWaveform.svelte` - `packages/ui/src/components/viewer/QuickLook.svelte` - `packages/ui/src/index.ts` - `apps/web/e2e/calendar-attachment-audio-622.mjs` - `bench/calendar-inline-audio-622.mjs` - `docs/perf/baseline.json` ## Decisions - The viewer URL is `?attachment=<stable Files item ID>`; this keeps Calendar as the route and lets close restore the exact previous path, query and hash. - The Notes API currently accepts at most 32 attachment links per Journal entry. The real-server profile uses that maximum. - The profile ran locally against the production SPA and local server on `calternal-dev`, not on the perf VM. The host was busy, so treat the timings as load-sensitive. ## Performance profile `bench/calendar-inline-audio-622.mjs` used 32 real 32,044-byte WAV files, ten stable-item resolves and ten sequential Quick Look opens. This is the initial #622 profile; there was no earlier inline-audio/Quick Look baseline. - Item resolve: p50 24.4 ms, p95 47.9 ms. - Quick Look open with 32 siblings: p50 571.01 ms, p95 985.47 ms; ten-open sequential burst wall time 6844.32 ms. - Server: mean RSS 266,499,231 bytes, peak RSS 266,588,160 bytes; mean CPU 14.44%, peak CPU 99.27%. - Load average: 21.62 / 17.32 / 16.96 before; 20.61 / 17.24 / 16.94 after. ## Gates `bun run check` from `apps/web`: ```text $ node scripts/check-user-storage.mjs && node scripts/check-type-tokens.mjs && node scripts/check-motion-tokens.mjs && svelte-kit sync && svelte-check --tsconfig ./tsconfig.json User browser caches use userStorage; only documented device/public-link exceptions remain. Text sizes and UI shape values use shared role tokens. UI transitions and animation options use shared motion tokens or documented exceptions. Loading svelte-check in workspace: /home/kayg/Developer/calternal-wt/calcard-series/apps/web Getting Svelte diagnostics... svelte-check found 0 errors and 0 warnings ``` `bun run test` from `apps/web`: ```text Test Files 148 passed (148) Tests 1016 passed (1016) Start at 20:44:53 Duration 150.06s (transform 47%, environment 20%, import 16%, tests 11%, setup 5%) ``` Focused audio/Quick Look e2e: ```text calendar attachment audio e2e: keyboard and pointer playback, touch taps, sibling Quick Look, URL restoration, and 390/820/1440 light/dark screenshots passed ``` `bun run test:e2e:calendar` was run once and failed in the Composer commit-freeze assertion at `apps/web/e2e/calendar.mjs:1425`. I kept its expectation unchanged. Exact failure: ```text AssertionError [ERR_ASSERTION]: the send carries the snapshot: 20:49 nFrozen snapshot at /home/kayg/Developer/calternal-wt/calcard-series/apps/web/e2e/calendar.mjs:1425:10 at processTicksAndRejections (native:7:39) { generatedMessage: true, actual: false, expected: true, operator: '==', code: 'ERR_ASSERTION', diff: 'simple' } error: script "test:e2e:calendar" exited with code 1 ``` ## Screenshot attachments **Agenda attachment deck** - Paper: [390px](https://git.kayg.org/attachments/a9ef45c7-d3d7-49e9-ad61-8242e8764bdb) · [820px](https://git.kayg.org/attachments/5a6fe96f-f43e-434c-9cf8-8fd382d996d5) · [1440px](https://git.kayg.org/attachments/cdc43b49-15b1-4b23-ba9a-7915001e7ca6) - Tokyo Night: [390px](https://git.kayg.org/attachments/83d419b4-1f7d-4b9b-a35b-36e26ca91906) · [820px](https://git.kayg.org/attachments/0cd9130c-62cb-46ed-ab9c-56a1f497b1b6) · [1440px](https://git.kayg.org/attachments/e6ec2e37-1d75-4c40-8f6d-68d12ff9c637) **Journal preview audio chip** - Paper: [390px](https://git.kayg.org/attachments/637f638f-abe7-4c49-b21b-aba481569e1a) · [820px](https://git.kayg.org/attachments/cb9258dc-eea3-4cd6-8469-b278ec583471) · [1440px](https://git.kayg.org/attachments/248b1ace-a590-4ce6-af99-da8a36442413) - Tokyo Night: [390px](https://git.kayg.org/attachments/7c952ae0-da26-495f-a60d-2539247c8174) · [820px](https://git.kayg.org/attachments/3f2081ec-3ef7-41cf-b937-b3a9715b9679) · [1440px](https://git.kayg.org/attachments/0845d19a-6c37-46c1-82f9-638cae09c5cc) **Journal preview playing state** - Paper: [390px](https://git.kayg.org/attachments/d08911cd-440a-4438-a30a-6dcc6a6f8e4c) · [820px](https://git.kayg.org/attachments/e8a447c1-38e6-4838-9cbc-9c0e233e9d6e) · [1440px](https://git.kayg.org/attachments/dd18272f-b851-4c42-87ca-5cb03cea14b5) - Tokyo Night: [390px](https://git.kayg.org/attachments/d067103d-55ec-4b26-b407-3051524e08ba) · [820px](https://git.kayg.org/attachments/138a855a-5ba1-4982-8591-df2cb7d02a07) · [1440px](https://git.kayg.org/attachments/6a4ac92c-6153-4e88-a2be-c83b029e4fc1) **Quick Look audio** - Paper: [390px](https://git.kayg.org/attachments/d1c3e12a-0d7b-4a44-b234-4d742b0b3725) · [820px](https://git.kayg.org/attachments/d91a2f36-b536-46b2-bb8b-a2c7be45708e) · [1440px](https://git.kayg.org/attachments/cea78420-cde6-4ea7-9c16-6c94ee8a45ed) - Tokyo Night: [390px](https://git.kayg.org/attachments/cce62be7-20dd-4efe-aea9-0e8062b9ca66) · [820px](https://git.kayg.org/attachments/8d2bbc04-3624-4d46-b4c3-41a9c0063c72) · [1440px](https://git.kayg.org/attachments/b326b412-f9ce-44ac-a1d6-636411141874) No push or deploy was performed. The branch includes the required local merge from `origin/dev` (`55f8a17dc`).

kayg commented

2026-10-01 20:31:56 +00:00

Author

Owner

Starting round 2 on branch job/calcard-series at base dd0e257137 (already ahead 14 commits from the prior round). I am tracing the Quick Look, shared voice controls, attachment naming, and Agenda added-deck rendering before implementing the screenshot review fixes.

Starting round 2 on branch job/calcard-series at base dd0e2571371db5191614601f177e5c6dc069e39b (already ahead 14 commits from the prior round). I am tracing the Quick Look, shared voice controls, attachment naming, and Agenda added-deck rendering before implementing the screenshot review fixes.

kayg commented

2026-10-01 20:41:41 +00:00

Author

Owner

Correction to my start note: the branch base is 687ff70313 (merge-base with origin/dev). dd0e257137 was the prior round's starting HEAD.

Correction to my start note: the branch base is 687ff703136e71e89f8dfba139e93cd0788b25c1 (merge-base with origin/dev). dd0e2571371db5191614601f177e5c6dc069e39b was the prior round's starting HEAD.

kayg commented

2026-10-01 20:48:14 +00:00

Author

Owner

Round 2 findings from the existing production-build evidence and code: QuickLook.svelte renders a separate five-pixel VoiceWaveform followed by native ; ItemPreview audio rows use the generic attachmentKindLabel('Voice Memo') while Agenda cards render the API file name; and ActivityStack exposes its count only as a badge with no visible kind label. The playing screenshot was captured after only 0.1 seconds, before the whole-second elapsed label can change.

Round 2 findings from the existing production-build evidence and code: QuickLook.svelte renders a separate five-pixel VoiceWaveform followed by native <audio controls>; ItemPreview audio rows use the generic attachmentKindLabel('Voice Memo') while Agenda cards render the API file name; and ActivityStack exposes its count only as a badge with no visible kind label. The playing screenshot was captured after only 0.1 seconds, before the whole-second elapsed label can change.

kayg commented

2026-10-01 21:34:50 +00:00

Author

Owner

The actual Recorder flow in the #421 production e2e exposed a name mismatch. The Journal attachment kept Voice memo 2026-10-01 23.32.webm, while its stored target basename was 2026-10-01 233238-c0d5 Voice memo 2026-10-01 23.32.webm; the Agenda row then showed Voice memo 2026-10-01 23.32 instead of Voice Memo, 23:32. The shared name rule assumed the indexed filename began with the recorder label. I am updating it to use the preserved recorder display title and adding a regression for the prefixed storage name.

The actual Recorder flow in the #421 production e2e exposed a name mismatch. The Journal attachment kept `Voice memo 2026-10-01 23.32.webm`, while its stored target basename was `2026-10-01 233238-c0d5 Voice memo 2026-10-01 23.32.webm`; the Agenda row then showed `Voice memo 2026-10-01 23.32` instead of `Voice Memo, 23:32`. The shared name rule assumed the indexed filename began with the recorder label. I am updating it to use the preserved recorder display title and adding a regression for the prefixed storage name.

kayg commented

2026-10-01 22:00:34 +00:00

Author

Owner

#622 round 2 complete

Quick Look now uses floating title and action pills with ProgressiveBlur. Audio uses shared custom playback controls with live time, a scrubbable waveform, Space and arrow-key controls, playback speed, and screen-reader labels. Agenda, preview, and Quick Look use the same extensionless name; generated recorder names retain their clock label even when Files prefixes the stored filename. Attachment row actions sit inside the trailing edge, and every ActivityStack has a visible label.

Commits

c3387df5c Fix Calendar audio attachment previews
46c1716ee Target Calendar attachment body on touch
b019a64e5 Format recorder names after Files prefixes
24cb4402d Record Calendar audio player profile

Head SHA: 24cb4402d12441d35bb15058bc0eceb3ba81982d.

Production screenshots

Captured from the production build at 390, 820, and 1440 px in Paper and Tokyo Night. All 24 PNGs are attached to this issue:

Gates

bun run check:

svelte-check found 0 errors and 0 warnings

bun run test:

 Test Files  148 passed (148)
      Tests  1018 passed (1018)

Production build:

✓ built in 31.66s
> Using @sveltejs/adapter-static
  Wrote site to "build"
  ✔ done

calendar attachment audio e2e:

calendar attachment audio e2e: custom Quick Look playback, waveform seek, speed control, inline playback, touch taps, sibling Quick Look, URL restoration, row actions, stack labels, and 390/820/1440 light/dark screenshots passed

calendar-preview-421.mjs:

Calendar preview 421 passed; screenshots saved in /home/kayg/Developer/calternal-wt/calcard-series/artifacts/preview-421

Media adversarial round:

HEIF/AVIF/PDF upload probe passed

No Rust source or API contract changed, so Rust fmt/clippy/test gates were not applicable. cargo build -p calternal-server was used for the local browser runs. cargo clean removed the job target, and the web build output was deleted after capture.

Performance

The profile is recorded in docs/perf/baseline.json. The perf VM was unreachable (No route to host), so this was a local run under high load. For 32 WAV attachments, Quick Look open was p50 599.87 ms / p95 1141.54 ms; player-ready was p50 717.10 ms / p95 1159.25 ms. Server mean CPU was 15.54%, mean RSS 255852637 bytes, and peak RSS 261435392 bytes. Load average was 18.09/16.25/16.24 before and 18.16/16.36/16.28 after; treat latency as load-sensitive.

Decisions not specified by DESIGN

Playback speed cycles through 1×, 1.25×, 1.5×, and 2×. Arrow keys seek by five seconds.
Generated recorder names use the Voice Memo, HH:MM form when their preserved title matches the recorder pattern, including when Files adds a uniqueness prefix to its stored filename. Other user titles stay extensionless.
File stacks use the visible label “N files”, Notes stacks use “N notes”, and photo stacks use “N Added” per #624.

## #622 round 2 complete Quick Look now uses floating title and action pills with ProgressiveBlur. Audio uses shared custom playback controls with live time, a scrubbable waveform, Space and arrow-key controls, playback speed, and screen-reader labels. Agenda, preview, and Quick Look use the same extensionless name; generated recorder names retain their clock label even when Files prefixes the stored filename. Attachment row actions sit inside the trailing edge, and every ActivityStack has a visible label. ## Commits - `c3387df5c` Fix Calendar audio attachment previews - `46c1716ee` Target Calendar attachment body on touch - `b019a64e5` Format recorder names after Files prefixes - `24cb4402d` Record Calendar audio player profile Head SHA: `24cb4402d12441d35bb15058bc0eceb3ba81982d`. ## Production screenshots Captured from the production build at 390, 820, and 1440 px in Paper and Tokyo Night. All 24 PNGs are attached to this issue: ### Inline attachment rows - 390 px: [Paper](https://git.kayg.org/attachments/6e91a8ed-14be-4ea2-b2e2-fc9e4dacf4d8) · [Tokyo Night](https://git.kayg.org/attachments/be162095-89fa-4242-a968-647740bfa85f) - 820 px: [Paper](https://git.kayg.org/attachments/76026928-cbd9-401d-9ac3-5952feed4447) · [Tokyo Night](https://git.kayg.org/attachments/404b8ebf-4cff-4a6f-9a9b-d244a4f74a42) - 1440 px: [Paper](https://git.kayg.org/attachments/04b7675b-2240-44eb-98a6-8b7da60e77c2) · [Tokyo Night](https://git.kayg.org/attachments/ec7ce27e-0ef4-4268-8fed-673b4b1b6575) ### Playing rows - 390 px: [Paper](https://git.kayg.org/attachments/2ff6228b-8b5e-4698-a2d9-55c519d351a9) · [Tokyo Night](https://git.kayg.org/attachments/af212f3f-9353-4206-b9f4-9b1a6fc9cc90) - 820 px: [Paper](https://git.kayg.org/attachments/0d84f190-6280-45d4-926d-0412ea4f336e) · [Tokyo Night](https://git.kayg.org/attachments/e00c49c6-cb18-4064-a673-b341253c469b) - 1440 px: [Paper](https://git.kayg.org/attachments/98b7a6f7-af8e-4e7b-9d3d-c24b18bc8622) · [Tokyo Night](https://git.kayg.org/attachments/24a78dbf-92f4-4e2b-963b-efbd4b2f46bc) ### Agenda deck - 390 px: [Paper](https://git.kayg.org/attachments/0b4f6f0a-1411-45b6-80ac-668e546b47c9) · [Tokyo Night](https://git.kayg.org/attachments/08d14428-d1a1-47b0-816c-25165c773cee) - 820 px: [Paper](https://git.kayg.org/attachments/0898a8c2-7fb8-443e-80ba-49618259744a) · [Tokyo Night](https://git.kayg.org/attachments/af483812-8601-4369-96e3-0a847ba4d8cb) - 1440 px: [Paper](https://git.kayg.org/attachments/9f65296e-3ec4-4b7b-ad1b-0ef1dc0ffba4) · [Tokyo Night](https://git.kayg.org/attachments/97b085e7-0b36-4929-9eee-fbcc9f5f5ebc) ### Quick Look - 390 px: [Paper](https://git.kayg.org/attachments/d28dd226-0079-4bb6-b80f-ed96bcd9da89) · [Tokyo Night](https://git.kayg.org/attachments/14444224-b909-4567-ac28-e09d583efc61) - 820 px: [Paper](https://git.kayg.org/attachments/dfb4def7-a717-4916-bf7e-6cabacdf1504) · [Tokyo Night](https://git.kayg.org/attachments/3a84007b-9c5a-4237-90bb-d25164f67250) - 1440 px: [Paper](https://git.kayg.org/attachments/e3ed6781-75ff-47f5-af79-b2542bba459e) · [Tokyo Night](https://git.kayg.org/attachments/cf101bfc-3385-42e6-8ca1-4ac514a05347) ## Gates `bun run check`: ``` svelte-check found 0 errors and 0 warnings ``` `bun run test`: ``` Test Files 148 passed (148) Tests 1018 passed (1018) ``` Production build: ``` ✓ built in 31.66s > Using @sveltejs/adapter-static Wrote site to "build" ✔ done ``` `calendar attachment audio e2e`: ``` calendar attachment audio e2e: custom Quick Look playback, waveform seek, speed control, inline playback, touch taps, sibling Quick Look, URL restoration, row actions, stack labels, and 390/820/1440 light/dark screenshots passed ``` `calendar-preview-421.mjs`: ``` Calendar preview 421 passed; screenshots saved in /home/kayg/Developer/calternal-wt/calcard-series/artifacts/preview-421 ``` Media adversarial round: ``` HEIF/AVIF/PDF upload probe passed ``` No Rust source or API contract changed, so Rust fmt/clippy/test gates were not applicable. `cargo build -p calternal-server` was used for the local browser runs. `cargo clean` removed the job target, and the web build output was deleted after capture. ## Performance The profile is recorded in `docs/perf/baseline.json`. The perf VM was unreachable (`No route to host`), so this was a local run under high load. For 32 WAV attachments, Quick Look open was p50 599.87 ms / p95 1141.54 ms; player-ready was p50 717.10 ms / p95 1159.25 ms. Server mean CPU was 15.54%, mean RSS 255852637 bytes, and peak RSS 261435392 bytes. Load average was 18.09/16.25/16.24 before and 18.16/16.36/16.28 after; treat latency as load-sensitive. ## Decisions not specified by DESIGN - Playback speed cycles through 1×, 1.25×, 1.5×, and 2×. Arrow keys seek by five seconds. - Generated recorder names use the `Voice Memo, HH:MM` form when their preserved title matches the recorder pattern, including when Files adds a uniqueness prefix to its stored filename. Other user titles stay extensionless. - File stacks use the visible label “N files”, Notes stacks use “N notes”, and photo stacks use “N Added” per #624.

kayg commented

2026-10-01 22:07:17 +00:00

Author

Owner

Starting round 3 on job/calcard-series. Base: 687ff703136e71e89f8dfba139e93cd0788b25c1 (merge-base with origin/dev). I am fixing the Quick Look title pill sizing and the Calendar “Show in Files” action, then I will recapture the six Quick Look screenshots and verify the overlay is open in each capture.

Starting round 3 on `job/calcard-series`. Base: `687ff703136e71e89f8dfba139e93cd0788b25c1` (merge-base with `origin/dev`). I am fixing the Quick Look title pill sizing and the Calendar “Show in Files” action, then I will recapture the six Quick Look screenshots and verify the overlay is open in each capture.

kayg commented

2026-10-01 22:34:15 +00:00

Author

Owner

Round 3 complete

Branch: job/calcard-series
Head: 5f7fdb96706aca0c457a6b7851f548f7f618ac85
git fetch origin && git merge origin/dev: Already up to date.

Built

The Quick Look title pill now hugs its content. Its two-line title and metadata fit inside the pill padding, and the icon centers on the text block.
“Show in Files” is a folder-icon pill button in the shared Quick Look action group. Its warm tooltip advertises Enter.
The e2e confirms that every Quick Look screenshot has the viewer and the expected attachment open. It checks the title pill width, inner padding and icon alignment at each width and theme.

Files

packages/ui/src/components/viewer/QuickLook.svelte
apps/web/src/routes/calendar/[view]/[date]/+page.svelte
apps/web/e2e/calendar-attachment-audio-622.mjs

Screenshots

All six screenshots are from the real production SPA at 390, 820 and 1440 px. Each capture checked for the open Quick Look overlay and Voice Memo One heading.

Paper: 390 px · 820 px · 1440 px
Tokyo Night: 390 px · 820 px · 1440 px

Gates

bun run build:

✓ built in 24.87s
> Using @sveltejs/adapter-static
  Wrote site to "build"
  ✔ done

bun run check:

$ node scripts/check-user-storage.mjs && node scripts/check-type-tokens.mjs && node scripts/check-motion-tokens.mjs && svelte-kit sync && svelte-check --tsconfig ./tsconfig.json
User browser caches use userStorage; only documented device/public-link exceptions remain.
Text sizes and UI shape values use shared role tokens.
UI transitions and animation options use shared motion tokens or documented exceptions.
Loading svelte-check in workspace: /home/kayg/Developer/calternal-wt/calcard-series/apps/web
Getting Svelte diagnostics...

svelte-check found 0 errors and 0 warnings

bun run test:

 Test Files  148 passed (148)
      Tests  1018 passed (1018)
   Start at  00:26:41
   Duration  185.34s (transform 52%, environment 18%, import 15%, tests 11%, setup 4%)

Focused production e2e:

calendar attachment audio e2e: custom Quick Look playback, waveform seek, speed control, inline playback, touch taps, sibling Quick Look, URL restoration, row actions, stack labels, and 390/820/1440 light/dark screenshots passed

cargo build -p calternal-server --bin calternal-server (e2e prerequisite):

Finished `dev` profile [unoptimized + debuginfo] target(s) in 1m 06s

Rust fmt/clippy/test gates were not run because no Rust crate changed. cargo clean:

Removed 7237 files, 4.6GiB total

git diff --check passed with no output. No push or deploy was performed. The generated web build output was deleted.

Decisions and gaps

DESIGN §34 requires a shortcut tooltip but does not name one for “Show in Files”. I used the existing registered files.open Enter shortcut on the focused button, so the action keeps native keyboard activation and does not add a new binding.
Known gaps: none in this round's scope.

## Round 3 complete Branch: `job/calcard-series` Head: `5f7fdb96706aca0c457a6b7851f548f7f618ac85` `git fetch origin && git merge origin/dev`: `Already up to date.` ### Built - The Quick Look title pill now hugs its content. Its two-line title and metadata fit inside the pill padding, and the icon centers on the text block. - “Show in Files” is a folder-icon pill button in the shared Quick Look action group. Its warm tooltip advertises Enter. - The e2e confirms that every Quick Look screenshot has the viewer and the expected attachment open. It checks the title pill width, inner padding and icon alignment at each width and theme. ### Files - `packages/ui/src/components/viewer/QuickLook.svelte` - `apps/web/src/routes/calendar/[view]/[date]/+page.svelte` - `apps/web/e2e/calendar-attachment-audio-622.mjs` ### Screenshots All six screenshots are from the real production SPA at 390, 820 and 1440 px. Each capture checked for the open Quick Look overlay and Voice Memo One heading. - Paper: [390 px](https://git.kayg.org/attachments/242e97b0-5edd-489b-8f50-101aba1e04b1) · [820 px](https://git.kayg.org/attachments/1272bd6e-882c-4298-9748-6734ad565b79) · [1440 px](https://git.kayg.org/attachments/8d3bb44d-b51b-4f17-b33c-4ffb9f025b45) - Tokyo Night: [390 px](https://git.kayg.org/attachments/703e66d8-1dee-46ff-9b92-f93bb774a5ca) · [820 px](https://git.kayg.org/attachments/8ffa2e6e-69e8-4404-82c1-819523ac3c81) · [1440 px](https://git.kayg.org/attachments/a7b21ca5-82c7-4f81-ab79-74442faf32a2) ### Gates `bun run build`: ```text ✓ built in 24.87s > Using @sveltejs/adapter-static Wrote site to "build" ✔ done ``` `bun run check`: ```text $ node scripts/check-user-storage.mjs && node scripts/check-type-tokens.mjs && node scripts/check-motion-tokens.mjs && svelte-kit sync && svelte-check --tsconfig ./tsconfig.json User browser caches use userStorage; only documented device/public-link exceptions remain. Text sizes and UI shape values use shared role tokens. UI transitions and animation options use shared motion tokens or documented exceptions. Loading svelte-check in workspace: /home/kayg/Developer/calternal-wt/calcard-series/apps/web Getting Svelte diagnostics... svelte-check found 0 errors and 0 warnings ``` `bun run test`: ```text Test Files 148 passed (148) Tests 1018 passed (1018) Start at 00:26:41 Duration 185.34s (transform 52%, environment 18%, import 15%, tests 11%, setup 4%) ``` Focused production e2e: ```text calendar attachment audio e2e: custom Quick Look playback, waveform seek, speed control, inline playback, touch taps, sibling Quick Look, URL restoration, row actions, stack labels, and 390/820/1440 light/dark screenshots passed ``` `cargo build -p calternal-server --bin calternal-server` (e2e prerequisite): ```text Finished `dev` profile [unoptimized + debuginfo] target(s) in 1m 06s ``` Rust fmt/clippy/test gates were not run because no Rust crate changed. `cargo clean`: ```text Removed 7237 files, 4.6GiB total ``` `git diff --check` passed with no output. No push or deploy was performed. The generated web build output was deleted. ### Decisions and gaps - DESIGN §34 requires a shortcut tooltip but does not name one for “Show in Files”. I used the existing registered `files.open` Enter shortcut on the focused button, so the action keeps native keyboard activation and does not add a new binding. - Known gaps: none in this round's scope.

kayg referenced this issue

2026-10-02 13:00:47 +00:00

Composer recording: port the sveltebits Voice Pill (icons, waveform, timer); Stop attaches directly, no 'Keep' step #617

kayg referenced this issue

2026-10-02 13:16:23 +00:00

Composer recording: port the sveltebits Voice Pill (icons, waveform, timer); Stop attaches directly, no 'Keep' step #617

kayg referenced this issue

2026-10-02 17:28:00 +00:00

Voice memo files: Inspector 'Used in' backlinks to the entry, audio kind (not 'WebM video'), voice-memo icon everywhere #620

kayg referenced this issue

2026-10-02 17:33:01 +00:00

Plan: merge order and conflicts for merge round 7b #867