fix(build): resolve TypeScript errors and add missing dependencies

- Add missing zustand dependency to package.json
- Fix unused variable errors in ToolWidgets.tsx
- Remove invalid 'white' theme comparison in claudeSyntaxTheme.ts
- Add proper TypeScript types to stores using StateCreator pattern
- Add null checks and type casting in Settings.tsx filter operations
- Add onChange handler to Switch component to suppress React warning
- Add 'check' script for TypeScript validation

These changes ensure the TypeScript build passes without errors.

src/stores/agentStore.ts

@@ -1,5 +1,6 @@
 import { create } from 'zustand';
 import { subscribeWithSelector } from 'zustand/middleware';
+import type { StateCreator } from 'zustand';
 import { api } from '@/lib/api';
 import type { AgentRunWithMetrics } from '@/lib/api';
 
@@ -32,8 +33,12 @@ interface AgentState {
   pollingInterval: NodeJS.Timeout | null;
 }
 
-export const useAgentStore = create<AgentState>()(
-  subscribeWithSelector((set, get) => ({
+const agentStore: StateCreator<
+  AgentState,
+  [],
+  [['zustand/subscribeWithSelector', never]],
+  AgentState
+> = (set, get) => ({
     // Initial state
     agentRuns: [],
     runningAgents: new Set(),
@@ -59,8 +64,8 @@ export const useAgentStore = create<AgentState>()(
       try {
         const runs = await api.listAgentRuns();
         const runningIds = runs
-          .filter(r => r.status === 'running' || r.status === 'pending')
-          .map(r => r.id?.toString() || '')
+          .filter((r) => r.status === 'running' || r.status === 'pending')
+          .map((r) => r.id?.toString() || '')
           .filter(Boolean);
         
         set({
@@ -83,7 +88,7 @@ export const useAgentStore = create<AgentState>()(
       
       try {
         const output = await api.getAgentRunWithRealTimeMetrics(runId).then(run => run.output || '');
-        set(state => ({
+        set((state) => ({
           sessionOutputs: {
             ...state.sessionOutputs,
             [runId]: output
@@ -107,7 +112,7 @@ export const useAgentStore = create<AgentState>()(
         const run = await api.getAgentRun(runId);
         
         // Update local state immediately
-        set(state => ({
+        set((state) => ({
           agentRuns: [run, ...state.agentRuns],
           runningAgents: new Set([...state.runningAgents, runId.toString()])
         }));
@@ -127,8 +132,8 @@ export const useAgentStore = create<AgentState>()(
         await api.killAgentSession(runId);
         
         // Update local state
-        set(state => ({
-          agentRuns: state.agentRuns.map(r =>
+        set((state) => ({
+          agentRuns: state.agentRuns.map((r) =>
             r.id === runId ? { ...r, status: 'cancelled' } : r
           ),
           runningAgents: new Set(
@@ -147,7 +152,7 @@ export const useAgentStore = create<AgentState>()(
     deleteAgentRun: async (runId: number) => {
       try {
         // First ensure the run is cancelled if it's still running
-        const run = get().agentRuns.find(r => r.id === runId);
+        const run = get().agentRuns.find((r) => r.id === runId);
         if (run && (run.status === 'running' || run.status === 'pending')) {
           await api.killAgentSession(runId);
         }
@@ -156,8 +161,8 @@ export const useAgentStore = create<AgentState>()(
         // The run will remain in the database but won't be shown in the UI
         
         // Update local state
-        set(state => ({
-          agentRuns: state.agentRuns.filter(r => r.id !== runId),
+        set((state) => ({
+          agentRuns: state.agentRuns.filter((r) => r.id !== runId),
           runningAgents: new Set(
             [...state.runningAgents].filter(id => id !== runId.toString())
           ),
@@ -178,8 +183,8 @@ export const useAgentStore = create<AgentState>()(
     
     // Handle real-time agent run updates
     handleAgentRunUpdate: (run: AgentRunWithMetrics) => {
-      set(state => {
-        const existingIndex = state.agentRuns.findIndex(r => r.id === run.id);
+      set((state) => {
+        const existingIndex = state.agentRuns.findIndex((r) => r.id === run.id);
         const updatedRuns = [...state.agentRuns];
         
         if (existingIndex >= 0) {
@@ -189,8 +194,8 @@ export const useAgentStore = create<AgentState>()(
         }
         
         const runningIds = updatedRuns
-          .filter(r => r.status === 'running' || r.status === 'pending')
-          .map(r => r.id?.toString() || '')
+          .filter((r) => r.status === 'running' || r.status === 'pending')
+          .map((r) => r.id?.toString() || '')
           .filter(Boolean);
         
         return {
@@ -228,5 +233,8 @@ export const useAgentStore = create<AgentState>()(
         set({ pollingInterval: null });
       }
     }
-  }))
+  });
+
+export const useAgentStore = create<AgentState>()(
+  subscribeWithSelector(agentStore)
 );

src/stores/sessionStore.ts

@@ -1,5 +1,6 @@
 import { create } from 'zustand';
 import { subscribeWithSelector } from 'zustand/middleware';
+import type { StateCreator } from 'zustand';
 import { api } from '@/lib/api';
 import type { Session, Project } from '@/lib/api';
 
@@ -30,8 +31,12 @@ interface SessionState {
   handleOutputUpdate: (sessionId: string, output: string) => void;
 }
 
-export const useSessionStore = create<SessionState>()(
-  subscribeWithSelector((set, get) => ({
+const sessionStore: StateCreator<
+  SessionState,
+  [],
+  [['zustand/subscribeWithSelector', never]],
+  SessionState
+> = (set, get) => ({
     // Initial state
     projects: [],
     sessions: {},
@@ -62,7 +67,7 @@ export const useSessionStore = create<SessionState>()(
       set({ isLoadingSessions: true, error: null });
       try {
         const projectSessions = await api.getProjectSessions(projectId);
-        set(state => ({
+        set((state) => ({
           sessions: {
             ...state.sessions,
             [projectId]: projectSessions
@@ -85,7 +90,7 @@ export const useSessionStore = create<SessionState>()(
       if (sessionId) {
         // Find session across all projects
         for (const projectSessions of Object.values(sessions)) {
-          const found = projectSessions.find(s => s.id === sessionId);
+          const found = projectSessions.find((s) => s.id === sessionId);
           if (found) {
             currentSession = found;
             break;
@@ -101,7 +106,7 @@ export const useSessionStore = create<SessionState>()(
       set({ isLoadingOutputs: true, error: null });
       try {
         const output = await api.getClaudeSessionOutput(sessionId);
-        set(state => ({
+        set((state) => ({
           sessionOutputs: {
             ...state.sessionOutputs,
             [sessionId]: output
@@ -123,10 +128,10 @@ export const useSessionStore = create<SessionState>()(
         console.warn('deleteSession not implemented in API');
         
         // Update local state
-        set(state => ({
+        set((state) => ({
           sessions: {
             ...state.sessions,
-            [projectId]: state.sessions[projectId]?.filter(s => s.id !== sessionId) || []
+            [projectId]: state.sessions[projectId]?.filter((s) => s.id !== sessionId) || []
           },
           currentSessionId: state.currentSessionId === sessionId ? null : state.currentSessionId,
           currentSession: state.currentSession?.id === sessionId ? null : state.currentSession,
@@ -150,7 +155,7 @@ export const useSessionStore = create<SessionState>()(
       set(state => {
         const projectId = session.project_id;
         const projectSessions = state.sessions[projectId] || [];
-        const existingIndex = projectSessions.findIndex(s => s.id === session.id);
+        const existingIndex = projectSessions.findIndex((s) => s.id === session.id);
         
         let updatedSessions;
         if (existingIndex >= 0) {
@@ -172,12 +177,15 @@ export const useSessionStore = create<SessionState>()(
     
     // Handle output update
     handleOutputUpdate: (sessionId: string, output: string) => {
-      set(state => ({
+      set((state) => ({
         sessionOutputs: {
           ...state.sessionOutputs,
           [sessionId]: output
         }
       }));
     }
-  }))
+  });
+
+export const useSessionStore = create<SessionState>()(
+  subscribeWithSelector(sessionStore)
 );