Refactor: eliminate pathToMetadata code smell

## Changes

1. Rename type: WorkspaceMetadataWithPaths → FrontendWorkspaceMetadata
2. sortedWorkspacesByProject returns metadata arrays directly
3. Removed duplicate pathToMetadata maps from App.tsx and ProjectSidebar
4. WorkspaceListItem accepts metadata object (6 props → 1)
5. Updated keyboard navigation to work with metadata

## Benefits

- Net: -23 lines (removed duplicate logic)
- Clearer data flow: pass data, not lookup maps
- Simpler component API: metadata object vs 6 props

16 files changed, 124 insertions(+), 147 deletions(-)

Author: ammar-agent

src/App.tsx

@@ -6,7 +6,7 @@ import { GlobalFonts } from "./styles/fonts";
 import { GlobalScrollbars } from "./styles/scrollbars";
 import type { ProjectConfig } from "./config";
 import type { WorkspaceSelection } from "./components/ProjectSidebar";
-import type { WorkspaceMetadataWithPaths } from "./types/workspace";
+import type { FrontendWorkspaceMetadata } from "./types/workspace";
 import { LeftSidebar } from "./components/LeftSidebar";
 import NewWorkspaceModal from "./components/NewWorkspaceModal";
 import { AIView } from "./components/AIView";
@@ -173,17 +173,6 @@ function AppInner() {
       onSelectedWorkspaceUpdate: setSelectedWorkspace,
     });
 
-  // Build path-to-metadata lookup map (handles both stable and legacy paths)
-  const pathToMetadata = useMemo(() => {
-    const map = new Map<string, WorkspaceMetadataWithPaths>();
-    for (const metadata of workspaceMetadata.values()) {
-      // Map both stable path (with ID) and named path (with name/legacy)
-      map.set(metadata.stableWorkspacePath, metadata);
-      map.set(metadata.namedWorkspacePath, metadata);
-    }
-    return map;
-  }, [workspaceMetadata]);
-
   // NEW: Sync workspace metadata with the stores
   const workspaceStore = useWorkspaceStoreRaw();
   const gitStatusStore = useGitStatusStoreRaw();
@@ -342,25 +331,32 @@ function AppInner() {
   const workspaceRecency = useWorkspaceRecency();
 
   // Sort workspaces by recency (most recent first)
+  // Returns Map<projectPath, FrontendWorkspaceMetadata[]> for direct component use
   // Use stable reference to prevent sidebar re-renders when sort order hasn't changed
   const sortedWorkspacesByProject = useStableReference(
     () => {
-      const result = new Map<string, ProjectConfig["workspaces"]>();
+      // Build path-to-metadata lookup map internally
+      const pathToMetadata = new Map<string, FrontendWorkspaceMetadata>();
+      for (const metadata of workspaceMetadata.values()) {
+        pathToMetadata.set(metadata.stableWorkspacePath, metadata);
+        pathToMetadata.set(metadata.namedWorkspacePath, metadata);
+      }
+
+      const result = new Map<string, FrontendWorkspaceMetadata[]>();
       for (const [projectPath, config] of projects) {
-        result.set(
-          projectPath,
-          config.workspaces.slice().sort((a, b) => {
-            // Look up metadata by workspace path (handles both stable and legacy paths)
-            const aMeta = pathToMetadata.get(a.path);
-            const bMeta = pathToMetadata.get(b.path);
-            if (!aMeta || !bMeta) return 0;
-
-            // Get timestamp of most recent user message (0 if never used)
-            const aTimestamp = workspaceRecency[aMeta.id] ?? 0;
-            const bTimestamp = workspaceRecency[bMeta.id] ?? 0;
-            return bTimestamp - aTimestamp;
-          })
-        );
+        // Transform Workspace[] to FrontendWorkspaceMetadata[] and filter nulls
+        const metadataList = config.workspaces
+          .map((ws) => pathToMetadata.get(ws.path))
+          .filter((meta): meta is FrontendWorkspaceMetadata => meta !== undefined);
+
+        // Sort by recency
+        metadataList.sort((a, b) => {
+          const aTimestamp = workspaceRecency[a.id] ?? 0;
+          const bTimestamp = workspaceRecency[b.id] ?? 0;
+          return bTimestamp - aTimestamp;
+        });
+
+        result.set(projectPath, metadataList);
       }
       return result;
     },
@@ -369,14 +365,14 @@ function AppInner() {
       if (
         !compareMaps(prev, next, (a, b) => {
           if (a.length !== b.length) return false;
-          return a.every((workspace, i) => workspace.path === b[i].path);
+          return a.every((metadata, i) => metadata.id === b[i].id);
         })
       ) {
         return false;
       }
       return true;
     },
-    [projects, workspaceMetadata, workspaceRecency, pathToMetadata]
+    [projects, workspaceMetadata, workspaceRecency]
   );
 
   const handleNavigateWorkspace = useCallback(
@@ -389,7 +385,7 @@ function AppInner() {
 
       // Find current workspace index in sorted list
       const currentIndex = sortedWorkspaces.findIndex(
-        (ws) => ws.path === selectedWorkspace.workspacePath
+        (metadata) => metadata.id === selectedWorkspace.workspaceId
       );
       if (currentIndex === -1) return;
 
@@ -401,21 +397,17 @@ function AppInner() {
         targetIndex = currentIndex === 0 ? sortedWorkspaces.length - 1 : currentIndex - 1;
       }
 
-      const targetWorkspace = sortedWorkspaces[targetIndex];
-      if (!targetWorkspace) return;
-
-      // Look up metadata by workspace path (handles both stable and legacy paths)
-      const metadata = pathToMetadata.get(targetWorkspace.path);
-      if (!metadata) return;
+      const targetMetadata = sortedWorkspaces[targetIndex];
+      if (!targetMetadata) return;
 
       setSelectedWorkspace({
         projectPath: selectedWorkspace.projectPath,
         projectName: selectedWorkspace.projectName,
-        workspacePath: targetWorkspace.path,
-        workspaceId: metadata.id,
+        workspacePath: targetMetadata.stableWorkspacePath,
+        workspaceId: targetMetadata.id,
       });
     },
-    [selectedWorkspace, sortedWorkspacesByProject, pathToMetadata, setSelectedWorkspace]
+    [selectedWorkspace, sortedWorkspacesByProject, setSelectedWorkspace]
   );
 
   // Register command sources with registry

src/components/LeftSidebar.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import styled from "@emotion/styled";
 import type { ProjectConfig } from "@/config";
-import type { WorkspaceMetadataWithPaths } from "@/types/workspace";
+import type { FrontendWorkspaceMetadata } from "@/types/workspace";
 import type { WorkspaceSelection } from "./ProjectSidebar";
 import type { Secret } from "@/types/secrets";
 import ProjectSidebar from "./ProjectSidebar";
@@ -21,7 +21,7 @@ const LeftSidebarContainer = styled.div<{ collapsed?: boolean }>`
 
 interface LeftSidebarProps {
   projects: Map<string, ProjectConfig>;
-  workspaceMetadata: Map<string, WorkspaceMetadataWithPaths>;
+  workspaceMetadata: Map<string, FrontendWorkspaceMetadata>;
   selectedWorkspace: WorkspaceSelection | null;
   onSelectWorkspace: (selection: WorkspaceSelection) => void;
   onAddProject: () => void;
@@ -41,7 +41,7 @@ interface LeftSidebarProps {
   onToggleCollapsed: () => void;
   onGetSecrets: (projectPath: string) => Promise<Secret[]>;
   onUpdateSecrets: (projectPath: string, secrets: Secret[]) => Promise<void>;
-  sortedWorkspacesByProject: Map<string, ProjectConfig["workspaces"]>;
+  sortedWorkspacesByProject: Map<string, FrontendWorkspaceMetadata[]>;
 }
 
 export function LeftSidebar(props: LeftSidebarProps) {

src/components/ProjectSidebar.tsx

@@ -3,7 +3,7 @@ import { createPortal } from "react-dom";
 import styled from "@emotion/styled";
 import { css } from "@emotion/react";
 import type { ProjectConfig, Workspace } from "@/config";
-import type { WorkspaceMetadataWithPaths } from "@/types/workspace";
+import type { FrontendWorkspaceMetadata } from "@/types/workspace";
 import { usePersistedState } from "@/hooks/usePersistedState";
 import { DndProvider } from "react-dnd";
 import { HTML5Backend, getEmptyImage } from "react-dnd-html5-backend";
@@ -471,7 +471,7 @@ const ProjectDragLayer: React.FC = () => {
 
 interface ProjectSidebarProps {
   projects: Map<string, ProjectConfig>;
-  workspaceMetadata: Map<string, WorkspaceMetadataWithPaths>;
+  workspaceMetadata: Map<string, FrontendWorkspaceMetadata>;
   selectedWorkspace: WorkspaceSelection | null;
   onSelectWorkspace: (selection: WorkspaceSelection) => void;
   onAddProject: () => void;
@@ -491,7 +491,7 @@ interface ProjectSidebarProps {
   onToggleCollapsed: () => void;
   onGetSecrets: (projectPath: string) => Promise<Secret[]>;
   onUpdateSecrets: (projectPath: string, secrets: Secret[]) => Promise<void>;
-  sortedWorkspacesByProject: Map<string, Workspace[]>;
+  sortedWorkspacesByProject: Map<string, FrontendWorkspaceMetadata[]>;
 }
 
 const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
@@ -512,17 +512,6 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
   onUpdateSecrets,
   sortedWorkspacesByProject,
 }) => {
-  // Build path-to-metadata lookup map (handles both stable and legacy paths)
-  const pathToMetadata = React.useMemo(() => {
-    const map = new Map<string, WorkspaceMetadataWithPaths>();
-    for (const metadata of workspaceMetadata.values()) {
-      // Map both stable path (with ID) and named path (with name/legacy)
-      map.set(metadata.stableWorkspacePath, metadata);
-      map.set(metadata.namedWorkspacePath, metadata);
-    }
-    return map;
-  }, [workspaceMetadata]);
-
   // Workspace-specific subscriptions moved to WorkspaceListItem component
 
   // Store as array in localStorage, convert to Set for usage
@@ -831,33 +820,23 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
                                   ` (${formatKeybind(KEYBINDS.NEW_WORKSPACE)})`}
                               </AddWorkspaceBtn>
                             </WorkspaceHeader>
-                            {(sortedWorkspacesByProject.get(projectPath) ?? config.workspaces).map(
-                              (workspace) => {
-                                // Look up metadata by workspace path (handles both stable ID paths and legacy name paths)
-                                const metadata = pathToMetadata.get(workspace.path);
-                                if (!metadata) return null;
-
-                                const workspaceId = metadata.id;
-                                const isSelected =
-                                  selectedWorkspace?.workspacePath === workspace.path;
-
-                                return (
-                                  <WorkspaceListItem
-                                    key={workspace.path}
-                                    workspaceId={workspaceId}
-                                    workspaceName={metadata.name}
-                                    workspacePath={workspace.path}
-                                    projectPath={projectPath}
-                                    projectName={projectName}
-                                    isSelected={isSelected}
-                                    lastReadTimestamp={lastReadTimestamps[metadata.id] ?? 0}
-                                    onSelectWorkspace={onSelectWorkspace}
-                                    onRemoveWorkspace={handleRemoveWorkspace}
-                                    onToggleUnread={_onToggleUnread}
-                                  />
-                                );
-                              }
-                            )}
+                            {sortedWorkspacesByProject.get(projectPath)?.map((metadata) => {
+                              const isSelected = selectedWorkspace?.workspaceId === metadata.id;
+
+                              return (
+                                <WorkspaceListItem
+                                  key={metadata.id}
+                                  metadata={metadata}
+                                  projectPath={projectPath}
+                                  projectName={projectName}
+                                  isSelected={isSelected}
+                                  lastReadTimestamp={lastReadTimestamps[metadata.id] ?? 0}
+                                  onSelectWorkspace={onSelectWorkspace}
+                                  onRemoveWorkspace={handleRemoveWorkspace}
+                                  onToggleUnread={_onToggleUnread}
+                                />
+                              );
+                            })}
                           </WorkspacesContainer>
                         )}
                       </ProjectGroup>

src/components/WorkspaceListItem.tsx

@@ -1,6 +1,7 @@
 import React, { useState, useCallback, useMemo } from "react";
 import styled from "@emotion/styled";
 import { css } from "@emotion/react";
+import type { FrontendWorkspaceMetadata } from "@/types/workspace";
 import { useWorkspaceSidebarState } from "@/stores/WorkspaceStore";
 import { useGitStatus } from "@/stores/GitStatusStore";
 import { formatRelativeTime } from "@/utils/ui/dateTime";
@@ -126,10 +127,8 @@ export interface WorkspaceSelection {
   workspaceId: string;
 }
 export interface WorkspaceListItemProps {
-  // Minimal data - component accesses stores directly for the rest
-  workspaceId: string;
-  workspaceName: string; // User-facing workspace name (from metadata)
-  workspacePath: string;
+  // Workspace metadata passed directly
+  metadata: FrontendWorkspaceMetadata;
   projectPath: string;
   projectName: string;
   isSelected: boolean;
@@ -141,9 +140,7 @@ export interface WorkspaceListItemProps {
 }
 
 const WorkspaceListItemInner: React.FC<WorkspaceListItemProps> = ({
-  workspaceId,
-  workspaceName,
-  workspacePath,
+  metadata,
   projectPath,
   projectName,
   isSelected,
@@ -152,6 +149,8 @@ const WorkspaceListItemInner: React.FC<WorkspaceListItemProps> = ({
   onRemoveWorkspace,
   onToggleUnread,
 }) => {
+  // Destructure metadata for convenience
+  const { id: workspaceId, name: workspaceName, stableWorkspacePath: workspacePath } = metadata;
   // Subscribe to this specific workspace's sidebar state (streaming status, model, recency)
   const sidebarState = useWorkspaceSidebarState(workspaceId);
   const gitStatus = useGitStatus(workspaceId);

src/config.ts

@@ -277,7 +277,7 @@ export class Config {
    * config.getWorkspacePath(). This ensures single source of truth for path format.
    *
    * Backend: Uses getWorkspacePath(metadata.projectPath, metadata.id) for operations
-   * Frontend: Gets enriched metadata with paths via IPC (WorkspaceMetadataWithPaths)
+   * Frontend: Gets enriched metadata with paths via IPC (FrontendWorkspaceMetadata)
    *
    * WorkspaceMetadata.workspacePath is deprecated and will be removed. Use computed
    * paths from getWorkspacePath() or getWorkspacePaths() instead.

src/hooks/useWorkspaceManagement.ts

@@ -1,5 +1,5 @@
 import { useState, useEffect, useCallback } from "react";
-import type { WorkspaceMetadataWithPaths } from "@/types/workspace";
+import type { FrontendWorkspaceMetadata } from "@/types/workspace";
 import type { WorkspaceSelection } from "@/components/ProjectSidebar";
 import type { ProjectConfig } from "@/config";
 
@@ -18,7 +18,7 @@ export function useWorkspaceManagement({
   onSelectedWorkspaceUpdate,
 }: UseWorkspaceManagementProps) {
   const [workspaceMetadata, setWorkspaceMetadata] = useState<
-    Map<string, WorkspaceMetadataWithPaths>
+    Map<string, FrontendWorkspaceMetadata>
   >(new Map());
 
   const loadWorkspaceMetadata = useCallback(async () => {

src/preload.ts

@@ -20,7 +20,7 @@
 
 import { contextBridge, ipcRenderer } from "electron";
 import type { IPCApi, WorkspaceChatMessage } from "./types/ipc";
-import type { WorkspaceMetadataWithPaths } from "./types/workspace";
+import type { FrontendWorkspaceMetadata } from "./types/workspace";
 import { IPC_CHANNELS, getChatChannel } from "./constants/ipc-constants";
 
 // Build the API implementation using the shared interface
@@ -88,11 +88,11 @@ const api: IPCApi = {
       };
     },
     onMetadata: (
-      callback: (data: { workspaceId: string; metadata: WorkspaceMetadataWithPaths }) => void
+      callback: (data: { workspaceId: string; metadata: FrontendWorkspaceMetadata }) => void
     ) => {
       const handler = (
         _event: unknown,
-        data: { workspaceId: string; metadata: WorkspaceMetadataWithPaths }
+        data: { workspaceId: string; metadata: FrontendWorkspaceMetadata }
       ) => callback(data);
 
       // Subscribe to metadata events

src/services/ipcMain.ts

@@ -25,7 +25,7 @@ import { createBashTool } from "@/services/tools/bash";
 import type { BashToolResult } from "@/types/tools";
 import { secretsToRecord } from "@/types/secrets";
 import { DisposableTempDir } from "@/services/tempDir";
-import type { WorkspaceMetadata, WorkspaceMetadataWithPaths } from "@/types/workspace";
+import type { WorkspaceMetadata, FrontendWorkspaceMetadata } from "@/types/workspace";
 
 /**
  * IpcMain - Manages all IPC handlers and service coordination
@@ -126,7 +126,7 @@ export class IpcMain {
    * Enrich workspace metadata with computed paths for frontend use.
    * Backend computes these to avoid duplicating path logic on frontend.
    */
-  private enrichMetadataWithPaths(metadata: WorkspaceMetadata): WorkspaceMetadataWithPaths {
+  private enrichMetadataWithPaths(metadata: WorkspaceMetadata): FrontendWorkspaceMetadata {
     const paths = this.config.getWorkspacePaths(metadata);
     return {
       ...metadata,