Tools/ocr/v2 (#4055)

# Description of Changes - Added the OCR tool - Added language mappings file to map selected browser language -> OCR language and OCR language codes -> english display values. TODO: Use the translation function to translate the languages rather than mapping them to english be default - Added chevron icons to tool step to show expand and collapsed state more visibly - Added a re-usable dropdown picker with a footer component --- ## Checklist ### General - [ ] I have read the [Contribution Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md) - [ ] I have read the [Stirling-PDF Developer Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md) (if applicable) - [ ] I have read the [How to add new languages to Stirling-PDF](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md) (if applicable) - [ ] I have performed a self-review of my own code - [ ] My changes generate no new warnings ### Documentation - [ ] I have updated relevant docs on [Stirling-PDF's doc repo](https://github.com/Stirling-Tools/Stirling-Tools.github.io/blob/main/docs/) (if functionality has heavily changed) - [ ] I have read the section [Add New Translation Tags](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/HowToAddNewLanguage.md#add-new-translation-tags) (for new translation tags only) ### UI Changes (if applicable) - [ ] Screenshots or videos demonstrating the UI changes are attached (e.g., as comments or direct attachments in the PR) ### Testing (if applicable) - [ ] I have tested my changes locally. Refer to the [Testing Guide](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/devGuide/DeveloperGuide.md#6-testing) for more details. --------- Co-authored-by: Anthony Stirling <[email protected]>
2026-07-16 19:33:11 +02:00 · 2025-08-01 14:22:19 +01:00
parent 8802daf67f
commit 8881f19b03
17 changed files with 2421 additions and 51 deletions
@@ -0,0 +1,90 @@
+import React from 'react';
+import { Stack, Text, Checkbox } from '@mantine/core';
+import { useTranslation } from 'react-i18next';
+import { OCRParameters } from './OCRSettings';
+
+export interface AdvancedOCRParameters {
+  advancedOptions: string[];
+}
+
+interface AdvancedOption {
+  value: string;
+  label: string;
+  isSpecial: boolean;
+}
+
+interface AdvancedOCRSettingsProps {
+  advancedOptions: string[];
+  ocrRenderType?: string;
+  onParameterChange: (key: keyof OCRParameters, value: any) => void;
+  disabled?: boolean;
+}
+
+const AdvancedOCRSettings: React.FC<AdvancedOCRSettingsProps> = ({
+  advancedOptions,
+  ocrRenderType = 'hocr',
+  onParameterChange,
+  disabled = false
+}) => {
+  const { t } = useTranslation();
+
+  // Define the advanced options available
+  const advancedOptionsData: AdvancedOption[] = [
+    { value: 'compatibilityMode', label: t('ocr.settings.compatibilityMode.label', 'Compatibility Mode'), isSpecial: true },
+    { value: 'sidecar', label: t('ocr.settings.advancedOptions.sidecar', 'Create a text file'), isSpecial: false },
+    { value: 'deskew', label: t('ocr.settings.advancedOptions.deskew', 'Deskew pages'), isSpecial: false },
+    { value: 'clean', label: t('ocr.settings.advancedOptions.clean', 'Clean input file'), isSpecial: false },
+    { value: 'cleanFinal', label: t('ocr.settings.advancedOptions.cleanFinal', 'Clean final output'), isSpecial: false },
+  ];
+
+  // Handle individual checkbox changes
+  const handleCheckboxChange = (optionValue: string, checked: boolean) => {
+    const option = advancedOptionsData.find(opt => opt.value === optionValue);
+    
+    if (option?.isSpecial) {
+      // Handle special options (like compatibility mode) differently
+      if (optionValue === 'compatibilityMode') {
+        onParameterChange('ocrRenderType', checked ? 'sandwich' : 'hocr');
+      }
+    } else {
+      // Handle regular advanced options
+      const newOptions = checked
+        ? [...advancedOptions, optionValue]
+        : advancedOptions.filter(option => option !== optionValue);
+      onParameterChange('additionalOptions', newOptions);
+    }
+  };
+
+  // Check if a special option is selected
+  const isSpecialOptionSelected = (optionValue: string) => {
+    if (optionValue === 'compatibilityMode') {
+      return ocrRenderType === 'sandwich';
+    }
+    return false;
+  };
+
+  return (
+    <Stack gap="md">
+      <div>
+        <Text size="sm" fw={500} mb="md">
+          {t('ocr.settings.advancedOptions.label', 'Processing Options')}
+        </Text>
+        
+        <Stack gap="sm">
+          {advancedOptionsData.map((option) => (
+            <Checkbox
+              key={option.value}
+              checked={option.isSpecial ? isSpecialOptionSelected(option.value) : advancedOptions.includes(option.value)}
+              onChange={(event) => handleCheckboxChange(option.value, event.currentTarget.checked)}
+              label={option.label}
+              disabled={disabled}
+              size="sm"
+            />
+          ))}
+        </Stack>
+      </div>
+    </Stack>
+  );
+};
+
+export default AdvancedOCRSettings;