refactor: sanitize featureId for worktree paths across multiple handlers

- Updated createDiffsHandler, createFileDiffHandler, createInfoHandler, createStatusHandler, and auto-mode service to sanitize featureId when constructing worktree paths.
- Ensured consistent handling of featureId to prevent issues with invalid characters in branch names.
- Added branchName support in UI components to enhance feature visibility and management.

This change improves the robustness of worktree operations and enhances user experience by ensuring valid paths are used throughout the application.

apps/ui/src/components/views/board-view.tsx

@@ -1415,6 +1415,7 @@ export function BoardView() {
         featureId={outputFeature?.id || ''}
         featureStatus={outputFeature?.status}
         onNumberKeyPress={handleOutputModalNumberKeyPress}
+        branchName={outputFeature?.branchName}
       />
 
       {/* Archive All Verified Dialog */}

apps/ui/src/components/views/board-view/dialogs/agent-output-modal.tsx

@@ -28,6 +28,8 @@ interface AgentOutputModalProps {
   onNumberKeyPress?: (key: string) => void;
   /** Project path - if not provided, falls back to window.__currentProject for backward compatibility */
   projectPath?: string;
+  /** Branch name for the feature worktree - used when viewing changes */
+  branchName?: string;
 }
 
 type ViewMode = 'summary' | 'parsed' | 'raw' | 'changes';
@@ -40,6 +42,7 @@ export function AgentOutputModal({
   featureStatus,
   onNumberKeyPress,
   projectPath: projectPathProp,
+  branchName,
 }: AgentOutputModalProps) {
   const isBacklogPlan = featureId.startsWith('backlog-plan:');
   const [output, setOutput] = useState<string>('');
@@ -433,7 +436,7 @@ export function AgentOutputModal({
             {projectPath ? (
               <GitDiffPanel
                 projectPath={projectPath}
-                featureId={featureId}
+                featureId={branchName || featureId}
                 compact={false}
                 useWorktrees={useWorktrees}
                 className="border-0 rounded-lg"

apps/ui/src/components/views/graph-view-page.tsx

@@ -418,6 +418,7 @@ export function GraphViewPage() {
         featureId={outputFeature?.id || ''}
         featureStatus={outputFeature?.status}
         onNumberKeyPress={handleOutputModalNumberKeyPress}
+        branchName={outputFeature?.branchName}
       />
 
       {/* Backlog Plan Dialog */}

apps/ui/src/components/views/running-agents-view.tsx

@@ -280,6 +280,7 @@ export function RunningAgentsView() {
           }
           featureId={selectedAgent.featureId}
           featureStatus="running"
+          branchName={selectedAgent.branchName}
         />
       )}
     </div>