Refactor to use nullish coalescing and add missing React imports

Replaced many uses of logical OR (||) with nullish coalescing (??) for more accurate handling of undefined/null values. Added missing explicit React imports to various component files to ensure compatibility with tooling and future React versions. Also updated some async function calls to use 'void' for better type safety and intent clarity. Minor whitespace and formatting adjustments included.

frontend/src/components/tools/addStamp/StampPreview.tsx

@@ -72,7 +72,7 @@ export default function StampPreview({ parameters, onParameterChange, file, show
         if (!cancelled) setPageSize(null);
       }
     };
-    load();
+    void load();
     return () => { cancelled = true; };
   }, [file]);
 
@@ -88,12 +88,12 @@ export default function StampPreview({ parameters, onParameterChange, file, show
         const pageNumber = Math.max(1, getFirstSelectedPage(parameters.pageNumbers));
         const pageId = `${file.name}:${file.size}:${file.lastModified}:page:${pageNumber}`;
         const thumb = await requestThumbnail(pageId, file, pageNumber);
-        if (isActive) setPageThumbnail(thumb || null);
+        if (isActive) setPageThumbnail(thumb ?? null);
       } catch {
         if (isActive) setPageThumbnail(null);
       }
     };
-    loadThumb();
+    void loadThumb();
     return () => { isActive = false; };
   }, [file, parameters.pageNumbers, requestThumbnail]);
 
@@ -189,7 +189,7 @@ export default function StampPreview({ parameters, onParameterChange, file, show
 
     draggingRef.current = {
       type,
-      startX: e.clientX - (rect?.left || 0),
+      startX: e.clientX - (rect?.left ?? 0),
       startY: (rect ? rect.bottom - e.clientY : 0), // convert to bottom-based coords
       initLeft: left,
       initBottom: bottom,
@@ -255,11 +255,11 @@ export default function StampPreview({ parameters, onParameterChange, file, show
         <div className={styles.divider} />
         <div className={styles.previewLabel}>Preview Stamp</div>
       </div>
-      <div 
+      <div
-        ref={containerRef} 
+        ref={containerRef}
         className={`${styles.container} ${styles.containerBorder} ${pageThumbnail ? styles.containerWithThumbnail : styles.containerWithoutThumbnail}`}
-        style={style.container as React.CSSProperties} 
+        style={style.container as React.CSSProperties}
-        onPointerMove={handlePointerMove} 
+        onPointerMove={handlePointerMove}
         onPointerUp={handlePointerUp}
       >
         {pageThumbnail && (

frontend/src/components/tools/addStamp/useAddStampOperation.ts

@@ -7,7 +7,7 @@ export const buildAddStampFormData = (parameters: AddStampParameters, file: File
   const formData = new FormData();
   formData.append('fileInput', file);
   formData.append('pageNumbers', parameters.pageNumbers);
-  formData.append('customMargin', parameters.customMargin || 'medium'); 
+  formData.append('customMargin', parameters.customMargin || 'medium');
   formData.append('position', String(parameters.position));
   const effectiveFontSize = parameters.fontSize;
   formData.append('fontSize', String(effectiveFontSize));
@@ -19,7 +19,7 @@ export const buildAddStampFormData = (parameters: AddStampParameters, file: File
   formData.append('alphabet', parameters.alphabet);
 
   // Stamp type and payload
-  formData.append('stampType', parameters.stampType || 'text');
+  formData.append('stampType', parameters.stampType ?? 'text');
   if (parameters.stampType === 'text') {
     formData.append('stampText', parameters.stampText);
   } else if (parameters.stampType === 'image' && parameters.stampImage) {

frontend/src/components/tools/addWatermark/WatermarkImageFile.tsx

@@ -17,7 +17,7 @@ const WatermarkImageFile = ({ parameters, onParameterChange, disabled = false }:
     <Stack gap="sm">
       <FileUploadButton
         file={parameters.watermarkImage}
-        onChange={(file) => onParameterChange('watermarkImage', file || undefined)}
+        onChange={(file) => onParameterChange('watermarkImage', file ?? undefined)}
         accept="image/*"
         disabled={disabled}
         placeholder={t('watermark.settings.image.choose', 'Choose Image')}

frontend/src/components/tools/addWatermark/WatermarkTypeSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { useTranslation } from "react-i18next";
 import ButtonSelector from "../../shared/ButtonSelector";
 

frontend/src/components/tools/adjustPageScale/AdjustPageScaleSettings.test.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { describe, expect, test, vi, beforeEach } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import { MantineProvider } from '@mantine/core';

frontend/src/components/tools/adjustPageScale/AdjustPageScaleSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, NumberInput, Select } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { AdjustPageScaleParameters, PageSize } from "../../../hooks/tools/adjustPageScale/useAdjustPageScaleParameters";

frontend/src/components/tools/automate/AutomationCreation.tsx

@@ -1,4 +1,4 @@
-import { useState } from 'react';
+import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import {
   Button,
@@ -100,7 +100,7 @@ export default function AutomationCreation({ mode, existingAutomation, onBack, o
       icon: automationIcon,
       operations: selectedTools.map(tool => ({
         operation: tool.operation,
-        parameters: tool.parameters || {}
+        parameters: tool.parameters ?? {}
       }))
     };
 

frontend/src/components/tools/automate/AutomationEntry.tsx

@@ -240,7 +240,7 @@ export default function AutomationEntry({
   );
 
   // Show tooltip if there's a description OR operations to display
-  const shouldShowTooltip = description || operations.length > 0;
+  const shouldShowTooltip = description ?? operations.length > 0;
 
   return shouldShowTooltip ? (
     <Tooltip

frontend/src/components/tools/automate/AutomationRun.tsx

@@ -26,7 +26,7 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
   const [currentStepIndex, setCurrentStepIndex] = useState(-1);
 
   // Use the operation hook's loading state
-  const isExecuting = automateOperation?.isLoading || false;
+  const isExecuting = automateOperation?.isLoading ?? false;
   const hasResults = automateOperation?.files.length > 0 || automateOperation?.downloadUrl !== null;
 
   // Initialize execution steps from automation
@@ -194,7 +194,7 @@ export default function AutomationRun({ automation, onComplete, automateOperatio
           <Button
             leftSection={<PlayArrowIcon />}
             onClick={executeAutomation}
-            disabled={isExecuting || !selectedFiles || selectedFiles.length === 0}
+            disabled={(isExecuting ?? !selectedFiles) ?? selectedFiles.length === 0}
             loading={isExecuting}
           >
             {isExecuting

frontend/src/components/tools/automate/ToolConfigurationModal.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react';
+import React, { useState, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import {
   Modal,

frontend/src/components/tools/automate/ToolSelector.tsx

@@ -1,4 +1,4 @@
-import { useState, useMemo, useCallback, useRef, useEffect } from 'react';
+import React, { useState, useMemo, useCallback, useRef, useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Stack, Text, ScrollArea } from '@mantine/core';
 import { ToolRegistryEntry } from '../../../data/toolsTaxonomy';
@@ -82,7 +82,7 @@ export default function ToolSelector({
 
     // Find the "all" section which contains all tools without duplicates
     const allSection = sections.find(s => (s as any).key === 'all');
-    return allSection?.subcategories || [];
+    return allSection?.subcategories ?? [];
   }, [isSearching, searchGroups, sections, baseFilteredTools]);
 
   const handleToolSelect = useCallback((toolKey: string) => {
@@ -138,7 +138,7 @@ export default function ToolSelector({
     if (selectedValue && toolRegistry[selectedValue]) {
       return toolRegistry[selectedValue].name;
     }
-    return placeholder || t('automate.creation.tools.add', 'Add a tool...');
+    return placeholder ?? t('automate.creation.tools.add', 'Add a tool...');
   };
 
   return (

frontend/src/components/tools/certSign/CertificateFilesSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, Text, TextInput } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { CertSignParameters } from "../../../hooks/tools/certSign/useCertSignParameters";
@@ -19,7 +20,7 @@ const CertificateFilesSettings = ({ parameters, onParameterChange, disabled = fa
         <Stack gap="sm">
           <FileUploadButton
             file={parameters.privateKeyFile}
-            onChange={(file) => onParameterChange('privateKeyFile', file || undefined)}
+            onChange={(file) => onParameterChange('privateKeyFile', file ?? undefined)}
             accept=".pem,.der,.key"
             disabled={disabled}
             placeholder={t('certSign.choosePrivateKey', 'Choose Private Key File')}
@@ -27,7 +28,7 @@ const CertificateFilesSettings = ({ parameters, onParameterChange, disabled = fa
           {parameters.privateKeyFile && (
             <FileUploadButton
               file={parameters.certFile}
-              onChange={(file) => onParameterChange('certFile', file || undefined)}
+              onChange={(file) => onParameterChange('certFile', file ?? undefined)}
               accept=".pem,.der,.crt,.cer"
               disabled={disabled}
               placeholder={t('certSign.chooseCertificate', 'Choose Certificate File')}
@@ -39,7 +40,7 @@ const CertificateFilesSettings = ({ parameters, onParameterChange, disabled = fa
       {parameters.certType === 'PKCS12' && (
         <FileUploadButton
           file={parameters.p12File}
-          onChange={(file) => onParameterChange('p12File', file || undefined)}
+          onChange={(file) => onParameterChange('p12File', file ?? undefined)}
           accept=".p12"
           disabled={disabled}
           placeholder={t('certSign.chooseP12File', 'Choose PKCS12 File')}
@@ -49,7 +50,7 @@ const CertificateFilesSettings = ({ parameters, onParameterChange, disabled = fa
       {parameters.certType === 'PFX' && (
         <FileUploadButton
           file={parameters.p12File}
-          onChange={(file) => onParameterChange('p12File', file || undefined)}
+          onChange={(file) => onParameterChange('p12File', file ?? undefined)}
           accept=".pfx"
           disabled={disabled}
           placeholder={t('certSign.choosePfxFile', 'Choose PFX File')}
@@ -59,7 +60,7 @@ const CertificateFilesSettings = ({ parameters, onParameterChange, disabled = fa
       {parameters.certType === 'JKS' && (
         <FileUploadButton
           file={parameters.jksFile}
-          onChange={(file) => onParameterChange('jksFile', file || undefined)}
+          onChange={(file) => onParameterChange('jksFile', file ?? undefined)}
           accept=".jks,.keystore"
           disabled={disabled}
           placeholder={t('certSign.chooseJksFile', 'Choose JKS File')}
@@ -74,9 +75,9 @@ const CertificateFilesSettings = ({ parameters, onParameterChange, disabled = fa
 
       {/* Password - only show when files are uploaded */}
       {parameters.certType && (
-        (parameters.certType === 'PEM' && parameters.privateKeyFile && parameters.certFile) ||
+        (parameters.certType === 'PEM' && parameters.privateKeyFile && parameters.certFile) ??
-        (parameters.certType === 'PKCS12' && parameters.p12File) ||
+        (parameters.certType === 'PKCS12' && parameters.p12File) ??
-        (parameters.certType === 'PFX' && parameters.p12File) ||
+        (parameters.certType === 'PFX' && parameters.p12File) ??
         (parameters.certType === 'JKS' && parameters.jksFile)
       ) && (
         <TextInput
@@ -92,4 +93,4 @@ const CertificateFilesSettings = ({ parameters, onParameterChange, disabled = fa
   );
 };
 
-export default CertificateFilesSettings;
+export default CertificateFilesSettings;

frontend/src/components/tools/certSign/CertificateFormatSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, Button } from "@mantine/core";
 import { CertSignParameters } from "../../../hooks/tools/certSign/useCertSignParameters";
 

frontend/src/components/tools/certSign/CertificateTypeSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, Button } from "@mantine/core";
 import { CertSignParameters } from "../../../hooks/tools/certSign/useCertSignParameters";
 import { useAppConfig } from "../../../hooks/useAppConfig";

frontend/src/components/tools/certSign/SignatureAppearanceSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, Text, Button, TextInput, NumberInput } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { CertSignParameters } from "../../../hooks/tools/certSign/useCertSignParameters";

frontend/src/components/tools/changeMetadata/ChangeMetadataSingleStep.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, Divider, Text } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { ChangeMetadataParameters, createCustomMetadataFunctions } from "../../../hooks/tools/changeMetadata/useChangeMetadataParameters";

frontend/src/components/tools/changeMetadata/steps/AdvancedOptionsStep.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, Select, Divider } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { ChangeMetadataParameters } from "../../../../hooks/tools/changeMetadata/useChangeMetadataParameters";

frontend/src/components/tools/changeMetadata/steps/CustomMetadataStep.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, TextInput, Button, Group, Text } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { ChangeMetadataParameters } from "../../../../hooks/tools/changeMetadata/useChangeMetadataParameters";

frontend/src/components/tools/changeMetadata/steps/DeleteAllStep.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Checkbox } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { ChangeMetadataParameters } from "../../../../hooks/tools/changeMetadata/useChangeMetadataParameters";

frontend/src/components/tools/changeMetadata/steps/DocumentDatesStep.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack } from "@mantine/core";
 import { DateTimePicker } from "@mantine/dates";
 import { useTranslation } from "react-i18next";

frontend/src/components/tools/changeMetadata/steps/StandardMetadataStep.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, TextInput } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { ChangeMetadataParameters } from "../../../../hooks/tools/changeMetadata/useChangeMetadataParameters";

frontend/src/components/tools/changePermissions/ChangePermissionsSettings.test.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { describe, expect, test, vi, beforeEach } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
 import { MantineProvider } from '@mantine/core';

frontend/src/components/tools/changePermissions/ChangePermissionsSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, Checkbox } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { ChangePermissionsParameters } from "../../../hooks/tools/changePermissions/useChangePermissionsParameters";

frontend/src/components/tools/convert/ConvertToPdfaSettings.tsx

@@ -44,7 +44,7 @@ const ConvertToPdfaSettings = ({
           value={parameters.pdfaOptions.outputFormat}
           onChange={(value) => onParameterChange('pdfaOptions', {
             ...parameters.pdfaOptions,
-            outputFormat: value || 'pdfa-1'
+            outputFormat: value ?? 'pdfa-1'
           })}
           data={pdfaFormatOptions}
           disabled={disabled || isChecking}

frontend/src/components/tools/crop/CropSettings.tsx

@@ -1,4 +1,4 @@
-import { useMemo, useState, useEffect } from "react";
+import React, { useMemo, useState, useEffect } from "react";
 import { Stack, Text, Box, Group, NumberInput, ActionIcon, Center, Alert } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import RestartAltIcon from "@mui/icons-material/RestartAlt";
@@ -48,7 +48,7 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
         return;
       }
 
-      setThumbnail(selectedStub.thumbnailUrl || null);
+      setThumbnail(selectedStub.thumbnailUrl ?? null);
 
       try {
         // Get PDF dimensions from the actual file
@@ -89,7 +89,7 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => {
       }
     };
 
-    loadPDFDimensions();
+    void loadPDFDimensions();
   }, [selectedStub, selectedFile, parameters]);
 
   // Current crop area

frontend/src/components/tools/flatten/FlattenSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, Text, Checkbox } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { FlattenParameters } from "../../../hooks/tools/flatten/useFlattenParameters";

frontend/src/components/tools/merge/MergeFileSorter.test.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { describe, expect, test, vi, beforeEach } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
 import { MantineProvider } from '@mantine/core';

frontend/src/components/tools/merge/MergeSettings.test.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { describe, expect, test, vi, beforeEach } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
 import { MantineProvider } from '@mantine/core';

frontend/src/components/tools/ocr/LanguagePicker.tsx

@@ -75,7 +75,7 @@ const LanguagePicker: React.FC<LanguagePickerProps> = ({
       }
     };
 
-    fetchLanguages();
+    void fetchLanguages();
   }, [languagesEndpoint]);
 
   // Auto-fill OCR language based on browser language when languages are loaded

frontend/src/components/tools/ocr/OCRSettings.tsx

@@ -23,7 +23,7 @@ const OCRSettings: React.FC<OCRSettingsProps> = ({
       <Select
         label={t('ocr.settings.ocrMode.label', 'OCR Mode')}
         value={parameters.ocrType}
-        onChange={(value) => onParameterChange('ocrType', value || 'skip-text')}
+        onChange={(value) => onParameterChange('ocrType', value ?? 'skip-text')}
         data={[
           { value: 'skip-text', label: t('ocr.settings.ocrMode.auto', 'Auto (skip text layers)') },
           { value: 'force-ocr', label: t('ocr.settings.ocrMode.force', 'Force (re-OCR all, replace text)') },

frontend/src/components/tools/redact/RedactAdvancedSettings.test.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { describe, expect, test, vi, beforeEach } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
 import { MantineProvider } from '@mantine/core';

frontend/src/components/tools/redact/RedactAdvancedSettings.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { Stack, NumberInput, ColorInput, Checkbox } from "@mantine/core";
 import { useTranslation } from "react-i18next";
 import { RedactParameters } from "../../../hooks/tools/redact/useRedactParameters";

frontend/src/components/tools/redact/RedactModeSelector.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { RedactMode } from '../../../hooks/tools/redact/useRedactParameters';
 import ButtonSelector from '../../shared/ButtonSelector';

frontend/src/components/tools/redact/RedactSingleStepSettings.test.tsx

@@ -1,3 +1,4 @@
+import React from 'react';
 import { describe, expect, test, vi, beforeEach } from 'vitest';
 import { render, screen, fireEvent } from '@testing-library/react';
 import { MantineProvider } from '@mantine/core';

frontend/src/components/viewer/SearchInterface.tsx

@@ -80,7 +80,7 @@ export function SearchInterface({ visible, onClose }: SearchInterfaceProps) {
 
   const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
     if (event.key === 'Enter') {
-      handleSearch(searchQuery);
+      void handleSearch(searchQuery);
     } else if (event.key === 'Escape') {
       onClose();
     }

frontend/src/components/viewer/ThumbnailSidebar.tsx

@@ -65,7 +65,7 @@ export function ThumbnailSidebar({ visible, onToggle: _onToggle }: ThumbnailSide
       }
     };
 
-    generateThumbnails();
+    void generateThumbnails();
   }, [visible, scrollState.totalPages, thumbnailAPI]);
 
   const handlePageClick = (pageIndex: number) => {

frontend/src/contexts/FilesModalContext.tsx

@@ -43,7 +43,7 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
       customHandler(files, insertAfterPage);
     } else {
       // Use normal file handling
-      addFiles(files);
+      void addFiles(files);
     }
     closeFilesModal();
   }, [addFiles, closeFilesModal, insertAfterPage, customHandler]);
@@ -59,7 +59,7 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
             loadedFiles.push(stirlingFile);
           }
         }
-        
+
         if (loadedFiles.length > 0) {
           customHandler(loadedFiles, insertAfterPage);
         }
@@ -69,7 +69,11 @@ export const FilesModalProvider: React.FC<{ children: React.ReactNode }> = ({ ch
     } else {
       // Normal case - use addStirlingFileStubs to preserve metadata
       if (actions.addStirlingFileStubs) {
-        actions.addStirlingFileStubs(stirlingFileStubs, { selectFiles: true });
+        try {
+          await actions.addStirlingFileStubs(stirlingFileStubs, { selectFiles: true });
+        } catch (error) {
+          console.error('Error adding Stirling file stubs:', error);
+        }
       } else {
         console.error('addStirlingFileStubs action not available');
       }

frontend/src/hooks/tools/automate/useSavedAutomations.ts

@@ -26,7 +26,7 @@ export function useSavedAutomations() {
   }, []);
 
   const refreshAutomations = useCallback(() => {
-    loadSavedAutomations();
+    void loadSavedAutomations();
   }, [loadSavedAutomations]);
 
   const deleteAutomation = useCallback(async (id: string) => {
@@ -80,7 +80,7 @@ export function useSavedAutomations() {
 
   // Load automations on mount
   useEffect(() => {
-    loadSavedAutomations();
+    void loadSavedAutomations();
   }, [loadSavedAutomations]);
 
   return {

frontend/src/hooks/tools/changeMetadata/useMetadataExtraction.ts

@@ -60,7 +60,7 @@ export const useMetadataExtraction = (params: MetadataExtractionParams) => {
       setIsExtractingMetadata(false);
     };
 
-    extractMetadata();
+    void extractMetadata();
   }, [selectedFiles, hasExtractedMetadata, params]);
 
   return {

frontend/src/hooks/useAppConfig.ts

@@ -65,7 +65,7 @@ export function useAppConfig(): UseAppConfigReturn {
   };
 
   useEffect(() => {
-    fetchConfig();
+    void fetchConfig();
   }, []);
 
   return {

frontend/src/hooks/useEndpointConfig.ts

@@ -41,7 +41,7 @@ export function useEndpointEnabled(endpoint: string): {
   };
 
   useEffect(() => {
-    fetchEndpointStatus();
+    void fetchEndpointStatus();
   }, [endpoint]);
 
   return {
@@ -105,7 +105,7 @@ export function useMultipleEndpointsEnabled(endpoints: string[]): {
   };
 
   useEffect(() => {
-    fetchAllEndpointStatuses();
+    void fetchAllEndpointStatuses();
   }, [endpoints.join(',')]); // Re-run when endpoints array changes
 
   return {

frontend/src/hooks/useEnhancedProcessedFiles.ts

@@ -104,7 +104,7 @@ export function useEnhancedProcessedFiles(
       }
     };
 
-    processFiles();
+    void processFiles();
   }, [activeFiles]); // Only depend on activeFiles to avoid infinite loops
 
   // Listen for processing completion

frontend/src/hooks/useIndexedDBThumbnail.ts

@@ -2,7 +2,6 @@ import { useState, useEffect } from "react";
 import { StirlingFileStub } from "../types/fileContext";
 import { useIndexedDB } from "../contexts/IndexedDBContext";
 import { generateThumbnailForFile } from "../utils/thumbnailUtils";
-import { FileId } from "../types/fileContext";
 
 
 /**
@@ -75,7 +74,7 @@ export function useIndexedDBThumbnail(file: StirlingFileStub | undefined | null)
       }
     }
 
-    loadThumbnail();
+    void loadThumbnail();
     return () => { cancelled = true; };
   }, [file, file?.thumbnailUrl, file?.id, indexedDB, generating]);
 

frontend/src/hooks/usePdfSignatureDetection.ts

@@ -58,7 +58,7 @@ export const usePdfSignatureDetection = (files: StirlingFile[]): PdfSignatureDet
       setIsChecking(false);
     };
 
-    checkForDigitalSignatures();
+    void checkForDigitalSignatures();
   }, [files]);
 
   return {

frontend/src/hooks/useProcessedFiles.ts

@@ -36,7 +36,7 @@ export function useProcessedFiles(activeFiles: File[]): UseProcessedFilesResult
       setProcessedFiles(newProcessedFiles);
     };
 
-    checkProcessing();
+    void checkProcessing();
 
     return unsubscribe;
   }, [activeFiles]);

frontend/src/i18n.ts

@@ -52,7 +52,7 @@ export const supportedLanguages = {
 // RTL languages (based on your existing language.direction property)
 export const rtlLanguages = ['ar-AR', 'fa-IR'];
 
-i18n
+void i18n
   .use(Backend)
   .use(LanguageDetector)
   .use(initReactI18next)

frontend/src/i18n/config.ts

@@ -2,7 +2,7 @@ import i18n from 'i18next';
 import { initReactI18next } from 'react-i18next';
 import Backend from 'i18next-http-backend';
 
-i18n
+void i18n
   .use(Backend)
   .use(initReactI18next)
   .init({
@@ -29,7 +29,7 @@ i18n
           'convert.singleOrMultiple': 'Output',
           'convert.emailNote': 'Email attachments and embedded images will be included',
           'common.color': 'Color',
-          'common.grayscale': 'Grayscale', 
+          'common.grayscale': 'Grayscale',
           'common.blackWhite': 'Black & White',
           'common.single': 'Single Image',
           'common.multiple': 'Multiple Images',
@@ -45,4 +45,4 @@ i18n
     }
   });
 
-export default i18n;
+export default i18n;

frontend/src/services/enhancedPDFProcessingService.ts

@@ -70,7 +70,7 @@ export class EnhancedPDFProcessingService {
     };
 
     // Start processing
-    this.startProcessing(file, fileKey, config, analysis.estimatedProcessingTime);
+    await this.startProcessing(file, fileKey, config, analysis.estimatedProcessingTime);
     return null;
   }
 

frontend/src/services/fileProcessingService.ts

@@ -60,7 +60,7 @@ class FileProcessingService {
     this.processingCache.set(fileId, operation);
 
     // Clean up cache after completion
-    processingPromise.finally(() => {
+    void processingPromise.finally(() => {
       this.processingCache.delete(fileId);
     });
 

frontend/src/services/fileStorage.ts

@@ -78,7 +78,7 @@ class FileStorageService {
 
         request.onerror = () => {
           console.error('IndexedDB add error:', request.error);
-          reject(new Error(request.error?.message || 'Unknown error occurred'));
+          reject(new Error(request.error?.message ?? 'Unknown error occurred'));
         };
         request.onsuccess = () => {
           resolve();
@@ -101,7 +101,7 @@ class FileStorageService {
       const store = transaction.objectStore(this.storeName);
       const request = store.get(id);
 
-      request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+      request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       request.onsuccess = () => {
         const record = request.result as StoredStirlingFileRecord | undefined;
         if (!record) {
@@ -142,7 +142,7 @@ class FileStorageService {
       const store = transaction.objectStore(this.storeName);
       const request = store.get(id);
 
-      request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+      request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       request.onsuccess = () => {
         const record = request.result as StoredStirlingFileRecord | undefined;
         if (!record) {
@@ -184,7 +184,7 @@ class FileStorageService {
       const request = store.openCursor();
       const stubs: StirlingFileStub[] = [];
 
-      request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+      request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       request.onsuccess = (event) => {
         const cursor = (event.target as IDBRequest).result;
         if (cursor) {
@@ -227,7 +227,7 @@ class FileStorageService {
       const request = store.openCursor();
       const leafStubs: StirlingFileStub[] = [];
 
-      request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+      request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       request.onsuccess = (event) => {
         const cursor = (event.target as IDBRequest).result;
         if (cursor) {
@@ -269,7 +269,7 @@ class FileStorageService {
       const store = transaction.objectStore(this.storeName);
       const request = store.delete(id);
 
-      request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+      request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       request.onsuccess = () => resolve();
     });
   }
@@ -326,7 +326,7 @@ class FileStorageService {
       const store = transaction.objectStore(this.storeName);
       const request = store.clear();
 
-      request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+      request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       request.onsuccess = () => resolve();
     });
   }
@@ -384,7 +384,7 @@ class FileStorageService {
         const store = transaction.objectStore(this.storeName);
         const request = store.get(id);
 
-        request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+        request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
         request.onsuccess = () => {
           const record = request.result as StoredStirlingFileRecord | undefined;
           if (record) {
@@ -415,7 +415,7 @@ class FileStorageService {
       const record = await new Promise<StoredStirlingFileRecord | undefined>((resolve, reject) => {
         const request = store.get(fileId);
         request.onsuccess = () => resolve(request.result);
-        request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+        request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       });
 
       if (!record) {
@@ -428,7 +428,7 @@ class FileStorageService {
       await new Promise<void>((resolve, reject) => {
         const request = store.put(record);
         request.onsuccess = () => resolve();
-        request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+        request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       });
 
       return true;
@@ -451,7 +451,7 @@ class FileStorageService {
       const record = await new Promise<StoredStirlingFileRecord | undefined>((resolve, reject) => {
         const request = store.get(fileId);
         request.onsuccess = () => resolve(request.result);
-        request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+        request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       });
 
       if (!record) {
@@ -464,7 +464,7 @@ class FileStorageService {
       await new Promise<void>((resolve, reject) => {
         const request = store.put(record);
         request.onsuccess = () => resolve();
-        request.onerror = () => reject(new Error(request.error?.message || 'Unknown error occurred'));
+        request.onerror = () => reject(new Error(request.error?.message ?? 'Unknown error occurred'));
       });
 
       return true;

frontend/src/services/indexedDBManager.ts

@@ -67,7 +67,7 @@ class IndexedDBManager {
 
       request.onerror = () => {
         console.error(`Failed to open ${config.name}:`, request.error);
-        reject(new Error(request.error?.message || 'Unknown error occurred while opening the database'));
+        reject(new Error(request.error?.message ?? 'Unknown error occurred while opening the database'));
       };
 
       request.onsuccess = () => {
@@ -257,7 +257,7 @@ class IndexedDBManager {
     return new Promise((resolve, reject) => {
       const deleteRequest = indexedDB.deleteDatabase(name);
 
-      deleteRequest.onerror = () => reject(new Error(deleteRequest.error?.message || 'Unknown error occurred while deleting the database'));
+      deleteRequest.onerror = () => reject(new Error(deleteRequest.error?.message ?? 'Unknown error occurred while deleting the database'));
       deleteRequest.onsuccess = () => {
         console.log(`Deleted database: ${name}`);
         resolve();

frontend/src/services/pdfProcessingService.ts

@@ -35,7 +35,7 @@ export class PDFProcessingService {
     }
 
     // Start processing
-    this.startProcessing(file, fileKey);
+    void this.startProcessing(file, fileKey);
     return null;
   }
 

frontend/src/services/pdfWorkerManager.ts

@@ -94,7 +94,7 @@ class PDFWorkerManager {
       // If document creation fails, make sure to clean up the loading task
       if (loadingTask) {
         try {
-          loadingTask.destroy();
+          await loadingTask.destroy();
         } catch {
           // Ignore errors
         }
@@ -109,7 +109,7 @@ class PDFWorkerManager {
   destroyDocument(pdf: PDFDocumentProxy): void {
     if (this.activeDocuments.has(pdf)) {
       try {
-        pdf.destroy();
+        void pdf.destroy();
         this.activeDocuments.delete(pdf);
         this.workerCount = Math.max(0, this.workerCount - 1);
       } catch {
@@ -167,7 +167,7 @@ class PDFWorkerManager {
     // Force destroy all documents
     this.activeDocuments.forEach(pdf => {
       try {
-        pdf.destroy();
+        void pdf.destroy();
       } catch {
         // Ignore errors
       }

frontend/src/tools/AdjustPageScale.tsx

@@ -52,7 +52,7 @@ const AdjustPageScale = (props: BaseToolProps) => {
       title: t("adjustPageScale.title", "Page Scale Results"),
       onFileClick: base.handleThumbnailClick,
       onUndo: () => {
-        base.handleUndo();
+        void base.handleUndo();
       },
     },
   });

frontend/src/tools/Crop.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { useTranslation } from "react-i18next";
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
 import CropSettings from "../components/tools/crop/CropSettings";

frontend/src/tools/RemovePassword.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { useTranslation } from "react-i18next";
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
 import RemovePasswordSettings from "../components/tools/removePassword/RemovePasswordSettings";

frontend/src/tools/Rotate.tsx

@@ -1,3 +1,4 @@
+import React from "react";
 import { useTranslation } from "react-i18next";
 import { createToolFlow } from "../components/tools/shared/createToolFlow";
 import RotateSettings from "../components/tools/rotate/RotateSettings";