ccdeck 3.27.0 → 3.27.4

package/dist/web/index.html

@@ -44,8 +44,8 @@
           stored === "light" || (stored !== "dark" && light) ? "light" : "dark");
       })();
     </script>
-    <script type="module" crossorigin src="/assets/index-BrjE0Aat.js"></script>
-    <link rel="stylesheet" crossorigin href="/assets/index-B5RadDLY.css">
+    <script type="module" crossorigin src="/assets/index-BSsa18Kr.js"></script>
+    <link rel="stylesheet" crossorigin href="/assets/index-B5yzqlDA.css">
   </head>
   <body>
     <div id="root"></div>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ccdeck",
-  "version": "3.27.0",
+  "version": "3.27.4",
   "description": "Live dashboard for Claude Code and Codex — which agent is waiting on you, tool calls, token spend and every Claude Code subagent on one calm canvas. Run it with npx ccdeck.",
   "type": "module",
   "bin": {

package/release-notes.json

@@ -56,6 +56,30 @@
       "body": "Each account card's ⋯ menu now breaks its cost down by project, over 7d / 30d / all."
     }
   ],
+  "3.27.1": [
+    {
+      "title": "🎨 Make Appearance easier to tune",
+      "body": "The Appearance dialog now has clearer sections, stronger selection states, and a calmer layout for choosing a theme and configuring music. Your existing settings and keyboard shortcuts continue to work."
+    }
+  ],
+  "3.27.2": [
+    {
+      "title": "💰 Project costs now match Usage",
+      "body": "Project cost totals no longer count the same Claude request once for every content block. Existing project history is rebuilt automatically so the totals align with the Usage panel."
+    }
+  ],
+  "3.27.3": [
+    {
+      "title": "🎵 Station selection works in the desktop app",
+      "body": "The music station picker now opens inside ccdeck instead of relying on the operating system popup, so choosing a station works reliably in the Electron app."
+    }
+  ],
+  "3.27.4": [
+    {
+      "title": "✅ Desktop picker release checks are green",
+      "body": "The station picker now keeps the same keyboard, motion, focus, and layout behavior as the rest of ccdeck across desktop and browser builds."
+    }
+  ],
   "3.25.0": [
     {
       "title": "🖱️ A click goes to the session, a double-click opens the details",

package/src/server/account-projects.mjs

@@ -34,6 +34,7 @@ import { readSwapLog, accountAtTime, trackedSince, seedActive, markGap } from ".
  *  a per-account total is never quietly inflated by work that is not that
  *  account's. A NUL keeps it from ever colliding with a real `email@@org` key. */
 export const UNATTRIBUTED = "\u0000unattributed";
+const STATE_VERSION = 2;
 
 /** Where the tally and cursors live, beside cswap-auto's own state. */
 export function statePath(home = homedir()) {
@@ -139,6 +140,10 @@ export function foldLine(tally, line, timeline, fallbackCwd) {
   if (!line || !line.includes('"usage"')) return;
   let obj = null;
   try { obj = JSON.parse(line); } catch { return; }
+  // Claude writes one assistant record for each content block in a request.
+  // Every block repeats the request's usage, so only block 0 is billable for
+  // this rollup. Older records without the field are kept compatible.
+  if (obj?.apiBlockIndex !== undefined && obj.apiBlockIndex !== 0) return;
   const usage = obj?.message?.usage;
   if (!usage || typeof usage !== "object") return;
   const ts = Date.parse(obj?.timestamp);
@@ -311,7 +316,7 @@ export function createProjectRollup({
   setInterval: setIv = setInterval,
   clearInterval: clearIv = clearInterval,
 } = {}) {
-  let state = { version: 1, cursors: {}, tally: {} };
+  let state = { version: STATE_VERSION, cursors: {}, tally: {} };
   let timer = null;
   let running = false;
   let dirty = false;
@@ -322,7 +327,14 @@ export function createProjectRollup({
     loaded = true;
     try {
       const disk = JSON.parse(await readFile(stateFile, "utf8"));
-      if (disk && disk.version === 1 && disk.tally && disk.cursors) state = disk;
+      if (disk && disk.version === STATE_VERSION && disk.tally && disk.cursors) {
+        state = disk;
+      } else if (disk && disk.version === 1) {
+        // Version 1 counted every API content block. Keep the heartbeat so a
+        // restart gap remains fenced, but rebuild the tally from transcripts.
+        state = { version: STATE_VERSION, cursors: {}, tally: {}, lastAlive: disk.lastAlive };
+        dirty = true;
+      }
     } catch { /* first run: empty state */ }
   }
 

package/src/server/best-of-nostalgia.mjs

@@ -0,0 +1,63 @@
+const NOSTALGIA_URL = "https://www.youtube.com/@bestofnostalgia";
+const CACHE_MS = 600_000;
+const MISS_CACHE_MS = 60_000;
+const READ_LIMIT = 2_000_000;
+const TIMEOUT_MS = 6_000;
+const BROWSER_UA = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0 Safari/537.36";
+
+let cache = null;
+let cacheAt = 0;
+let cacheTtl = 0;
+let inflight = null;
+
+function currentLiveVideo(html) {
+  const marker = '"liveBadgeText":"LIVE"';
+  const live = html.indexOf(marker);
+  if (live < 0) return null;
+  const start = Math.max(0, live - 2_000);
+  const window = html.slice(start, live + 2_000);
+  let best = null;
+  for (const match of window.matchAll(/"videoId":"([\w-]{11})"/g)) {
+    const distance = Math.abs(start + match.index - live);
+    if (!best || distance < best.distance) best = { id: match[1], distance };
+  }
+  return best?.id ?? null;
+}
+
+export async function fetchBestOfNostalgia({ fetchImpl } = {}) {
+  const now = Date.now();
+  if (cache && now - cacheAt < cacheTtl) return cache;
+  if (inflight) return inflight;
+  const get = fetchImpl ?? fetch;
+  inflight = (async () => {
+    try {
+      const response = await get(NOSTALGIA_URL, {
+        headers: { "User-Agent": BROWSER_UA, "Accept-Language": "en-US,en;q=0.9" },
+        signal: AbortSignal.timeout(TIMEOUT_MS),
+        redirect: "follow",
+      });
+      if (!response.ok) return settle(null);
+      const video = currentLiveVideo((await response.text()).slice(0, READ_LIMIT));
+      return settle(video ? { id: "best-of-nostalgia", label: "Best of Nostalgia — Live", video } : null);
+    } catch {
+      return settle(null);
+    } finally {
+      inflight = null;
+    }
+  })();
+  return inflight;
+}
+
+function settle(value) {
+  cache = value;
+  cacheAt = Date.now();
+  cacheTtl = value ? CACHE_MS : MISS_CACHE_MS;
+  return value;
+}
+
+export function forgetBestOfNostalgia() {
+  cache = null;
+  cacheAt = 0;
+  cacheTtl = 0;
+  inflight = null;
+}

package/src/server/cafe-music-bgm.mjs

@@ -0,0 +1,63 @@
+const CAFE_MUSIC_URL = "https://www.youtube.com/channel/UCJhjE7wbdYAae1G25m0tHAA";
+const CACHE_MS = 600_000;
+const MISS_CACHE_MS = 60_000;
+const READ_LIMIT = 2_000_000;
+const TIMEOUT_MS = 6_000;
+const BROWSER_UA = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0 Safari/537.36";
+
+let cache = null;
+let cacheAt = 0;
+let cacheTtl = 0;
+let inflight = null;
+
+function currentLiveVideo(html) {
+  const marker = '"liveBadgeText":"LIVE"';
+  const live = html.indexOf(marker);
+  if (live < 0) return null;
+  const start = Math.max(0, live - 2_000);
+  const window = html.slice(start, live + 2_000);
+  let best = null;
+  for (const match of window.matchAll(/"videoId":"([\w-]{11})"/g)) {
+    const distance = Math.abs(start + match.index - live);
+    if (!best || distance < best.distance) best = { id: match[1], distance };
+  }
+  return best?.id ?? null;
+}
+
+export async function fetchCafeMusicBgm({ fetchImpl } = {}) {
+  const now = Date.now();
+  if (cache && now - cacheAt < cacheTtl) return cache;
+  if (inflight) return inflight;
+  const get = fetchImpl ?? fetch;
+  inflight = (async () => {
+    try {
+      const response = await get(CAFE_MUSIC_URL, {
+        headers: { "User-Agent": BROWSER_UA, "Accept-Language": "en-US,en;q=0.9" },
+        signal: AbortSignal.timeout(TIMEOUT_MS),
+        redirect: "follow",
+      });
+      if (!response.ok) return settle(null);
+      const video = currentLiveVideo((await response.text()).slice(0, READ_LIMIT));
+      return settle(video ? { id: "cafe-music-bgm", label: "Cafe Music BGM — Live", video } : null);
+    } catch {
+      return settle(null);
+    } finally {
+      inflight = null;
+    }
+  })();
+  return inflight;
+}
+
+function settle(value) {
+  cache = value;
+  cacheAt = Date.now();
+  cacheTtl = value ? CACHE_MS : MISS_CACHE_MS;
+  return value;
+}
+
+export function forgetCafeMusicBgm() {
+  cache = null;
+  cacheAt = 0;
+  cacheTtl = 0;
+  inflight = null;
+}

package/src/server/good-life-radio.mjs

@@ -0,0 +1,63 @@
+const GOOD_LIFE_URL = "https://www.youtube.com/@TheGoodLiferadio";
+const CACHE_MS = 600_000;
+const MISS_CACHE_MS = 60_000;
+const READ_LIMIT = 2_000_000;
+const TIMEOUT_MS = 6_000;
+const BROWSER_UA = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0 Safari/537.36";
+
+let cache = null;
+let cacheAt = 0;
+let cacheTtl = 0;
+let inflight = null;
+
+function currentLiveVideo(html) {
+  const marker = '"liveBadgeText":"LIVE"';
+  const live = html.indexOf(marker);
+  if (live < 0) return null;
+  const start = Math.max(0, live - 2_000);
+  const window = html.slice(start, live + 2_000);
+  let best = null;
+  for (const match of window.matchAll(/"videoId":"([\w-]{11})"/g)) {
+    const distance = Math.abs(start + match.index - live);
+    if (!best || distance < best.distance) best = { id: match[1], distance };
+  }
+  return best?.id ?? null;
+}
+
+export async function fetchGoodLifeRadio({ fetchImpl } = {}) {
+  const now = Date.now();
+  if (cache && now - cacheAt < cacheTtl) return cache;
+  if (inflight) return inflight;
+  const get = fetchImpl ?? fetch;
+  inflight = (async () => {
+    try {
+      const response = await get(GOOD_LIFE_URL, {
+        headers: { "User-Agent": BROWSER_UA, "Accept-Language": "en-US,en;q=0.9" },
+        signal: AbortSignal.timeout(TIMEOUT_MS),
+        redirect: "follow",
+      });
+      if (!response.ok) return settle(null);
+      const video = currentLiveVideo((await response.text()).slice(0, READ_LIMIT));
+      return settle(video ? { id: "good-life-radio", label: "The Good Life Radio — Live", video } : null);
+    } catch {
+      return settle(null);
+    } finally {
+      inflight = null;
+    }
+  })();
+  return inflight;
+}
+
+function settle(value) {
+  cache = value;
+  cacheAt = Date.now();
+  cacheTtl = value ? CACHE_MS : MISS_CACHE_MS;
+  return value;
+}
+
+export function forgetGoodLifeRadio() {
+  cache = null;
+  cacheAt = 0;
+  cacheTtl = 0;
+  inflight = null;
+}

package/src/server/index.mjs

@@ -309,6 +309,39 @@ export function payloadChars(raw) {
   return n;
 }
 
+async function handleLiveRadioMix(req, res) {
+  if (process.env.AGENTS_DECK_NO_MUSIC === "1") {
+    return send(res, 200, { ok: true, live: false, off: true });
+  }
+
+  const { fetchLiveRadioMix } = await import(
+    pathToFileURL(join(PKG_ROOT, "src/server/live-radio-mix.mjs")).href
+  );
+  const answer = await fetchLiveRadioMix();
+  send(res, answer ? 200 : 404, answer ?? { ok: false, error: "Radio Mix is not live" });
+}
+
+async function handleBestOfNostalgia(req, res) {
+  if (process.env.AGENTS_DECK_NO_MUSIC === "1") return send(res, 200, { ok: true, live: false, off: true });
+  const { fetchBestOfNostalgia } = await import(pathToFileURL(join(PKG_ROOT, "src/server/best-of-nostalgia.mjs")).href);
+  const answer = await fetchBestOfNostalgia();
+  send(res, answer ? 200 : 404, answer ?? { ok: false, error: "Best of Nostalgia is not live" });
+}
+
+async function handleGoodLifeRadio(req, res) {
+  if (process.env.AGENTS_DECK_NO_MUSIC === "1") return send(res, 200, { ok: true, live: false, off: true });
+  const { fetchGoodLifeRadio } = await import(pathToFileURL(join(PKG_ROOT, "src/server/good-life-radio.mjs")).href);
+  const answer = await fetchGoodLifeRadio();
+  send(res, answer ? 200 : 404, answer ?? { ok: false, error: "The Good Life Radio is not live" });
+}
+
+async function handleCafeMusicBgm(req, res) {
+  if (process.env.AGENTS_DECK_NO_MUSIC === "1") return send(res, 200, { ok: true, live: false, off: true });
+  const { fetchCafeMusicBgm } = await import(pathToFileURL(join(PKG_ROOT, "src/server/cafe-music-bgm.mjs")).href);
+  const answer = await fetchCafeMusicBgm();
+  send(res, answer ? 200 : 404, answer ?? { ok: false, error: "Cafe Music BGM is not live" });
+}
+
 // Where the charge rides. A Symbol key rather than an ordinary field, because
 // the envelope is JSON.stringify'd on the hot path into both the SSE frame and
 // the events.jsonl line, and JSON.stringify ignores symbol-keyed properties
@@ -5828,6 +5861,23 @@ async function handleClaudeFm(req, res) {
   send(res, 200, answer);
 }
 
+async function handleLofiGirl(req, res) {
+  if (process.env.AGENTS_DECK_NO_MUSIC === "1") {
+    return send(res, 200, { ok: true, live: false, off: true });
+  }
+  const url = new URL(req.url, "http://localhost");
+  const station = url.searchParams.get("station");
+  if (!["relax", "game", "vibe", "sleep"].includes(station)) {
+    return send(res, 400, { ok: false, error: "unknown Lofi Girl station" });
+  }
+  const { fetchLofiStations } = await import(
+    pathToFileURL(join(PKG_ROOT, "src/server/lofi-girl.mjs")).href
+  );
+  const stations = await fetchLofiStations();
+  const answer = stations[station];
+  send(res, answer ? 200 : 404, answer ?? { ok: false, error: "station is not live" });
+}
+
 async function handleCodexQuota(req, res) {
   const { fetchCodexQuota } = await import(
     pathToFileURL(join(PKG_ROOT, "src/server/codex-quota.mjs")).href
@@ -6215,6 +6265,11 @@ const PINNED_MODULES = [
   "browser-watch.mjs",
   "browser-watch-store.mjs",
   "claude-fm.mjs",
+  "lofi-girl.mjs",
+  "live-radio-mix.mjs",
+  "best-of-nostalgia.mjs",
+  "good-life-radio.mjs",
+  "cafe-music-bgm.mjs",
   // system-metrics.mjs's two, on the platforms that have them, and the one
   // installer.mjs reaches for while it rewrites the hooks.
   "macmon.mjs",
@@ -7539,6 +7594,11 @@ export async function startServer({ port = 4317, host = "127.0.0.1", persist = n
     if (req.method === "GET"  && url.pathname === "/api/cswap-auto")  return guard(handleCswapAuto(req, res), res);
     if (req.method === "POST" && url.pathname === "/api/cswap-auto")  return guard(handleCswapAutoAction(req, res), res);
     if (req.method === "GET"  && url.pathname === "/api/claude-fm")   return guard(handleClaudeFm(req, res), res);
+    if (req.method === "GET"  && url.pathname === "/api/lofi-girl")   return guard(handleLofiGirl(req, res), res);
+    if (req.method === "GET"  && url.pathname === "/api/live-radio-mix") return guard(handleLiveRadioMix(req, res), res);
+    if (req.method === "GET"  && url.pathname === "/api/best-of-nostalgia") return guard(handleBestOfNostalgia(req, res), res);
+    if (req.method === "GET"  && url.pathname === "/api/good-life-radio") return guard(handleGoodLifeRadio(req, res), res);
+    if (req.method === "GET"  && url.pathname === "/api/cafe-music-bgm") return guard(handleCafeMusicBgm(req, res), res);
 
     // Through writeJsonArray rather than `send`, and through `guard` like every
     // route above it: this is the one answer whose size is the ring's size, and

package/src/server/live-radio-mix.mjs

@@ -0,0 +1,56 @@
+const RADIO_MIX_URL = "https://www.youtube.com/@liveradiomix";
+const CACHE_MS = 600_000;
+const MISS_CACHE_MS = 60_000;
+const READ_LIMIT = 2_000_000;
+const TIMEOUT_MS = 6_000;
+const BROWSER_UA = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0 Safari/537.36";
+
+let cache = null;
+let cacheAt = 0;
+let cacheTtl = 0;
+let inflight = null;
+
+function currentLiveVideo(html) {
+  const live = html.indexOf('"liveBadgeText":"LIVE"');
+  if (live < 0) return null;
+  const window = html.slice(Math.max(0, live - 2_000), live + 2_000);
+  return window.match(/"videoId":"([\w-]{11})"/)?.[1] ?? null;
+}
+
+export async function fetchLiveRadioMix({ fetchImpl } = {}) {
+  const now = Date.now();
+  if (cache && now - cacheAt < cacheTtl) return cache;
+  if (inflight) return inflight;
+  const get = fetchImpl ?? fetch;
+  inflight = (async () => {
+    try {
+      const response = await get(RADIO_MIX_URL, {
+        headers: { "User-Agent": BROWSER_UA, "Accept-Language": "en-US,en;q=0.9" },
+        signal: AbortSignal.timeout(TIMEOUT_MS),
+        redirect: "follow",
+      });
+      if (!response.ok) return settle(null);
+      const video = currentLiveVideo((await response.text()).slice(0, READ_LIMIT));
+      return settle(video ? { id: "radio-mix", label: "Radio Mix — Live", video } : null);
+    } catch {
+      return settle(null);
+    } finally {
+      inflight = null;
+    }
+  })();
+  return inflight;
+}
+
+function settle(value) {
+  cache = value;
+  cacheAt = Date.now();
+  cacheTtl = value ? CACHE_MS : MISS_CACHE_MS;
+  return value;
+}
+
+export function forgetLiveRadioMix() {
+  cache = null;
+  cacheAt = 0;
+  cacheTtl = 0;
+  inflight = null;
+}

package/src/server/lofi-girl.mjs

@@ -0,0 +1,76 @@
+const LOFI_GIRL_URL = "https://www.youtube.com/@LofiGirl";
+const CACHE_MS = 600_000;
+const MISS_CACHE_MS = 60_000;
+const READ_LIMIT = 2_000_000;
+const TIMEOUT_MS = 6_000;
+const BROWSER_UA = "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/124.0 Safari/537.36";
+
+export const LOFI_STATIONS = {
+  relax: { label: "Lofi Girl — relax/study" , terms: ["relax/study"] },
+  game: { label: "Lofi Girl — chill/game", terms: ["chill/game"] },
+  vibe: { label: "Lofi Girl — vibe/chill", terms: ["vibe/chill"] },
+  sleep: { label: "Lofi Girl — sleep/chill", terms: ["sleep/chill"] },
+};
+
+let cache = null;
+let cacheAt = 0;
+let cacheTtl = 0;
+let inflight = null;
+
+function stationVideo(html, terms) {
+  for (const term of terms) {
+    const index = html.toLowerCase().indexOf(term);
+    if (index < 0) continue;
+    const start = Math.max(0, index - 4_000);
+    const window = html.slice(start, index + 4_000);
+    const ids = [...window.matchAll(/"videoId":"([\w-]{11})"/g)];
+    if (ids.length) {
+      ids.sort((a, b) => Math.abs(start + a.index - index) - Math.abs(start + b.index - index));
+      return ids[0][1];
+    }
+  }
+  return null;
+}
+
+export async function fetchLofiStations({ fetchImpl } = {}) {
+  const now = Date.now();
+  if (cache && now - cacheAt < cacheTtl) return cache;
+  if (inflight) return inflight;
+  const get = fetchImpl ?? fetch;
+  inflight = (async () => {
+    try {
+      const response = await get(LOFI_GIRL_URL, {
+        headers: { "User-Agent": BROWSER_UA, "Accept-Language": "en-US,en;q=0.9" },
+        signal: AbortSignal.timeout(TIMEOUT_MS),
+        redirect: "follow",
+      });
+      if (!response.ok) return settle({});
+      const html = (await response.text()).slice(0, READ_LIMIT);
+      const stations = Object.fromEntries(
+        Object.entries(LOFI_STATIONS)
+          .map(([id, station]) => [id, { id, label: station.label, video: stationVideo(html, station.terms) }])
+          .filter(([, station]) => station.video),
+      );
+      return settle(stations);
+    } catch {
+      return settle({});
+    } finally {
+      inflight = null;
+    }
+  })();
+  return inflight;
+}
+
+function settle(value) {
+  cache = value;
+  cacheAt = Date.now();
+  cacheTtl = Object.keys(value).length ? CACHE_MS : MISS_CACHE_MS;
+  return value;
+}
+
+export function forgetLofiStations() {
+  cache = null;
+  cacheAt = 0;
+  cacheTtl = 0;
+  inflight = null;
+}