feat: guide Background Sound downloads in picker

Author: txchen

src/vue-tui/component.ts

@@ -783,16 +783,16 @@ function backgroundSoundPickerModal(
   });
   return h(Box, {
     flexDirection: "column", borderStyle: "round", borderColor: noColor ? undefined : "cyan",
-    paddingX: 2, width: "50%",
+    paddingX: 2, width: "80%",
   }, () => [
-    h(Text, { bold: true }, () => "Choose Background Sound"),
+    h(Text, { bold: true }, () => "Choose Background Sound · j/k ↑/↓ · Enter · Esc"),
     ...rows,
-    h(Text, { dimColor: true }, () => "j/k ↑/↓ · Enter · Esc"),
+    h(Text, { dimColor: true }, () => "Missing sounds? macOS Settings download · Esc then u refresh"),
   ]);
 }
 
 function backgroundSoundPickerVisibleCount(terminalRows: number, terminalColumns: number, soundCount: number): number {
-  const chromeRows = terminalColumns < 70 ? 9 : 8;
+  const chromeRows = terminalColumns < 70 ? 11 : 8;
   return Math.max(1, Math.min(soundCount, terminalRows - chromeRows));
 }
 

tests/vue-tui.test.ts

@@ -185,8 +185,10 @@ describe("TMU top-level surface smoke", () => {
       volumePercent: 45,
     };
     const writes: string[] = [];
+    let reads = 0;
     const control = {
-      probe: async () => snapshot, read: async () => snapshot,
+      probe: async () => snapshot,
+      read: async () => { reads += 1; return snapshot; },
       setEnabled: async (enabled: boolean) => (writes.push(`enabled:${enabled}`), snapshot = { ...snapshot, enabled }),
       setSound: async (id: string) => (writes.push(`sound:${id}`), snapshot = { ...snapshot, sound: snapshot.sounds.find((sound) => sound.id === id)! }),
       setVolume: async (volumePercent: number) => (writes.push(`volume:${volumePercent}`), snapshot = { ...snapshot, volumePercent }),
@@ -205,8 +207,14 @@ describe("TMU top-level surface smoke", () => {
     expect(writes).toEqual(["enabled:true"]);
     await terminal.stdin.write("\r");
     expect(terminal.lastFrame()).toContain("Choose Background Sound");
+    expect(terminal.lastFrame()).toContain("Missing sounds? macOS Settings download · Esc then u refresh");
     expect(terminal.lastFrame()).toContain("Rain");
     expect(terminal.lastFrame()).toContain("Ocean");
+    await terminal.stdin.write("\x1b");
+    await terminal.stdin.write("u");
+    await sleep(0);
+    expect(reads).toBe(1);
+    await terminal.stdin.write("\r");
     await terminal.stdin.write("\x1b[B");
     await terminal.stdin.write("\r");
     expect(writes).toEqual(["enabled:true", "sound:Ocean"]);