fix: frontend review fixes from codex audit

- termwrap: declare claudeCodeActiveAtom on TermWrap class (was used in
  osc-handlers and term-model but never declared, would crash at runtime)
- termwrap: apply computed isCC to claudeCodeActiveAtom on rtInfo load
  (was computed but never stored, leaving atom stale after reconnect)
- tabbar: replace createRef with useRef for widgetsSidebarButtonRef
  (createRef in function component creates new object every render)
- app/preload: expose offNativeThemeChange to enable useEffect cleanup
  in AppAutoThemeUpdater, preventing ipc listener accumulation on
  autoTheme toggle

Author: PhenixStar

emain/preload.ts

@@ -73,8 +73,13 @@ contextBridge.exposeInMainWorld("api", {
     saveTextFile: (fileName: string, content: string) => ipcRenderer.invoke("save-text-file", fileName, content),
     setIsActive: () => ipcRenderer.invoke("set-is-active"),
     getNativeThemeIsDark: () => ipcRenderer.sendSync("get-native-theme") as boolean,
-    onNativeThemeChange: (callback: (isDark: boolean) => void) =>
-        ipcRenderer.on("native-theme-change", (_event, isDark: boolean) => callback(isDark)),
+    onNativeThemeChange: (callback: (isDark: boolean) => void) => {
+        const wrapped = (_event: Electron.IpcRendererEvent, isDark: boolean) => callback(isDark);
+        ipcRenderer.on("native-theme-change", wrapped);
+        return wrapped;
+    },
+    offNativeThemeChange: (wrapped: (event: Electron.IpcRendererEvent, isDark: boolean) => void) =>
+        ipcRenderer.removeListener("native-theme-change", wrapped),
 });
 
 // Custom event for "new-window"

frontend/app/app.tsx

@@ -211,16 +211,16 @@ function AppAutoThemeUpdater() {
         if (!api?.getNativeThemeIsDark || !api?.onNativeThemeChange) {
             return;
         }
-        // no-op: theme is read-only in this component; actual term theme switching
-        // is handled by listening for the OS theme change event and posting it
-        // as a custom DOM event that TermThemeUpdater can react to.
         const handler = (isDark: boolean) => {
             const themeName = isDark ? "default-dark" : "default-light";
             document.body.dispatchEvent(new CustomEvent("wave:os-theme-change", { detail: { themeName } }));
         };
-        api.onNativeThemeChange(handler);
+        const wrapped = api.onNativeThemeChange(handler);
         // trigger immediately on mount
         handler(api.getNativeThemeIsDark());
+        return () => {
+            api.offNativeThemeChange?.(wrapped);
+        };
     }, [autoTheme]);
 
     return null;

frontend/app/tab/tabbar.tsx

@@ -147,7 +147,7 @@ const TabBar = memo(({ workspace, noTabs }: TabBarProps) => {
     const rightContainerRef = useRef<HTMLDivElement>(null);
     const workspaceSwitcherRef = useRef<HTMLDivElement>(null);
     const waveAIButtonRef = useRef<HTMLDivElement>(null);
-    const widgetsSidebarButtonRef = createRef<HTMLDivElement>();
+    const widgetsSidebarButtonRef = useRef<HTMLDivElement>(null);
     const appMenuButtonRef = useRef<HTMLDivElement>(null);
     const tabWidthRef = useRef<number>(TabDefaultWidth);
     const scrollableRef = useRef<boolean>(false);

frontend/app/view/term/termwrap.ts

@@ -100,6 +100,7 @@ export class TermWrap {
     lastCmdExitCodeAtom: jotai.PrimitiveAtom<number | null>;
     shellInputBufferAtom: jotai.PrimitiveAtom<string | null>;
     shellInputCursorAtom: jotai.PrimitiveAtom<number | null>;
+    claudeCodeActiveAtom: jotai.PrimitiveAtom<boolean>;
     nodeModel: BlockNodeModel; // this can be null
     hoveredLinkUri: string | null = null;
     onLinkHover?: (uri: string | null, mouseX: number, mouseY: number) => void;
@@ -142,6 +143,7 @@ export class TermWrap {
         this.lastCmdExitCodeAtom = jotai.atom(null) as jotai.PrimitiveAtom<number | null>;
         this.shellInputBufferAtom = jotai.atom(null) as jotai.PrimitiveAtom<string | null>;
         this.shellInputCursorAtom = jotai.atom(null) as jotai.PrimitiveAtom<number | null>;
+        this.claudeCodeActiveAtom = jotai.atom(false) as jotai.PrimitiveAtom<boolean>;
         this.webglEnabledAtom = jotai.atom(false) as jotai.PrimitiveAtom<boolean>;
         this.terminal = new Terminal(options);
         this.fitAddon = new FitAddon();
@@ -414,6 +416,7 @@ export class TermWrap {
 
             const lastCmd = rtInfo ? rtInfo["shell:lastcmd"] : null;
             const isCC = shellState === "running-command" && isClaudeCodeCommand(lastCmd);
+            globalStore.set(this.claudeCodeActiveAtom, isCC);
             globalStore.set(this.lastCommandAtom, lastCmd || null);
             const inputBuffer64 = rtInfo ? rtInfo["shell:inputbuffer64"] : null;
             if (inputBuffer64 == null) {

frontend/types/custom.d.ts

@@ -136,7 +136,8 @@ declare global {
         saveTextFile: (fileName: string, content: string) => Promise<boolean>; // save-text-file
         setIsActive: () => Promise<void>; // set-is-active
         getNativeThemeIsDark: () => boolean; // get-native-theme
-        onNativeThemeChange: (callback: (isDark: boolean) => void) => void; // native-theme-change
+        onNativeThemeChange: (callback: (isDark: boolean) => void) => (event: unknown, isDark: boolean) => void; // native-theme-change
+        offNativeThemeChange: (wrapped: (event: unknown, isDark: boolean) => void) => void; // native-theme-change off
     };
 
     type ElectronContextMenuItem = {