feat: Add Claude Code terminal integration to dashboard

- Add embedded Claude Code terminal with xterm.js for full CLI experience
- Create WebSocket PTY backend for real-time terminal communication
- Add terminal status endpoint to check CLI availability
- Update dashboard to use Claude Code terminal instead of API chat
- Add optimization control panel with start/stop/validate actions
- Add study context provider for global state management
- Update frontend with new dependencies (xterm.js addons)
- Comprehensive README documentation for all new features

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

atomizer-dashboard/frontend/src/context/StudyContext.tsx

@@ -0,0 +1,93 @@
+import React, { createContext, useContext, useState, useEffect, ReactNode } from 'react';
+import { Study } from '../types';
+import { apiClient } from '../api/client';
+
+interface StudyContextType {
+  selectedStudy: Study | null;
+  setSelectedStudy: (study: Study | null) => void;
+  studies: Study[];
+  refreshStudies: () => Promise<void>;
+  isLoading: boolean;
+  clearStudy: () => void;
+}
+
+const StudyContext = createContext<StudyContextType | undefined>(undefined);
+
+export const StudyProvider: React.FC<{ children: ReactNode }> = ({ children }) => {
+  const [selectedStudy, setSelectedStudyState] = useState<Study | null>(null);
+  const [studies, setStudies] = useState<Study[]>([]);
+  const [isLoading, setIsLoading] = useState(true);
+
+  const refreshStudies = async () => {
+    try {
+      setIsLoading(true);
+      const response = await apiClient.getStudies();
+      setStudies(response.studies);
+
+      // If we have a selected study, refresh its data
+      if (selectedStudy) {
+        const updated = response.studies.find(s => s.id === selectedStudy.id);
+        if (updated) {
+          setSelectedStudyState(updated);
+        }
+      }
+    } catch (error) {
+      console.error('Failed to fetch studies:', error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const setSelectedStudy = (study: Study | null) => {
+    setSelectedStudyState(study);
+    if (study) {
+      localStorage.setItem('selectedStudyId', study.id);
+    } else {
+      localStorage.removeItem('selectedStudyId');
+    }
+  };
+
+  const clearStudy = () => {
+    setSelectedStudyState(null);
+    localStorage.removeItem('selectedStudyId');
+  };
+
+  // Initial load
+  useEffect(() => {
+    const init = async () => {
+      await refreshStudies();
+
+      // Restore last selected study
+      const lastStudyId = localStorage.getItem('selectedStudyId');
+      if (lastStudyId) {
+        const response = await apiClient.getStudies();
+        const study = response.studies.find(s => s.id === lastStudyId);
+        if (study) {
+          setSelectedStudyState(study);
+        }
+      }
+    };
+    init();
+  }, []);
+
+  return (
+    <StudyContext.Provider value={{
+      selectedStudy,
+      setSelectedStudy,
+      studies,
+      refreshStudies,
+      isLoading,
+      clearStudy
+    }}>
+      {children}
+    </StudyContext.Provider>
+  );
+};
+
+export const useStudy = () => {
+  const context = useContext(StudyContext);
+  if (context === undefined) {
+    throw new Error('useStudy must be used within a StudyProvider');
+  }
+  return context;
+};