Refactor: Simplify useAISession hook by extracting mode transition logic

Summary

The useAISession hook in assets/js/collaborative-editor/hooks/useAISession.ts is 287 lines and handles multiple concerns:

• Mode change detection (job_code vs workflow_template)
• Job change detection within job_code mode
• Channel subscription lifecycle
• Context initialization
• URL synchronization

The contextMismatch check (lines 190-197) is a band-aid compensating for ref timing issues rather than addressing the root cause.

Proposed Solution

Extract mode transition logic to a new useAIModeTransition hook:

// New hook handles mode/job change detection and cleanup
export const useAIModeTransition = ({
  aiMode,
  aiStore,
  onModeChange,
}: {
  aiMode: AIMode | null;
  aiStore: AIAssistantStoreInstance;
  onModeChange: () => void;
}) => {
  // Handles mode change detection, session/list clearing, connection state reset
  // Returns { mode, jobId }
};

This would allow useAISession to focus solely on channel subscription lifecycle (~150 lines).

Benefits

• Each hook has single responsibility
• Removes the contextMismatch band-aid by handling mode transitions explicitly
• Easier to test, debug, and modify
• Future developers understand the flow without reverse-engineering ref timing

Files to Modify

• Create: assets/js/collaborative-editor/hooks/useAIModeTransition.ts
• Modify: assets/js/collaborative-editor/hooks/useAISession.ts
• Modify: assets/js/collaborative-editor/components/AIAssistantPanelWrapper.tsx

Related

This was identified during the review of PR #4249 (collaborative AI chat sessions).

Start by reading assets/js/collaborative-editor/hooks/useAISession.ts, especially the mode and job change handling around the contextMismatch check, then inspect AIAssistantPanelWrapper.tsx and the related PR #4249. Done means a new useAIModeTransition.ts handles mode/job transitions and cleanup, useAISession focuses on channel subscriptions, and the three listed files are updated consistently.