import { useTranslation } from "react-i18next"; import { createToolFlow } from "@app/components/tools/shared/createToolFlow"; import CardSelector from "@app/components/shared/CardSelector"; import SplitSettings from "@app/components/tools/split/SplitSettings"; import { useSplitParameters } from "@app/hooks/tools/split/useSplitParameters"; import { useSplitOperation } from "@app/hooks/tools/split/useSplitOperation"; import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool"; import { useSplitMethodTips } from "@app/components/tooltips/useSplitMethodTips"; import { useSplitSettingsTips } from "@app/components/tooltips/useSplitSettingsTips"; import { BaseToolProps, ToolComponent } from "@app/types/tool"; import { type SplitMethod, METHOD_OPTIONS, type MethodOption } from "@app/constants/splitConstants"; const Split = (props: BaseToolProps) => { const { t } = useTranslation(); const base = useBaseTool( 'split', useSplitParameters, useSplitOperation, props ); const methodTips = useSplitMethodTips(); const allSettingsTips = useSplitSettingsTips(); // Get tooltip content for the currently selected method const settingsTips = base.params.parameters.method ? allSettingsTips[base.params.parameters.method] : null; // Get tooltip content for a specific method const getMethodTooltip = (option: MethodOption) => { const tooltipContent = allSettingsTips[option.value]; return tooltipContent?.tips || []; }; // Get the method name for the settings step title const getSettingsTitle = () => { if (!base.params.parameters.method) return t("split.steps.settings", "Settings"); const methodOption = METHOD_OPTIONS.find(option => option.value === base.params.parameters.method); if (!methodOption) return t("split.steps.settings", "Settings"); const prefix = t(methodOption.prefixKey, "Split by"); const name = t(methodOption.nameKey, "Method Name"); return `${prefix} ${name}`; }; return createToolFlow({ files: { selectedFiles: base.selectedFiles, isCollapsed: base.hasResults, }, steps: [ { title: t("split.steps.chooseMethod", "Choose Method"), isCollapsed: !!base.params.parameters.method, // Collapse when method is selected onCollapsedClick: () => base.params.updateParameter('method', ''), tooltip: methodTips, content: ( options={METHOD_OPTIONS} onSelect={(method) => base.params.updateParameter('method', method)} disabled={base.endpointLoading} getTooltipContent={getMethodTooltip} /> ), }, { title: getSettingsTitle(), isCollapsed: !base.params.parameters.method, // Collapsed until method selected onCollapsedClick: base.hasResults ? base.handleSettingsReset : undefined, tooltip: settingsTips || undefined, content: ( ), }, ], executeButton: { text: t("split.submit", "Split PDF"), loadingText: t("loading"), onClick: base.handleExecute, isVisible: !base.hasResults, disabled: !base.params.validateParameters() || !base.hasFiles || !base.endpointEnabled, }, review: { isVisible: base.hasResults, operation: base.operation, title: t("split.resultsTitle", "Split Results"), onFileClick: base.handleThumbnailClick, onUndo: base.handleUndo, }, }); }; export default Split as ToolComponent;