diff --git a/frontend/public/locales/en-GB/translation.toml b/frontend/public/locales/en-GB/translation.toml index 3b7797f9e..3bb44b13e 100644 --- a/frontend/public/locales/en-GB/translation.toml +++ b/frontend/public/locales/en-GB/translation.toml @@ -2968,6 +2968,7 @@ header = "Crop PDF" submit = "Apply Crop" noFileSelected = "Select a PDF file to begin cropping" reset = "Reset to full PDF" +autoCrop = "Auto-crop whitespace" [crop.preview] title = "Crop Area Selection" diff --git a/frontend/src/core/components/tools/crop/CropSettings.tsx b/frontend/src/core/components/tools/crop/CropSettings.tsx index fae3afe57..441186e03 100644 --- a/frontend/src/core/components/tools/crop/CropSettings.tsx +++ b/frontend/src/core/components/tools/crop/CropSettings.tsx @@ -1,5 +1,5 @@ import { useMemo, useState, useEffect } from "react"; -import { Stack, Text, Box, Group, ActionIcon, Center, Alert } from "@mantine/core"; +import { Stack, Text, Box, Group, ActionIcon, Center, Alert, Checkbox } from "@mantine/core"; import { useTranslation } from "react-i18next"; import RestartAltIcon from "@mui/icons-material/RestartAlt"; import { CropParametersHook } from "@app/hooks/tools/crop/useCropParameters"; @@ -151,69 +151,81 @@ const CropSettings = ({ parameters, disabled = false }: CropSettingsProps) => { return ( - {/* PDF Preview with Crop Selector */} - - - - {t("crop.preview.title", "Crop Area Selection")} - - - - - - -
- - - - - -
- -
- - {/* Manual Coordinate Input */} - parameters.updateParameter('autoCrop', e.currentTarget.checked)} disabled={disabled} - pdfBounds={pdfBounds} - showAutomationInfo={false} /> - {/* Validation Alert */} - {!isCropValid && ( + {/* PDF Preview with Crop Selector - Only show when autoCrop is false */} + {!parameters.parameters.autoCrop && ( + + + + {t("crop.preview.title", "Crop Area Selection")} + + + + + + +
+ + + + + +
+ +
+ )} + + {/* Manual Coordinate Input - Only show when autoCrop is false */} + {!parameters.parameters.autoCrop && ( + + )} + + {/* Validation Alert - Only show when autoCrop is false */} + {!parameters.parameters.autoCrop && !isCropValid && ( {t("crop.error.invalidArea", "Crop area extends beyond PDF boundaries")} diff --git a/frontend/src/core/hooks/tools/crop/useCropOperation.ts b/frontend/src/core/hooks/tools/crop/useCropOperation.ts index 85d1cc30d..6cc9aa469 100644 --- a/frontend/src/core/hooks/tools/crop/useCropOperation.ts +++ b/frontend/src/core/hooks/tools/crop/useCropOperation.ts @@ -7,13 +7,17 @@ import { CropParameters, defaultParameters } from '@app/hooks/tools/crop/useCrop export const buildCropFormData = (parameters: CropParameters, file: File): FormData => { const formData = new FormData(); formData.append("fileInput", file); - const cropArea = parameters.cropArea; - // Backend expects precise float values for PDF coordinates - formData.append("x", cropArea.x.toString()); - formData.append("y", cropArea.y.toString()); - formData.append("width", cropArea.width.toString()); - formData.append("height", cropArea.height.toString()); + if (!parameters.autoCrop) { + const cropArea = parameters.cropArea; + + formData.append("x", cropArea.x.toString()); + formData.append("y", cropArea.y.toString()); + formData.append("width", cropArea.width.toString()); + formData.append("height", cropArea.height.toString()); + } + + formData.append("autoCrop", parameters.autoCrop.toString()); return formData; }; diff --git a/frontend/src/core/hooks/tools/crop/useCropParameters.ts b/frontend/src/core/hooks/tools/crop/useCropParameters.ts index 443d79a1c..16314160e 100644 --- a/frontend/src/core/hooks/tools/crop/useCropParameters.ts +++ b/frontend/src/core/hooks/tools/crop/useCropParameters.ts @@ -6,10 +6,12 @@ import { DEFAULT_CROP_AREA } from '@app/constants/cropConstants'; export interface CropParameters extends BaseParameters { cropArea: Rectangle; + autoCrop: boolean; } export const defaultParameters: CropParameters = { cropArea: DEFAULT_CROP_AREA, + autoCrop: false, }; export type CropParametersHook = BaseParametersHook & {