Restore/refactor endpoint mamagement. refactor usetool management

This commit is contained in:
Reece 2025-07-15 00:20:59 +01:00
parent 5e401d255e
commit be251d271d
2 changed files with 58 additions and 74 deletions

View File

@ -1,4 +1,4 @@
import React, { useState, useCallback, useMemo } from 'react'; import React, { useState, useCallback, useMemo, useEffect } from 'react';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import AddToPhotosIcon from "@mui/icons-material/AddToPhotos"; import AddToPhotosIcon from "@mui/icons-material/AddToPhotos";
import ContentCutIcon from "@mui/icons-material/ContentCut"; import ContentCutIcon from "@mui/icons-material/ContentCut";
@ -6,6 +6,7 @@ import ZoomInMapIcon from "@mui/icons-material/ZoomInMap";
import SplitPdfPanel from "../tools/Split"; import SplitPdfPanel from "../tools/Split";
import CompressPdfPanel from "../tools/Compress"; import CompressPdfPanel from "../tools/Compress";
import MergePdfPanel from "../tools/Merge"; import MergePdfPanel from "../tools/Merge";
import { useMultipleEndpointsEnabled } from "./useEndpointConfig";
type ToolRegistryEntry = { type ToolRegistryEntry = {
icon: React.ReactNode; icon: React.ReactNode;
@ -18,112 +19,78 @@ type ToolRegistry = {
[key: string]: ToolRegistryEntry; [key: string]: ToolRegistryEntry;
}; };
// Base tool registry without translations
const baseToolRegistry = { const baseToolRegistry = {
split: { icon: <ContentCutIcon />, component: SplitPdfPanel, view: "split" }, split: { icon: <ContentCutIcon />, component: SplitPdfPanel, view: "split" },
compress: { icon: <ZoomInMapIcon />, component: CompressPdfPanel, view: "viewer" }, compress: { icon: <ZoomInMapIcon />, component: CompressPdfPanel, view: "viewer" },
merge: { icon: <AddToPhotosIcon />, component: MergePdfPanel, view: "pageEditor" }, merge: { icon: <AddToPhotosIcon />, component: MergePdfPanel, view: "pageEditor" },
}; };
// Tool parameter defaults // Tool endpoint mappings
const getToolDefaults = (toolKey: string) => { const toolEndpoints: Record<string, string[]> = {
switch (toolKey) { split: ["split-pages", "split-pdf-by-sections", "split-by-size-or-count", "split-pdf-by-chapters"],
case 'split': compress: ["compress-pdf"],
return { merge: ["merge-pdfs"],
mode: '',
pages: '',
hDiv: '2',
vDiv: '2',
merge: false,
splitType: 'size',
splitValue: '',
bookmarkLevel: '1',
includeMetadata: false,
allowDuplicates: false,
};
case 'compress':
return {
quality: 80,
imageCompression: true,
removeMetadata: false
};
case 'merge':
return {
sortOrder: 'name',
includeMetadata: true
};
default:
return {};
}
}; };
export const useToolManagement = () => { export const useToolManagement = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const [selectedToolKey, setSelectedToolKey] = useState<string | null>(null); const [selectedToolKey, setSelectedToolKey] = useState<string | null>(null);
const [toolSelectedFileIds, setToolSelectedFileIds] = useState<string[]>([]); const [toolSelectedFileIds, setToolSelectedFileIds] = useState<string[]>([]);
const [toolParams, setToolParams] = useState<Record<string, any>>({});
// Tool registry with translations const allEndpoints = Array.from(new Set(Object.values(toolEndpoints).flat()));
const toolRegistry: ToolRegistry = useMemo(() => ({ const { endpointStatus, loading: endpointsLoading } = useMultipleEndpointsEnabled(allEndpoints);
split: { ...baseToolRegistry.split, name: t("home.split.title", "Split PDF") },
compress: { ...baseToolRegistry.compress, name: t("home.compressPdfs.title", "Compress PDF") },
merge: { ...baseToolRegistry.merge, name: t("home.merge.title", "Merge PDFs") },
}), [t]);
// Get tool parameters with defaults const isToolAvailable = useCallback((toolKey: string): boolean => {
const getToolParams = useCallback((toolKey: string | null) => { if (endpointsLoading) return true;
if (!toolKey) return {}; const endpoints = toolEndpoints[toolKey] || [];
return endpoints.some(endpoint => endpointStatus[endpoint] === true);
const storedParams = toolParams[toolKey] || {}; }, [endpointsLoading, endpointStatus]);
const defaultParams = getToolDefaults(toolKey);
return { ...defaultParams, ...storedParams };
}, [toolParams]);
// Update tool parameters const toolRegistry: ToolRegistry = useMemo(() => {
const updateToolParams = useCallback((toolKey: string, newParams: any) => { const availableToolRegistry: ToolRegistry = {};
setToolParams(prev => ({ Object.keys(baseToolRegistry).forEach(toolKey => {
...prev, if (isToolAvailable(toolKey)) {
[toolKey]: { availableToolRegistry[toolKey] = {
...prev[toolKey], ...baseToolRegistry[toolKey as keyof typeof baseToolRegistry],
...newParams name: t(`home.${toolKey}.title`, toolKey.charAt(0).toUpperCase() + toolKey.slice(1))
};
} }
})); });
}, []); return availableToolRegistry;
}, [t, isToolAvailable]);
useEffect(() => {
if (!endpointsLoading && selectedToolKey && !toolRegistry[selectedToolKey]) {
const firstAvailableTool = Object.keys(toolRegistry)[0];
if (firstAvailableTool) {
setSelectedToolKey(firstAvailableTool);
} else {
setSelectedToolKey(null);
}
}
}, [endpointsLoading, selectedToolKey, toolRegistry]);
// Select tool
const selectTool = useCallback((toolKey: string) => { const selectTool = useCallback((toolKey: string) => {
setSelectedToolKey(toolKey); setSelectedToolKey(toolKey);
}, []); }, []);
// Clear tool selection
const clearToolSelection = useCallback(() => { const clearToolSelection = useCallback(() => {
setSelectedToolKey(null); setSelectedToolKey(null);
}, []); }, []);
// Get currently selected tool
const selectedTool = selectedToolKey ? toolRegistry[selectedToolKey] : null; const selectedTool = selectedToolKey ? toolRegistry[selectedToolKey] : null;
return { return {
// State
selectedToolKey, selectedToolKey,
selectedTool, selectedTool,
toolSelectedFileIds, toolSelectedFileIds,
toolParams: getToolParams(selectedToolKey),
toolRegistry, toolRegistry,
// Actions
selectTool, selectTool,
clearToolSelection, clearToolSelection,
updateToolParams: (newParams: any) => {
if (selectedToolKey) {
updateToolParams(selectedToolKey, newParams);
}
},
setToolSelectedFileIds, setToolSelectedFileIds,
// Utilities
getToolParams,
}; };
}; };

View File

@ -24,6 +24,7 @@ import { FileOperation } from "../types/fileContext";
import { zipFileService } from "../services/zipFileService"; import { zipFileService } from "../services/zipFileService";
import { generateThumbnailForFile } from "../utils/thumbnailUtils"; import { generateThumbnailForFile } from "../utils/thumbnailUtils";
import FileEditor from "../components/fileEditor/FileEditor"; import FileEditor from "../components/fileEditor/FileEditor";
import { useEndpointEnabled } from "../hooks/useEndpointConfig";
export interface SplitPdfPanelProps { export interface SplitPdfPanelProps {
selectedFiles?: File[]; selectedFiles?: File[];
@ -50,6 +51,22 @@ const SplitPdfPanel: React.FC<SplitPdfPanelProps> = ({
const [includeMetadata, setIncludeMetadata] = useState(false); const [includeMetadata, setIncludeMetadata] = useState(false);
const [allowDuplicates, setAllowDuplicates] = useState(false); const [allowDuplicates, setAllowDuplicates] = useState(false);
// Helper to get endpoint name from split mode
const getEndpointName = (mode: string) => {
switch (mode) {
case "byPages":
return "split-pages";
case "bySections":
return "split-pdf-by-sections";
case "bySizeOrCount":
return "split-by-size-or-count";
case "byChapters":
return "split-pdf-by-chapters";
default:
return "split-pages"; // Default fallback
}
};
const [status, setStatus] = useState(""); const [status, setStatus] = useState("");
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [errorMessage, setErrorMessage] = useState<string | null>(null); const [errorMessage, setErrorMessage] = useState<string | null>(null);