mirror of
https://github.com/Frooodle/Stirling-PDF.git
synced 2025-08-11 13:48:37 +02:00
Restructure homepage
This commit is contained in:
Connor Yoh
parent
23aa43bd78
commit
1bd3b019dc
203
frontend/src/components/layout/Workbench.tsx
Normal file
203
frontend/src/components/layout/Workbench.tsx
Normal file
@ -0,0 +1,203 @@
|
||||
import React from 'react';
|
||||
import { Box } from '@mantine/core';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useRainbowThemeContext } from '../shared/RainbowThemeProvider';
|
||||
import { ToolConfiguration } from '../../types/tool';
|
||||
import { PageEditorFunctions } from '../../types/pageEditor';
|
||||
|
||||
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';
|
||||
|
||||
interface WorkbenchProps {
|
||||
/** Currently active files */
|
||||
activeFiles: File[];
|
||||
/** Current view mode */
|
||||
currentView: string;
|
||||
/** Currently selected tool key */
|
||||
selectedToolKey: string | null;
|
||||
/** Selected tool configuration */
|
||||
selectedTool: ToolConfiguration | null;
|
||||
/** Whether sidebars are visible */
|
||||
sidebarsVisible: boolean;
|
||||
/** Function to set sidebars visibility */
|
||||
setSidebarsVisible: (visible: boolean) => void;
|
||||
/** File to preview */
|
||||
previewFile: File | null;
|
||||
/** Function to clear preview file */
|
||||
setPreviewFile: (file: File | null) => void;
|
||||
/** Page editor functions */
|
||||
pageEditorFunctions: PageEditorFunctions | null;
|
||||
/** Function to set page editor functions */
|
||||
setPageEditorFunctions: (functions: PageEditorFunctions | null) => void;
|
||||
/** Handler for view changes */
|
||||
onViewChange: (view: string) => void;
|
||||
/** Handler for tool selection */
|
||||
onToolSelect: (toolId: string) => void;
|
||||
/** Handler for setting left panel view */
|
||||
onSetLeftPanelView: (view: 'toolPicker' | 'toolContent') => void;
|
||||
/** Handler for adding files to active files */
|
||||
onAddToActiveFiles: (file: File) => void;
|
||||
}
|
||||
|
||||
export default function Workbench({
|
||||
activeFiles,
|
||||
currentView,
|
||||
selectedToolKey,
|
||||
selectedTool,
|
||||
sidebarsVisible,
|
||||
setSidebarsVisible,
|
||||
previewFile,
|
||||
setPreviewFile,
|
||||
pageEditorFunctions,
|
||||
setPageEditorFunctions,
|
||||
onViewChange,
|
||||
onToolSelect,
|
||||
onSetLeftPanelView,
|
||||
onAddToActiveFiles
|
||||
}: WorkbenchProps) {
|
||||
const { t } = useTranslation();
|
||||
const { isRainbowMode } = useRainbowThemeContext();
|
||||
|
||||
const handlePreviewClose = () => {
|
||||
setPreviewFile(null);
|
||||
const previousMode = sessionStorage.getItem('previousMode');
|
||||
if (previousMode === 'split') {
|
||||
onToolSelect('split');
|
||||
onViewChange('split');
|
||||
onSetLeftPanelView('toolContent');
|
||||
sessionStorage.removeItem('previousMode');
|
||||
} else if (previousMode === 'compress') {
|
||||
onToolSelect('compress');
|
||||
onViewChange('compress');
|
||||
onSetLeftPanelView('toolContent');
|
||||
sessionStorage.removeItem('previousMode');
|
||||
} else if (previousMode === 'convert') {
|
||||
onToolSelect('convert');
|
||||
onViewChange('convert');
|
||||
onSetLeftPanelView('toolContent');
|
||||
sessionStorage.removeItem('previousMode');
|
||||
} else {
|
||||
onViewChange('fileEditor');
|
||||
}
|
||||
};
|
||||
|
||||
const renderMainContent = () => {
|
||||
if (!activeFiles[0]) {
|
||||
return (
|
||||
<LandingPage
|
||||
title={currentView === "viewer"
|
||||
? t("fileUpload.selectPdfToView", "Select a PDF to view")
|
||||
: t("fileUpload.selectPdfToEdit", "Select a PDF to edit")
|
||||
}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
switch (currentView) {
|
||||
case "fileEditor":
|
||||
return (
|
||||
<FileEditor
|
||||
toolMode={!!selectedToolKey}
|
||||
showUpload={true}
|
||||
showBulkActions={!selectedToolKey}
|
||||
supportedExtensions={selectedTool?.supportedFormats || ["pdf"]}
|
||||
{...(!selectedToolKey && {
|
||||
onOpenPageEditor: (file) => {
|
||||
onViewChange("pageEditor");
|
||||
},
|
||||
onMergeFiles: (filesToMerge) => {
|
||||
filesToMerge.forEach(onAddToActiveFiles);
|
||||
onViewChange("viewer");
|
||||
}
|
||||
})}
|
||||
/>
|
||||
);
|
||||
|
||||
case "viewer":
|
||||
return (
|
||||
<Viewer
|
||||
sidebarsVisible={sidebarsVisible}
|
||||
setSidebarsVisible={setSidebarsVisible}
|
||||
previewFile={previewFile}
|
||||
{...(previewFile && {
|
||||
onClose: handlePreviewClose
|
||||
})}
|
||||
/>
|
||||
);
|
||||
|
||||
case "pageEditor":
|
||||
return (
|
||||
<>
|
||||
<PageEditor
|
||||
onFunctionsReady={setPageEditorFunctions}
|
||||
/>
|
||||
{pageEditorFunctions && (
|
||||
<PageEditorControls
|
||||
onClosePdf={pageEditorFunctions.closePdf}
|
||||
onUndo={pageEditorFunctions.handleUndo}
|
||||
onRedo={pageEditorFunctions.handleRedo}
|
||||
canUndo={pageEditorFunctions.canUndo}
|
||||
canRedo={pageEditorFunctions.canRedo}
|
||||
onRotate={pageEditorFunctions.handleRotate}
|
||||
onDelete={pageEditorFunctions.handleDelete}
|
||||
onSplit={pageEditorFunctions.handleSplit}
|
||||
onExportSelected={pageEditorFunctions.onExportSelected}
|
||||
onExportAll={pageEditorFunctions.onExportAll}
|
||||
exportLoading={pageEditorFunctions.exportLoading}
|
||||
selectionMode={pageEditorFunctions.selectionMode}
|
||||
selectedPages={pageEditorFunctions.selectedPages}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
|
||||
default:
|
||||
// Check if it's a tool view
|
||||
if (selectedToolKey && selectedTool) {
|
||||
return (
|
||||
<ToolRenderer
|
||||
selectedToolKey={selectedToolKey}
|
||||
/>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<LandingPage
|
||||
title="File Management"
|
||||
/>
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Box
|
||||
className="flex-1 h-screen min-w-80 relative flex flex-col"
|
||||
style={
|
||||
isRainbowMode
|
||||
? {} // No background color in rainbow mode
|
||||
: { backgroundColor: 'var(--bg-background)' }
|
||||
}
|
||||
>
|
||||
{/* Top Controls */}
|
||||
<TopControls
|
||||
currentView={currentView}
|
||||
setCurrentView={onViewChange}
|
||||
selectedToolKey={selectedToolKey}
|
||||
/>
|
||||
|
||||
{/* Main content area */}
|
||||
<Box
|
||||
className="flex-1 min-h-0 relative z-10"
|
||||
style={{
|
||||
transition: 'opacity 0.15s ease-in-out',
|
||||
}}
|
||||
>
|
||||
{renderMainContent()}
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
105
frontend/src/components/tools/ToolPanel.tsx
Normal file
105
frontend/src/components/tools/ToolPanel.tsx
Normal file
@ -0,0 +1,105 @@
|
||||
import React, { useState } from 'react';
|
||||
import { Button, TextInput } from '@mantine/core';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useRainbowThemeContext } from '../shared/RainbowThemeProvider';
|
||||
import { ToolRegistry, ToolConfiguration } from '../../types/tool';
|
||||
import ToolPicker from './ToolPicker';
|
||||
import ToolRenderer from './ToolRenderer';
|
||||
import rainbowStyles from '../../styles/rainbow.module.css';
|
||||
|
||||
interface ToolPanelProps {
|
||||
/** Whether the tool panel is visible */
|
||||
visible: boolean;
|
||||
/** Whether reader mode is active (hides the panel) */
|
||||
readerMode: boolean;
|
||||
/** Current view mode: 'toolPicker' or 'toolContent' */
|
||||
leftPanelView: 'toolPicker' | 'toolContent';
|
||||
/** Currently selected tool key */
|
||||
selectedToolKey: string | null;
|
||||
/** Selected tool configuration */
|
||||
selectedTool: ToolConfiguration | null;
|
||||
/** Tool registry with all available tools */
|
||||
toolRegistry: ToolRegistry;
|
||||
/** Handler for tool selection */
|
||||
onToolSelect: (toolId: string) => void;
|
||||
/** Handler for back to tools navigation */
|
||||
onBackToTools: () => void;
|
||||
/** Handler for file preview */
|
||||
onPreviewFile?: (file: File | null) => void;
|
||||
}
|
||||
|
||||
export default function ToolPanel({
|
||||
visible,
|
||||
readerMode,
|
||||
leftPanelView,
|
||||
selectedToolKey,
|
||||
selectedTool,
|
||||
toolRegistry,
|
||||
onToolSelect,
|
||||
onBackToTools,
|
||||
onPreviewFile
|
||||
}: ToolPanelProps) {
|
||||
const { t } = useTranslation();
|
||||
const { isRainbowMode } = useRainbowThemeContext();
|
||||
const [search, setSearch] = useState("");
|
||||
|
||||
// Filter tools based on search
|
||||
const filteredTools = Object.entries(toolRegistry).filter(([_, { name }]) =>
|
||||
name.toLowerCase().includes(search.toLowerCase())
|
||||
);
|
||||
|
||||
return (
|
||||
<div
|
||||
className={`h-screen flex flex-col overflow-hidden bg-[var(--bg-toolbar)] border-r border-[var(--border-subtle)] transition-all duration-300 ease-out ${
|
||||
isRainbowMode ? rainbowStyles.rainbowPaper : ''
|
||||
}`}
|
||||
style={{
|
||||
width: visible && !readerMode ? '20rem' : '0',
|
||||
padding: visible && !readerMode ? '0.5rem' : '0'
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
opacity: visible && !readerMode ? 1 : 0,
|
||||
transition: 'opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)',
|
||||
height: '100%',
|
||||
display: 'flex',
|
||||
flexDirection: 'column'
|
||||
}}
|
||||
>
|
||||
{/* Search Bar - Always visible at the top */}
|
||||
<div className="mb-4">
|
||||
<TextInput
|
||||
placeholder={t("toolPicker.searchPlaceholder", "Search tools...")}
|
||||
value={search}
|
||||
onChange={(e) => setSearch(e.currentTarget.value)}
|
||||
autoComplete="off"
|
||||
size="sm"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{leftPanelView === 'toolPicker' ? (
|
||||
// Tool Picker View
|
||||
<div className="flex-1 flex flex-col">
|
||||
<ToolPicker
|
||||
selectedToolKey={selectedToolKey}
|
||||
onSelect={onToolSelect}
|
||||
filteredTools={filteredTools}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
// Selected Tool Content View
|
||||
<div className="flex-1 flex flex-col">
|
||||
{/* Tool content */}
|
||||
<div className="flex-1 min-h-0">
|
||||
<ToolRenderer
|
||||
selectedToolKey={selectedToolKey}
|
||||
onPreviewFile={onPreviewFile}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@ -1,32 +1,21 @@
|
||||
import React, { useState } from "react";
|
||||
import { Box, Text, Stack, Button, TextInput, Group } from "@mantine/core";
|
||||
import React from "react";
|
||||
import { Box, Text, Stack, Button } from "@mantine/core";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { ToolRegistry } from "../../types/tool";
|
||||
|
||||
interface ToolPickerProps {
|
||||
selectedToolKey: string | null;
|
||||
onSelect: (id: string) => void;
|
||||
toolRegistry: ToolRegistry;
|
||||
/** Pre-filtered tools to display */
|
||||
filteredTools: [string, ToolRegistry[string]][];
|
||||
}
|
||||
|
||||
const ToolPicker = ({ selectedToolKey, onSelect, toolRegistry }: ToolPickerProps) => {
|
||||
const ToolPicker = ({ selectedToolKey, onSelect, filteredTools }: ToolPickerProps) => {
|
||||
const { t } = useTranslation();
|
||||
const [search, setSearch] = useState("");
|
||||
|
||||
const filteredTools = Object.entries(toolRegistry).filter(([_, { name }]) =>
|
||||
name.toLowerCase().includes(search.toLowerCase())
|
||||
);
|
||||
|
||||
return (
|
||||
<Box >
|
||||
<TextInput
|
||||
placeholder={t("toolPicker.searchPlaceholder", "Search tools...")}
|
||||
value={search}
|
||||
onChange={(e) => setSearch(e.currentTarget.value)}
|
||||
mb="md"
|
||||
autoComplete="off"
|
||||
/>
|
||||
<Stack align="flex-start">
|
||||
<Box>
|
||||
<Stack align="flex-start">
|
||||
{filteredTools.length === 0 ? (
|
||||
<Text c="dimmed" size="sm">
|
||||
{t("toolPicker.noToolsFound", "No tools found")}
|
||||
|
||||
@ -4,25 +4,16 @@ import { useFileContext } from "../contexts/FileContext";
|
||||
import { FileSelectionProvider, useFileSelection } from "../contexts/FileSelectionContext";
|
||||
import { useToolManagement } from "../hooks/useToolManagement";
|
||||
import { useFileHandler } from "../hooks/useFileHandler";
|
||||
import { Group, Box, Button } from "@mantine/core";
|
||||
import { useRainbowThemeContext } from "../components/shared/RainbowThemeProvider";
|
||||
import { Group } from "@mantine/core";
|
||||
import { PageEditorFunctions } from "../types/pageEditor";
|
||||
import rainbowStyles from '../styles/rainbow.module.css';
|
||||
|
||||
import ToolPicker from "../components/tools/ToolPicker";
|
||||
import TopControls from "../components/shared/TopControls";
|
||||
import FileEditor from "../components/fileEditor/FileEditor";
|
||||
import PageEditor from "../components/pageEditor/PageEditor";
|
||||
import PageEditorControls from "../components/pageEditor/PageEditorControls";
|
||||
import Viewer from "../components/viewer/Viewer";
|
||||
import ToolRenderer from "../components/tools/ToolRenderer";
|
||||
import ToolPanel from "../components/tools/ToolPanel";
|
||||
import Workbench from "../components/layout/Workbench";
|
||||
import QuickAccessBar from "../components/shared/QuickAccessBar";
|
||||
import LandingPage from "../components/shared/LandingPage";
|
||||
import FileUploadModal from "../components/shared/FileUploadModal";
|
||||
|
||||
function HomePageContent() {
|
||||
const { t } = useTranslation();
|
||||
const { isRainbowMode } = useRainbowThemeContext();
|
||||
|
||||
const fileContext = useFileContext();
|
||||
const { activeFiles, currentView, setCurrentView } = fileContext;
|
||||
@ -55,8 +46,6 @@ function HomePageContent() {
|
||||
}
|
||||
}, [selectedTool, setMaxFiles, setIsToolMode, setSelectedFiles]);
|
||||
|
||||
|
||||
|
||||
const handleToolSelect = useCallback(
|
||||
(id: string) => {
|
||||
selectTool(id);
|
||||
@ -81,16 +70,12 @@ function HomePageContent() {
|
||||
setCurrentView(view as any);
|
||||
}, [setCurrentView]);
|
||||
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<Group
|
||||
align="flex-start"
|
||||
gap={0}
|
||||
className="min-h-screen w-screen overflow-hidden flex-nowrap flex"
|
||||
>
|
||||
{/* Quick Access Bar */}
|
||||
<QuickAccessBar
|
||||
onToolsClick={handleQuickAccessTools}
|
||||
onReaderToggle={handleReaderToggle}
|
||||
@ -100,174 +85,34 @@ function HomePageContent() {
|
||||
readerMode={readerMode}
|
||||
/>
|
||||
|
||||
{/* Left: Tool Picker or Selected Tool Panel */}
|
||||
<div
|
||||
className={`h-screen flex flex-col overflow-hidden bg-[var(--bg-toolbar)] border-r border-[var(--border-subtle)] transition-all duration-300 ease-out ${isRainbowMode ? rainbowStyles.rainbowPaper : ''}`}
|
||||
style={{
|
||||
width: sidebarsVisible && !readerMode ? '14vw' : '0',
|
||||
padding: sidebarsVisible && !readerMode ? '0.5rem' : '0'
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
opacity: sidebarsVisible && !readerMode ? 1 : 0,
|
||||
transition: 'opacity 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94)',
|
||||
height: '100%',
|
||||
display: 'flex',
|
||||
flexDirection: 'column'
|
||||
}}
|
||||
>
|
||||
{leftPanelView === 'toolPicker' ? (
|
||||
// Tool Picker View
|
||||
<div className="flex-1 flex flex-col">
|
||||
<ToolPicker
|
||||
selectedToolKey={selectedToolKey}
|
||||
onSelect={handleToolSelect}
|
||||
toolRegistry={toolRegistry}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
// Selected Tool Content View
|
||||
<div className="flex-1 flex flex-col">
|
||||
{/* Back button */}
|
||||
<div className="mb-4">
|
||||
<Button
|
||||
variant="subtle"
|
||||
size="sm"
|
||||
onClick={handleQuickAccessTools}
|
||||
className="text-sm"
|
||||
>
|
||||
← {t("fileUpload.backToTools", "Back to Tools")}
|
||||
</Button>
|
||||
</div>
|
||||
<ToolPanel
|
||||
visible={sidebarsVisible}
|
||||
readerMode={readerMode}
|
||||
leftPanelView={leftPanelView}
|
||||
selectedToolKey={selectedToolKey}
|
||||
selectedTool={selectedTool}
|
||||
toolRegistry={toolRegistry}
|
||||
onToolSelect={handleToolSelect}
|
||||
onBackToTools={handleQuickAccessTools}
|
||||
onPreviewFile={setPreviewFile}
|
||||
/>
|
||||
|
||||
{/* Tool title */}
|
||||
<div className="mb-4" style={{ marginLeft: '0.5rem' }}>
|
||||
<h2 className="text-lg font-semibold">{selectedTool?.name}</h2>
|
||||
</div>
|
||||
|
||||
{/* Tool content */}
|
||||
<div className="flex-1 min-h-0">
|
||||
<ToolRenderer
|
||||
selectedToolKey={selectedToolKey}
|
||||
onPreviewFile={setPreviewFile}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Main View */}
|
||||
<Box
|
||||
className="flex-1 h-screen min-w-80 relative flex flex-col"
|
||||
style={
|
||||
isRainbowMode
|
||||
? {} // No background color in rainbow mode
|
||||
: { backgroundColor: 'var(--bg-background)' }
|
||||
}
|
||||
>
|
||||
{/* Top Controls */}
|
||||
<TopControls
|
||||
currentView={currentView}
|
||||
setCurrentView={handleViewChange}
|
||||
selectedToolKey={selectedToolKey}
|
||||
/>
|
||||
{/* Main content area */}
|
||||
<Box
|
||||
className="flex-1 min-h-0 relative z-10"
|
||||
style={{
|
||||
transition: 'opacity 0.15s ease-in-out',
|
||||
}}
|
||||
>
|
||||
{!activeFiles[0] ? (
|
||||
<LandingPage
|
||||
title={currentView === "viewer"
|
||||
? t("fileUpload.selectPdfToView", "Select a PDF to view")
|
||||
: t("fileUpload.selectPdfToEdit", "Select a PDF to edit")
|
||||
}
|
||||
/>
|
||||
) : currentView === "fileEditor" ? (
|
||||
<FileEditor
|
||||
toolMode={!!selectedToolKey}
|
||||
showUpload={true}
|
||||
showBulkActions={!selectedToolKey}
|
||||
supportedExtensions={selectedTool?.supportedFormats || ["pdf"]}
|
||||
{...(!selectedToolKey && {
|
||||
onOpenPageEditor: (file) => {
|
||||
handleViewChange("pageEditor");
|
||||
},
|
||||
onMergeFiles: (filesToMerge) => {
|
||||
filesToMerge.forEach(addToActiveFiles);
|
||||
handleViewChange("viewer");
|
||||
}
|
||||
})}
|
||||
/>
|
||||
) : currentView === "viewer" ? (
|
||||
<Viewer
|
||||
sidebarsVisible={sidebarsVisible}
|
||||
setSidebarsVisible={setSidebarsVisible}
|
||||
previewFile={previewFile}
|
||||
{...(previewFile && {
|
||||
onClose: () => {
|
||||
setPreviewFile(null); // Clear preview file
|
||||
const previousMode = sessionStorage.getItem('previousMode');
|
||||
if (previousMode === 'split') {
|
||||
selectTool('split');
|
||||
setCurrentView('split');
|
||||
setLeftPanelView('toolContent');
|
||||
sessionStorage.removeItem('previousMode');
|
||||
} else if (previousMode === 'compress') {
|
||||
selectTool('compress');
|
||||
setCurrentView('compress');
|
||||
setLeftPanelView('toolContent');
|
||||
sessionStorage.removeItem('previousMode');
|
||||
} else if (previousMode === 'convert') {
|
||||
selectTool('convert');
|
||||
setCurrentView('convert');
|
||||
setLeftPanelView('toolContent');
|
||||
sessionStorage.removeItem('previousMode');
|
||||
} else {
|
||||
setCurrentView('fileEditor');
|
||||
}
|
||||
}
|
||||
})}
|
||||
/>
|
||||
) : currentView === "pageEditor" ? (
|
||||
<>
|
||||
<PageEditor
|
||||
onFunctionsReady={setPageEditorFunctions}
|
||||
/>
|
||||
{pageEditorFunctions && (
|
||||
<PageEditorControls
|
||||
onClosePdf={pageEditorFunctions.closePdf}
|
||||
onUndo={pageEditorFunctions.handleUndo}
|
||||
onRedo={pageEditorFunctions.handleRedo}
|
||||
canUndo={pageEditorFunctions.canUndo}
|
||||
canRedo={pageEditorFunctions.canRedo}
|
||||
onRotate={pageEditorFunctions.handleRotate}
|
||||
onDelete={pageEditorFunctions.handleDelete}
|
||||
onSplit={pageEditorFunctions.handleSplit}
|
||||
onExportSelected={pageEditorFunctions.onExportSelected}
|
||||
onExportAll={pageEditorFunctions.onExportAll}
|
||||
exportLoading={pageEditorFunctions.exportLoading}
|
||||
selectionMode={pageEditorFunctions.selectionMode}
|
||||
selectedPages={pageEditorFunctions.selectedPages}
|
||||
/>
|
||||
)}
|
||||
</>
|
||||
) : selectedToolKey && selectedTool ? (
|
||||
// Fallback: if tool is selected but not in fileEditor view, show tool in main area
|
||||
<ToolRenderer
|
||||
selectedToolKey={selectedToolKey}
|
||||
/>
|
||||
) : (
|
||||
<LandingPage
|
||||
title="File Management"
|
||||
/>
|
||||
)}
|
||||
</Box>
|
||||
</Box>
|
||||
<Workbench
|
||||
activeFiles={activeFiles}
|
||||
currentView={currentView}
|
||||
selectedToolKey={selectedToolKey}
|
||||
selectedTool={selectedTool}
|
||||
sidebarsVisible={sidebarsVisible}
|
||||
setSidebarsVisible={setSidebarsVisible}
|
||||
previewFile={previewFile}
|
||||
setPreviewFile={setPreviewFile}
|
||||
pageEditorFunctions={pageEditorFunctions}
|
||||
setPageEditorFunctions={setPageEditorFunctions}
|
||||
onViewChange={handleViewChange}
|
||||
onToolSelect={selectTool}
|
||||
onSetLeftPanelView={setLeftPanelView}
|
||||
onAddToActiveFiles={addToActiveFiles}
|
||||
/>
|
||||
|
||||
{/* Global Modals */}
|
||||
<FileUploadModal selectedTool={selectedTool} />
|
||||
|
||||
Loading…
Reference in New Issue
Block a user