fix: remove non-functional panel toggle keyboard shortcuts

Removes Ctrl+B and Ctrl+I keyboard shortcuts that were causing panels
to disappear completely instead of collapsing properly. Also updates
all panel tooltips to no longer reference the removed shortcuts.

Changes:
- Removed Ctrl+B (left panel) and Ctrl+I (right panel) shortcut handlers
- Updated left panel tooltips: removed "(Ctrl+B)" references
- Updated right panel tooltips: removed "(Ctrl+I)" references
- Tooltips now simply show "Collapse Panel" / "Expand Panel"
- Escape key handler preserved for closing property panels

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

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Jan-Henrik Bruhn 2025-10-10 23:30:41 +02:00
parent 5020ce0ed7
commit 045b1aa4d6
3 changed files with 6 additions and 16 deletions

View file

@ -83,19 +83,9 @@ function AppContent() {
onSelectAll: handleSelectAll,
});
// Panel toggle keyboard shortcuts
// Escape key to close property panels
useEffect(() => {
const handleKeyDown = (e: KeyboardEvent) => {
// Ctrl+B: Toggle left panel
if (e.ctrlKey && e.key === 'b') {
e.preventDefault();
toggleLeftPanel();
}
// Ctrl+I: Toggle right panel
if (e.ctrlKey && e.key === 'i') {
e.preventDefault();
toggleRightPanel();
}
// Escape: Close property panels
if (e.key === 'Escape') {
if (selectedNode || selectedEdge) {
@ -108,7 +98,7 @@ function AppContent() {
window.addEventListener('keydown', handleKeyDown);
return () => window.removeEventListener('keydown', handleKeyDown);
}, [toggleLeftPanel, toggleRightPanel, selectedNode, selectedEdge]);
}, [selectedNode, selectedEdge]);
return (
<div className="flex flex-col h-screen bg-gray-100">

View file

@ -71,7 +71,7 @@ const LeftPanel = ({ onDeselectAll, onAddNode }: LeftPanelProps) => {
if (leftPanelCollapsed) {
return (
<div className="h-full bg-gray-50 border-r border-gray-200 flex flex-col items-center py-2 space-y-2" style={{ width: '40px' }}>
<Tooltip title="Expand Tools Panel (Ctrl+B)" placement="right">
<Tooltip title="Expand Tools Panel" placement="right">
<IconButton size="small" onClick={expandLeftPanel}>
<ChevronRightIcon fontSize="small" />
</IconButton>
@ -89,7 +89,7 @@ const LeftPanel = ({ onDeselectAll, onAddNode }: LeftPanelProps) => {
{/* Header */}
<div className="flex items-center justify-between px-3 py-2 border-b border-gray-200 bg-gray-50">
<h2 className="text-sm font-semibold text-gray-700">Tools</h2>
<Tooltip title="Collapse Panel (Ctrl+B)">
<Tooltip title="Collapse Panel">
<IconButton size="small" onClick={collapseLeftPanel}>
<ChevronLeftIcon fontSize="small" />
</IconButton>

View file

@ -47,7 +47,7 @@ const PanelHeader = ({ title, onClose, onCollapse }: PanelHeaderProps) => (
</IconButton>
</Tooltip>
)}
<Tooltip title="Collapse Panel (Ctrl+I)">
<Tooltip title="Collapse Panel">
<IconButton size="small" onClick={onCollapse}>
<ChevronRightIcon fontSize="small" />
</IconButton>
@ -193,7 +193,7 @@ const RightPanel = ({ selectedNode, selectedEdge, onClose }: Props) => {
if (rightPanelCollapsed) {
return (
<div className="h-full bg-gray-50 border-l border-gray-200 flex flex-col items-center py-2" style={{ width: '40px' }}>
<Tooltip title="Expand Properties Panel (Ctrl+I)" placement="left">
<Tooltip title="Expand Properties Panel" placement="left">
<IconButton size="small" onClick={expandRightPanel}>
<ChevronLeftIcon fontSize="small" />
</IconButton>