Dashboard: - Enhanced terminal components (ClaudeTerminal, GlobalClaudeTerminal) - Improved MarkdownRenderer for better documentation display - Updated convergence plots (ConvergencePlot, PlotlyConvergencePlot) - Refined Home, Analysis, Dashboard, Setup, Results pages - Added StudyContext improvements - Updated vite.config for better dev experience Configuration: - Updated CLAUDE.md with latest instructions - Enhanced launch_dashboard.py - Updated config.py settings 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
53 lines
1.8 KiB
TypeScript
53 lines
1.8 KiB
TypeScript
import React from 'react';
|
|
import { useClaudeTerminal } from '../context/ClaudeTerminalContext';
|
|
import { ClaudeTerminal } from './ClaudeTerminal';
|
|
import { Terminal } from 'lucide-react';
|
|
|
|
/**
|
|
* GlobalClaudeTerminal - A floating terminal that persists across page navigation
|
|
*
|
|
* This component renders at the App level and maintains the Claude Code session
|
|
* even when the user navigates between pages. It can be minimized to a floating
|
|
* button or expanded to a side panel.
|
|
*/
|
|
export const GlobalClaudeTerminal: React.FC = () => {
|
|
const { isOpen, setIsOpen, isExpanded, setIsExpanded, isConnected } = useClaudeTerminal();
|
|
|
|
// Floating button when terminal is closed
|
|
if (!isOpen) {
|
|
return (
|
|
<button
|
|
onClick={() => setIsOpen(true)}
|
|
className={`fixed bottom-6 right-6 p-4 rounded-full shadow-lg transition-all z-50 ${
|
|
isConnected
|
|
? 'bg-green-600 hover:bg-green-500'
|
|
: 'bg-primary-600 hover:bg-primary-500'
|
|
}`}
|
|
title={isConnected ? 'Claude Terminal (Connected)' : 'Open Claude Terminal'}
|
|
>
|
|
<Terminal className="w-6 h-6 text-white" />
|
|
{isConnected && (
|
|
<span className="absolute -top-1 -right-1 w-3 h-3 bg-green-400 rounded-full border-2 border-dark-900 animate-pulse" />
|
|
)}
|
|
</button>
|
|
);
|
|
}
|
|
|
|
// Terminal panel - responsive sizing
|
|
// On mobile portrait: full width with small margins
|
|
// On tablet/desktop: fixed size panel
|
|
return (
|
|
<div className={`fixed z-50 transition-all duration-200 ${
|
|
isExpanded
|
|
? 'inset-2 sm:inset-4'
|
|
: 'bottom-2 right-2 left-2 h-[400px] sm:bottom-6 sm:right-6 sm:left-auto sm:w-[650px] sm:h-[500px]'
|
|
}`}>
|
|
<ClaudeTerminal
|
|
isExpanded={isExpanded}
|
|
onToggleExpand={() => setIsExpanded(!isExpanded)}
|
|
onClose={() => setIsOpen(false)}
|
|
/>
|
|
</div>
|
|
);
|
|
};
|