diff --git a/src/App.tsx b/src/App.tsx index f66695c..5c877ca 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -4,6 +4,7 @@ import GraphEditor from "./components/Editor/GraphEditor"; import LeftPanel from "./components/Panels/LeftPanel"; import RightPanel from "./components/Panels/RightPanel"; import DocumentTabs from "./components/Workspace/DocumentTabs"; +import Toolbar from "./components/Toolbar/Toolbar"; import MenuBar from "./components/Menu/MenuBar"; import DocumentManager from "./components/Workspace/DocumentManager"; import KeyboardShortcutsHelp from "./components/Common/KeyboardShortcutsHelp"; @@ -137,6 +138,9 @@ function AppContent() { {/* Document Tabs */} + {/* Toolbar */} + {activeDocumentId && } + {/* Main content area with side panels */}
{/* Left Panel */} diff --git a/src/components/Panels/LeftPanel.tsx b/src/components/Panels/LeftPanel.tsx index 2e1100b..c73cbb5 100644 --- a/src/components/Panels/LeftPanel.tsx +++ b/src/components/Panels/LeftPanel.tsx @@ -2,14 +2,11 @@ import { useCallback } from 'react'; import { IconButton, Tooltip } from '@mui/material'; import ChevronLeftIcon from '@mui/icons-material/ChevronLeft'; import ChevronRightIcon from '@mui/icons-material/ChevronRight'; -import UndoIcon from '@mui/icons-material/Undo'; -import RedoIcon from '@mui/icons-material/Redo'; import ExpandMoreIcon from '@mui/icons-material/ExpandMore'; import ExpandLessIcon from '@mui/icons-material/ExpandLess'; import { usePanelStore } from '../../stores/panelStore'; import { useGraphWithHistory } from '../../hooks/useGraphWithHistory'; import { useEditorStore } from '../../stores/editorStore'; -import { useDocumentHistory } from '../../hooks/useDocumentHistory'; import { createNode } from '../../utils/nodeUtils'; /** @@ -41,7 +38,6 @@ const LeftPanel = ({ onDeselectAll, onAddNode }: LeftPanelProps) => { const { nodeTypes, edgeTypes, addNode } = useGraphWithHistory(); const { selectedRelationType, setSelectedRelationType } = useEditorStore(); - const { undo, redo, canUndo, canRedo, undoDescription, redoDescription } = useDocumentHistory(); const handleAddNode = useCallback( (nodeTypeId: string) => { @@ -78,17 +74,6 @@ const LeftPanel = ({ onDeselectAll, onAddNode }: LeftPanelProps) => { - - {/* Icon indicators for quick reference */} -
- - - - - - - -
); } @@ -111,58 +96,6 @@ const LeftPanel = ({ onDeselectAll, onAddNode }: LeftPanelProps) => { {/* Scrollable content */}
- {/* History Section */} -
- - {leftPanelSections.history && ( -
-
- - - - - - - - - - -
- {undoDescription && ( -

- Next: {undoDescription} -

- )} -
- )} -
- {/* Add Actors Section */}
- ))} -
-
- - {/* Relation Type Selector */} -
-

Relation Type:

- -
- - - {/* Instructions */} -
-

- Click a button to add an actor. Drag actors to position them. Select a relation type above, then click - and drag from a handle to create a relation between actors. -

+ {/* Description text */} + {undoDescription && ( + + Next: {undoDescription} + + )}