feat: update dependencies and refactor dropdown components for improved functionality

ccw/frontend/package-lock.json

@@ -8,6 +8,7 @@
       "name": "ccw-frontend",
       "version": "0.1.0",
       "dependencies": {
+        "@hello-pangea/dnd": "^18.0.1",
         "@radix-ui/react-dialog": "^1.1.0",
         "@radix-ui/react-dropdown-menu": "^2.1.0",
         "@radix-ui/react-select": "^2.1.0",
@@ -285,6 +286,15 @@
         "@babel/core": "^7.0.0-0"
       }
     },
+    "node_modules/@babel/runtime": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.28.6.tgz",
+      "integrity": "sha512-05WQkdpL9COIMz4LjTxGpPNCdlpyimKppYNoJ5Di5EUObifl8t4tuLuUBBZEpoLYOmfvIWrsp9fCl0HoPRVTdA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
     "node_modules/@babel/template": {
       "version": "7.28.6",
       "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.28.6.tgz",
@@ -813,6 +823,23 @@
       "integrity": "sha512-aGTxbpbg8/b5JfU1HXSrbH3wXZuLPJcNEcZQFMxLs3oSzgtVu6nFPkbbGGUvBcUjKV2YyB9Wxxabo+HEH9tcRQ==",
       "license": "MIT"
     },
+    "node_modules/@hello-pangea/dnd": {
+      "version": "18.0.1",
+      "resolved": "https://registry.npmjs.org/@hello-pangea/dnd/-/dnd-18.0.1.tgz",
+      "integrity": "sha512-xojVWG8s/TGrKT1fC8K2tIWeejJYTAeJuj36zM//yEm/ZrnZUSFGS15BpO+jGZT1ybWvyXmeDJwPYb4dhWlbZQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@babel/runtime": "^7.26.7",
+        "css-box-model": "^1.2.1",
+        "raf-schd": "^4.0.3",
+        "react-redux": "^9.2.0",
+        "redux": "^5.0.1"
+      },
+      "peerDependencies": {
+        "react": "^18.0.0 || ^19.0.0",
+        "react-dom": "^18.0.0 || ^19.0.0"
+      }
+    },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.3.13",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
@@ -2176,6 +2203,12 @@
         "@types/react": "^18.0.0"
       }
     },
+    "node_modules/@types/use-sync-external-store": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.6.tgz",
+      "integrity": "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg==",
+      "license": "MIT"
+    },
     "node_modules/@vitejs/plugin-react": {
       "version": "4.7.0",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.7.0.tgz",
@@ -2517,6 +2550,15 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/css-box-model": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/css-box-model/-/css-box-model-1.2.1.tgz",
+      "integrity": "sha512-a7Vr4Q/kd/aw96bnJG332W9V9LkJO69JRcaCYDUqjp6/z0w6VcZjgAcTbgFxEPfBgdnAwlh3iwu+hLopa+flJw==",
+      "license": "MIT",
+      "dependencies": {
+        "tiny-invariant": "^1.0.6"
+      }
+    },
     "node_modules/cssesc": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz",
@@ -3361,6 +3403,12 @@
       ],
       "license": "MIT"
     },
+    "node_modules/raf-schd": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/raf-schd/-/raf-schd-4.0.3.tgz",
+      "integrity": "sha512-tQkJl2GRWh83ui2DiPTJz9wEiMN20syf+5oKfB03yYP7ioZcJwsIK8FjrtLwH1m7C7e+Tt2yYBlrOpdT+dyeIQ==",
+      "license": "MIT"
+    },
     "node_modules/react": {
       "version": "18.3.1",
       "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz",
@@ -3386,6 +3434,29 @@
         "react": "^18.3.1"
       }
     },
+    "node_modules/react-redux": {
+      "version": "9.2.0",
+      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz",
+      "integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/use-sync-external-store": "^0.0.6",
+        "use-sync-external-store": "^1.4.0"
+      },
+      "peerDependencies": {
+        "@types/react": "^18.2.25 || ^19",
+        "react": "^18.0 || ^19",
+        "redux": "^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "redux": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/react-refresh": {
       "version": "0.17.0",
       "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz",
@@ -3520,6 +3591,12 @@
         "node": ">=8.10.0"
       }
     },
+    "node_modules/redux": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
+      "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
+      "license": "MIT"
+    },
     "node_modules/resolve": {
       "version": "1.22.11",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.11.tgz",
@@ -3767,6 +3844,12 @@
         "node": ">=0.8"
       }
     },
+    "node_modules/tiny-invariant": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
+      "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==",
+      "license": "MIT"
+    },
     "node_modules/tinyglobby": {
       "version": "0.2.15",
       "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.15.tgz",

ccw/frontend/package.json

@@ -10,32 +10,33 @@
     "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0"
   },
   "dependencies": {
+    "@hello-pangea/dnd": "^18.0.1",
+    "@radix-ui/react-dialog": "^1.1.0",
+    "@radix-ui/react-dropdown-menu": "^2.1.0",
+    "@radix-ui/react-select": "^2.1.0",
+    "@radix-ui/react-tabs": "^1.1.0",
+    "@radix-ui/react-toast": "^1.2.0",
+    "@radix-ui/react-tooltip": "^1.1.0",
+    "@tanstack/react-query": "^5.60.0",
+    "@xyflow/react": "^12.3.0",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.0",
+    "lucide-react": "^0.460.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.28.0",
-    "zustand": "^5.0.0",
-    "@tanstack/react-query": "^5.60.0",
-    "@xyflow/react": "^12.3.0",
-    "@radix-ui/react-dialog": "^1.1.0",
-    "@radix-ui/react-dropdown-menu": "^2.1.0",
-    "@radix-ui/react-tabs": "^1.1.0",
-    "@radix-ui/react-tooltip": "^1.1.0",
-    "@radix-ui/react-select": "^2.1.0",
-    "@radix-ui/react-toast": "^1.2.0",
-    "clsx": "^2.1.0",
     "tailwind-merge": "^2.5.0",
-    "class-variance-authority": "^0.7.0",
+    "zod": "^3.23.8",
-    "lucide-react": "^0.460.0",
+    "zustand": "^5.0.0"
-    "zod": "^3.23.8"
   },
   "devDependencies": {
     "@types/react": "^18.3.0",
-    "tailwindcss-animate": "^1.0.7",
     "@types/react-dom": "^18.3.0",
     "@vitejs/plugin-react": "^4.3.0",
     "autoprefixer": "^10.4.20",
     "postcss": "^8.4.40",
     "tailwindcss": "^3.4.0",
+    "tailwindcss-animate": "^1.0.7",
     "typescript": "^5.6.0",
     "vite": "^6.0.0"
   }

ccw/frontend/src/components/shared/IssueCard.tsx

@@ -20,7 +20,7 @@ import { cn } from '@/lib/utils';
 import { Card } from '@/components/ui/Card';
 import { Badge } from '@/components/ui/Badge';
 import { Button } from '@/components/ui/Button';
-import { Dropdown, DropdownTrigger, DropdownContent, DropdownItem } from '@/components/ui/Dropdown';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '@/components/ui/Dropdown';
 import type { Issue } from '@/lib/api';
 
 // ========== Types ==========
@@ -162,8 +162,8 @@ export function IssueCard({
           <p className="text-xs text-muted-foreground mt-1">#{issue.id}</p>
         </div>
         {showActions && (
-          <Dropdown open={isMenuOpen} onOpenChange={setIsMenuOpen}>
+          <DropdownMenu open={isMenuOpen} onOpenChange={setIsMenuOpen}>
-            <DropdownTrigger asChild>
+            <DropdownMenuTrigger asChild>
               <Button
                 variant="ghost"
                 size="sm"
@@ -172,26 +172,26 @@ export function IssueCard({
               >
                 <MoreVertical className="w-4 h-4" />
               </Button>
-            </DropdownTrigger>
+            </DropdownMenuTrigger>
-            <DropdownContent align="end">
+            <DropdownMenuContent align="end">
-              <DropdownItem onClick={handleEdit}>
+              <DropdownMenuItem onClick={handleEdit}>
                 <Edit className="w-4 h-4 mr-2" />
                 Edit
-              </DropdownItem>
+              </DropdownMenuItem>
-              <DropdownItem onClick={() => onStatusChange?.(issue, 'in_progress')}>
+              <DropdownMenuItem onClick={() => onStatusChange?.(issue, 'in_progress')}>
                 <Clock className="w-4 h-4 mr-2" />
                 Start Progress
-              </DropdownItem>
+              </DropdownMenuItem>
-              <DropdownItem onClick={() => onStatusChange?.(issue, 'resolved')}>
+              <DropdownMenuItem onClick={() => onStatusChange?.(issue, 'resolved')}>
                 <CheckCircle className="w-4 h-4 mr-2" />
                 Mark Resolved
-              </DropdownItem>
+              </DropdownMenuItem>
-              <DropdownItem onClick={handleDelete} className="text-destructive">
+              <DropdownMenuItem onClick={handleDelete} className="text-destructive">
                 <Trash2 className="w-4 h-4 mr-2" />
                 Delete
-              </DropdownItem>
+              </DropdownMenuItem>
-            </DropdownContent>
+            </DropdownMenuContent>
-          </Dropdown>
+          </DropdownMenu>
         )}
       </div>
 

ccw/frontend/src/components/shared/KanbanBoard.tsx

@@ -3,7 +3,7 @@
 // ========================================
 // Drag-and-drop kanban board for loops and tasks
 
-import { useState, useCallback } from 'react';
+import { useCallback } from 'react';
 import {
   DragDropContext,
   Droppable,

ccw/frontend/src/components/shared/SessionCard.tsx

@@ -22,8 +22,6 @@ import {
   Eye,
   Archive,
   Trash2,
-  Play,
-  Pause,
 } from 'lucide-react';
 import type { SessionMetadata } from '@/types/store';
 

ccw/frontend/src/components/shared/SkillCard.tsx

@@ -18,7 +18,7 @@ import { cn } from '@/lib/utils';
 import { Card } from '@/components/ui/Card';
 import { Badge } from '@/components/ui/Badge';
 import { Button } from '@/components/ui/Button';
-import { Dropdown, DropdownTrigger, DropdownContent, DropdownItem } from '@/components/ui/Dropdown';
+import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '@/components/ui/Dropdown';
 import type { Skill } from '@/lib/api';
 
 // ========== Types ==========
@@ -148,8 +148,8 @@ export function SkillCard({
           </div>
         </div>
         {showActions && (
-          <Dropdown open={isMenuOpen} onOpenChange={setIsMenuOpen}>
+          <DropdownMenu open={isMenuOpen} onOpenChange={setIsMenuOpen}>
-            <DropdownTrigger asChild>
+            <DropdownMenuTrigger asChild>
               <Button
                 variant="ghost"
                 size="sm"
@@ -158,17 +158,17 @@ export function SkillCard({
               >
                 <MoreVertical className="w-4 h-4" />
               </Button>
-            </DropdownTrigger>
+            </DropdownMenuTrigger>
-            <DropdownContent align="end">
+            <DropdownMenuContent align="end">
-              <DropdownItem onClick={() => onClick?.(skill)}>
+              <DropdownMenuItem onClick={() => onClick?.(skill)}>
                 <Info className="w-4 h-4 mr-2" />
                 View Details
-              </DropdownItem>
+              </DropdownMenuItem>
-              <DropdownItem onClick={handleConfigure}>
+              <DropdownMenuItem onClick={handleConfigure}>
                 <Settings className="w-4 h-4 mr-2" />
                 Configure
-              </DropdownItem>
+              </DropdownMenuItem>
-              <DropdownItem onClick={handleToggle}>
+              <DropdownMenuItem onClick={handleToggle}>
                 {skill.enabled ? (
                   <>
                     <PowerOff className="w-4 h-4 mr-2" />
@@ -180,9 +180,9 @@ export function SkillCard({
                     Enable
                   </>
                 )}
-              </DropdownItem>
+              </DropdownMenuItem>
-            </DropdownContent>
+            </DropdownMenuContent>
-          </Dropdown>
+          </DropdownMenu>
         )}
       </div>
 

ccw/frontend/src/hooks/useIssues.ts

@@ -13,7 +13,6 @@ import {
   deleteIssue,
   type Issue,
   type IssuesResponse,
-  type IssueQueue,
 } from '../lib/api';
 
 // Query key factory

ccw/frontend/src/pages/CommandsManagerPage.tsx

@@ -8,10 +8,8 @@ import {
   Terminal,
   Search,
   Plus,
-  Filter,
   RefreshCw,
   Copy,
-  Play,
   ChevronDown,
   ChevronUp,
   Code,
@@ -161,7 +159,6 @@ export function CommandsManagerPage() {
   const {
     commands,
     categories,
-    commandsByCategory,
     totalCount,
     isLoading,
     isFetching,

ccw/frontend/src/pages/IssueManagerPage.tsx

@@ -7,12 +7,10 @@ import { useState, useMemo } from 'react';
 import {
   AlertCircle,
   Plus,
-  Filter,
   Search,
   RefreshCw,
   Loader2,
   Github,
-  ListFilter,
   CheckCircle,
   Clock,
   AlertTriangle,
@@ -21,7 +19,6 @@ import { Card } from '@/components/ui/Card';
 import { Button } from '@/components/ui/Button';
 import { Input } from '@/components/ui/Input';
 import { Badge } from '@/components/ui/Badge';
-import { Tabs, TabsList, TabsTrigger, TabsContent } from '@/components/ui/Tabs';
 import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/Dialog';
 import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '@/components/ui/Select';
 import { IssueCard } from '@/components/shared/IssueCard';
@@ -31,7 +28,6 @@ import { cn } from '@/lib/utils';
 
 // ========== Types ==========
 
-type ViewMode = 'issues' | 'queue';
 type StatusFilter = 'all' | Issue['status'];
 type PriorityFilter = 'all' | Issue['priority'];
 
@@ -183,17 +179,14 @@ function IssueList({
 // ========== Main Page Component ==========
 
 export function IssueManagerPage() {
-  const [viewMode, setViewMode] = useState<ViewMode>('issues');
   const [searchQuery, setSearchQuery] = useState('');
   const [statusFilter, setStatusFilter] = useState<StatusFilter>('all');
   const [priorityFilter, setPriorityFilter] = useState<PriorityFilter>('all');
   const [isNewIssueOpen, setIsNewIssueOpen] = useState(false);
-  const [selectedIssue, setSelectedIssue] = useState<Issue | null>(null);
 
   const {
     issues,
     issuesByStatus,
-    issuesByPriority,
     openCount,
     criticalCount,
     isLoading,
@@ -207,7 +200,7 @@ export function IssueManagerPage() {
     },
   });
 
-  const { createIssue, updateIssue, deleteIssue, isCreating, isUpdating } = useIssueMutations();
+  const { createIssue, updateIssue, deleteIssue, isCreating } = useIssueMutations();
 
   // Filter counts
   const statusCounts = useMemo(() => ({
@@ -224,8 +217,7 @@ export function IssueManagerPage() {
     setIsNewIssueOpen(false);
   };
 
-  const handleEditIssue = (issue: Issue) => {
+  const handleEditIssue = (_issue: Issue) => {
-    setSelectedIssue(issue);
     // TODO: Open edit dialog
   };
 
@@ -381,7 +373,7 @@ export function IssueManagerPage() {
       <IssueList
         issues={issues}
         isLoading={isLoading}
-        onIssueClick={setSelectedIssue}
+        onIssueClick={() => {}}
         onIssueEdit={handleEditIssue}
         onIssueDelete={handleDeleteIssue}
         onStatusChange={handleStatusChange}

ccw/frontend/src/pages/LoopMonitorPage.tsx

@@ -11,11 +11,9 @@ import {
   StopCircle,
   Plus,
   Search,
-  Filter,
   Clock,
   CheckCircle,
   XCircle,
-  AlertCircle,
   Loader2,
 } from 'lucide-react';
 import type { DropResult, DraggableProvided } from '@hello-pangea/dnd';
@@ -23,7 +21,7 @@ import { Card } from '@/components/ui/Card';
 import { Button } from '@/components/ui/Button';
 import { Badge } from '@/components/ui/Badge';
 import { Input } from '@/components/ui/Input';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/Dialog';
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/Dialog';
 import { KanbanBoard, useLoopKanbanColumns, type LoopKanbanItem } from '@/components/shared/KanbanBoard';
 import { useLoops, useLoopMutations } from '@/hooks';
 import type { Loop } from '@/lib/api';
@@ -226,7 +224,6 @@ function NewLoopDialog({ open, onOpenChange, onSubmit, isCreating }: NewLoopDial
 export function LoopMonitorPage() {
   const [searchQuery, setSearchQuery] = useState('');
   const [isNewLoopOpen, setIsNewLoopOpen] = useState(false);
-  const [selectedLoop, setSelectedLoop] = useState<Loop | null>(null);
 
   const {
     loops,
@@ -242,7 +239,7 @@ export function LoopMonitorPage() {
     refetchInterval: 5000, // Refresh every 5 seconds for real-time updates
   });
 
-  const { createLoop, updateStatus, isCreating, isUpdating } = useLoopMutations();
+  const { createLoop, updateStatus, isCreating } = useLoopMutations();
 
   // Kanban columns
   const columns = useLoopKanbanColumns(loopsByStatus as unknown as Record<string, LoopKanbanItem[]>);
@@ -312,7 +309,7 @@ export function LoopMonitorPage() {
         onPause={handlePause}
         onResume={handleResume}
         onStop={handleStop}
-        onClick={setSelectedLoop}
+        onClick={() => {}}
       />
     ),
     []

ccw/frontend/src/pages/MemoryPage.tsx

@@ -13,7 +13,6 @@ import {
   RefreshCw,
   Trash2,
   Edit,
-  Eye,
   Tag,
   Loader2,
   Copy,
@@ -264,7 +263,7 @@ export function MemoryPage() {
     },
   });
 
-  const { createMemory, updateMemory, deleteMemory, isCreating, isUpdating, isDeleting } =
+  const { createMemory, updateMemory, deleteMemory, isCreating, isUpdating } =
     useMemoryMutations();
 
   const toggleExpand = (memoryId: string) => {

ccw/frontend/src/pages/SettingsPage.tsx

@@ -3,21 +3,17 @@
 // ========================================
 // Application settings and configuration with CLI tools management
 
-import { useState, useEffect } from 'react';
+import { useState } from 'react';
 import {
   Settings,
   Moon,
   Sun,
-  Globe,
   Bell,
-  Shield,
   Cpu,
   RefreshCw,
-  Save,
   RotateCcw,
   Check,
   X,
-  Loader2,
   ChevronDown,
   ChevronUp,
 } from 'lucide-react';
@@ -25,7 +21,7 @@ import { Card } from '@/components/ui/Card';
 import { Button } from '@/components/ui/Button';
 import { Input } from '@/components/ui/Input';
 import { Badge } from '@/components/ui/Badge';
-import { useTheme, useConfig } from '@/hooks';
+import { useTheme } from '@/hooks';
 import { useConfigStore, selectCliTools, selectDefaultCliTool, selectUserPreferences } from '@/stores/configStore';
 import type { CliToolConfig, UserPreferences } from '@/types/store';
 import { cn } from '@/lib/utils';
@@ -170,7 +166,6 @@ export function SettingsPage() {
   const { updateCliTool, setDefaultCliTool, setUserPreferences, resetUserPreferences } = useConfigStore();
 
   const [expandedTools, setExpandedTools] = useState<Set<string>>(new Set());
-  const [isSaving, setIsSaving] = useState(false);
 
   const toggleToolExpand = (toolId: string) => {
     setExpandedTools((prev) => {

ccw/frontend/src/pages/SkillsManagerPage.tsx

@@ -8,17 +8,14 @@ import {
   Sparkles,
   Search,
   Plus,
-  Filter,
   RefreshCw,
   Power,
   PowerOff,
   Tag,
-  Loader2,
 } from 'lucide-react';
 import { Card } from '@/components/ui/Card';
 import { Button } from '@/components/ui/Button';
 import { Input } from '@/components/ui/Input';
-import { Badge } from '@/components/ui/Badge';
 import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from '@/components/ui/Select';
 import { SkillCard } from '@/components/shared/SkillCard';
 import { useSkills, useSkillMutations } from '@/hooks';
@@ -89,13 +86,10 @@ export function SkillsManagerPage() {
   const [sourceFilter, setSourceFilter] = useState<string>('all');
   const [enabledFilter, setEnabledFilter] = useState<'all' | 'enabled' | 'disabled'>('all');
   const [viewMode, setViewMode] = useState<'grid' | 'compact'>('grid');
-  const [selectedSkill, setSelectedSkill] = useState<Skill | null>(null);
 
   const {
     skills,
-    enabledSkills,
     categories,
-    skillsByCategory,
     totalCount,
     enabledCount,
     isLoading,
@@ -268,7 +262,7 @@ export function SkillsManagerPage() {
         skills={filteredSkills}
         isLoading={isLoading}
         onToggle={handleToggle}
-        onClick={setSelectedSkill}
+        onClick={() => {}}
         isToggling={isToggling}
         compact={viewMode === 'compact'}
       />

ccw/frontend/src/pages/orchestrator/ExecutionMonitor.tsx

@@ -106,7 +106,6 @@ export function ExecutionMonitor({ className }: ExecutionMonitorProps) {
   const isMonitorExpanded = useExecutionStore((state) => state.isMonitorExpanded);
   const autoScrollLogs = useExecutionStore((state) => state.autoScrollLogs);
   const setMonitorExpanded = useExecutionStore((state) => state.setMonitorExpanded);
-  const setAutoScrollLogs = useExecutionStore((state) => state.setAutoScrollLogs);
   const startExecution = useExecutionStore((state) => state.startExecution);
 
   // Local state for elapsed time (calculated from startedAt)

ccw/frontend/src/pages/orchestrator/FlowToolbar.tsx

@@ -9,7 +9,6 @@ import {
   Save,
   FolderOpen,
   Download,
-  Play,
   Trash2,
   Copy,
   Workflow,

ccw/frontend/src/pages/orchestrator/OrchestratorPage.tsx

@@ -11,21 +11,11 @@ import { PropertyPanel } from './PropertyPanel';
 import { FlowToolbar } from './FlowToolbar';
 import { ExecutionMonitor } from './ExecutionMonitor';
 import { TemplateLibrary } from './TemplateLibrary';
-import { useWebSocket } from '@/hooks/useWebSocket';
 
 export function OrchestratorPage() {
   const fetchFlows = useFlowStore((state) => state.fetchFlows);
   const [isTemplateLibraryOpen, setIsTemplateLibraryOpen] = useState(false);
 
-  // Initialize WebSocket connection for real-time updates
-  const { isConnected, reconnect } = useWebSocket({
-    enabled: true,
-    onMessage: (message) => {
-      // Additional message handling can be added here if needed
-      console.log('[Orchestrator] WebSocket message:', message.type);
-    },
-  });
-
   // Load flows on mount
   useEffect(() => {
     fetchFlows();

ccw/frontend/src/pages/orchestrator/TemplateLibrary.tsx

@@ -17,7 +17,6 @@ import {
   GitBranch,
   Loader2,
   Trash2,
-  ExternalLink,
 } from 'lucide-react';
 import { cn } from '@/lib/utils';
 import { Button } from '@/components/ui/Button';

ccw/frontend/src/stores/executionStore.ts

@@ -35,7 +35,7 @@ const initialState = {
 
 export const useExecutionStore = create<ExecutionStore>()(
   devtools(
-    (set, get) => ({
+    (set) => ({
       ...initialState,
 
       // ========== Execution Lifecycle ==========