import React from 'react'; import { Box } from '@mantine/core'; import { useTranslation } from 'react-i18next'; import { useRainbowThemeContext } from '../shared/RainbowThemeProvider'; import { useToolWorkflow } from '../../contexts/ToolWorkflowContext'; import { useFileHandler } from '../../hooks/useFileHandler'; import { useFileState, useFileActions } from '../../contexts/FileContext'; import { useNavigationState, useNavigationActions } from '../../contexts/NavigationContext'; import TopControls from '../shared/TopControls'; import FileEditor from '../fileEditor/FileEditor'; import PageEditor from '../pageEditor/PageEditor'; import PageEditorControls from '../pageEditor/PageEditorControls'; import Viewer from '../viewer/Viewer'; import ToolRenderer from '../tools/ToolRenderer'; import LandingPage from '../shared/LandingPage'; // No props needed - component uses contexts directly export default function Workbench() { const { t } = useTranslation(); const { isRainbowMode } = useRainbowThemeContext(); // Use context-based hooks to eliminate all prop drilling const { state } = useFileState(); const { actions } = useFileActions(); const { currentMode: currentView } = useNavigationState(); const { actions: navActions } = useNavigationActions(); const setCurrentView = navActions.setMode; const activeFiles = state.files.ids; const { previewFile, pageEditorFunctions, sidebarsVisible, setPreviewFile, setPageEditorFunctions, setSidebarsVisible } = useToolWorkflow(); const { selectedToolKey, selectedTool, handleToolSelect } = useToolWorkflow(); const { addToActiveFiles } = useFileHandler(); const handlePreviewClose = () => { setPreviewFile(null); const previousMode = sessionStorage.getItem('previousMode'); if (previousMode === 'split') { // Use context's handleToolSelect which coordinates tool selection and view changes handleToolSelect('split'); sessionStorage.removeItem('previousMode'); } else if (previousMode === 'compress') { handleToolSelect('compress'); sessionStorage.removeItem('previousMode'); } else if (previousMode === 'convert') { handleToolSelect('convert'); sessionStorage.removeItem('previousMode'); } else { setCurrentView('fileEditor'); } }; const renderMainContent = () => { if (activeFiles.length === 0) { return ( ); } switch (currentView) { case "fileEditor": return ( { setCurrentView("pageEditor"); }, onMergeFiles: (filesToMerge) => { filesToMerge.forEach(addToActiveFiles); setCurrentView("viewer"); } })} /> ); case "viewer": return ( ); case "pageEditor": return ( <> {pageEditorFunctions && ( )} ); default: // Check if it's a tool view if (selectedToolKey && selectedTool) { return ( ); } return ( ); } }; return ( {/* Top Controls */} {/* Main content area */} {renderMainContent()} ); }