klaudio 0.11.0 → 0.11.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "klaudio",
-  "version": "0.11.0",
+  "version": "0.11.2",
   "description": "Add sound effects to your coding sessions — play sounds when tasks complete, notifications arrive, and more",
   "type": "module",
   "bin": {

package/src/cli.js

@@ -137,15 +137,16 @@ const NavHint = ({ back = true, extra = "" }) =>
   );
 
 // ── Screen: Scope ───────────────────────────────────────────────
-const ScopeScreen = ({ onNext, onMusic, tts, onToggleTts }) => {
+const ScopeScreen = ({ onNext, onMusic, onUpdate, tts, onToggleTts, outdatedReasons }) => {
+  const isOutdated = outdatedReasons && outdatedReasons.length > 0;
   const items = [
+    ...(isOutdated ? [{ label: "⬆ Apply updates", value: "_update" }] : []),
     { label: "Global — Claude Code + Copilot (all projects)", value: "global" },
     { label: "This project — Claude Code + Copilot (this project only)", value: "project" },
-    // index 2 = music
     { label: "🎵 Play game music while you code", value: "_music" },
   ];
   const [sel, setSel] = useState(0);
-  const GAP_AT = 2; // visual gap before this index
+  const GAP_AT = (isOutdated ? 1 : 0) + 2; // visual gap before music
 
   useInput((input, key) => {
     if (input === "k" || key.upArrow) {
@@ -156,12 +157,21 @@ const ScopeScreen = ({ onNext, onMusic, tts, onToggleTts }) => {
       onToggleTts();
     } else if (key.return) {
       const v = items[sel].value;
-      if (v === "_music") onMusic();
+      if (v === "_update") onUpdate();
+      else if (v === "_music") onMusic();
       else onNext(v);
     }
   });
 
   return h(Box, { flexDirection: "column" },
+    isOutdated
+      ? h(Box, { flexDirection: "column", marginLeft: 2, marginBottom: 1 },
+          h(Text, { color: "yellow", bold: true }, "  Updates available:"),
+          ...outdatedReasons.map((r, i) =>
+            h(Text, { key: i, color: "yellow", dimColor: true, marginLeft: 4 }, `+ ${r}`),
+          ),
+        )
+      : null,
     h(Text, { bold: true }, "  Where should sounds be installed?"),
     h(Box, { flexDirection: "column", marginLeft: 2 },
       ...items.map((item, i) => h(React.Fragment, { key: item.value },
@@ -1560,6 +1570,18 @@ const InstallApp = () => {
 
   useEffect(() => {
     isKokoroAvailable().then(setHasKokoro).catch(() => {});
+    // Check both scopes for outdated hooks on startup
+    Promise.all([
+      checkHooksOutdated("global"),
+      checkHooksOutdated("project"),
+    ]).then(([g, p]) => {
+      const combined = [...new Set([...g, ...p])];
+      setOutdatedReasons(combined);
+    }).catch(() => {});
+    // Also pre-load existing sounds from global (most common)
+    getExistingSounds("global").then((existing) => {
+      if (Object.keys(existing).length > 0) setSounds(existing);
+    }).catch(() => {});
   }, []);
 
   const initSoundsFromPreset = useCallback((pid) => {
@@ -1572,15 +1594,22 @@ const InstallApp = () => {
       case SCREEN.SCOPE:
         return h(ScopeScreen, {
           tts,
+          outdatedReasons,
           onToggleTts: () => setTts((v) => !v),
           onNext: (s) => {
             setScope(s);
+            // Refresh sounds/outdated for the selected scope
             getExistingSounds(s).then((existing) => {
               if (Object.keys(existing).length > 0) setSounds(existing);
             });
             checkHooksOutdated(s).then(setOutdatedReasons).catch(() => {});
             setScreen(SCREEN.PRESET);
           },
+          onUpdate: () => {
+            // Quick-apply: use global scope with existing sounds, skip to install
+            setScope("global");
+            setScreen(SCREEN.INSTALLING);
+          },
           onMusic: () => setScreen(SCREEN.MUSIC_MODE),
         });