From f54b0a9325b74a30f5159d711afd233ada4168c5 Mon Sep 17 00:00:00 2001 From: EthanHealy01 Date: Mon, 15 Sep 2025 16:36:52 +0100 Subject: [PATCH] add remove blank pages into this PR also --- .../public/locales/en-GB/translation.json | 83 +++++++++++++++++-- .../public/locales/en-US/translation.json | 83 +++++++++++++++++-- .../tools/removePages/RemovePagesSettings.tsx | 23 ++--- .../tooltips/useRemoveBlanksTips.ts | 41 +++++++++ .../components/tooltips/useRemovePagesTips.ts | 34 ++++++++ frontend/src/tools/RemoveBlanks.tsx | 19 +++-- frontend/src/tools/RemovePages.tsx | 3 + 7 files changed, 246 insertions(+), 40 deletions(-) create mode 100644 frontend/src/components/tooltips/useRemoveBlanksTips.ts create mode 100644 frontend/src/components/tooltips/useRemovePagesTips.ts diff --git a/frontend/public/locales/en-GB/translation.json b/frontend/public/locales/en-GB/translation.json index 6ba7c83ba..e4979fbbd 100644 --- a/frontend/public/locales/en-GB/translation.json +++ b/frontend/public/locales/en-GB/translation.json @@ -1016,15 +1016,45 @@ "removePages": { "tags": "Remove pages,delete pages", "title": "Remove Pages", - "pageNumbers": "Pages to Remove", - "pageNumbersPlaceholder": "e.g. 1,3,5-7", - "pageNumbersHelp": "Enter page numbers separated by commas, or ranges like 1-5. Example: 1,3,5-7", + "pageNumbers": { + "label": "Pages to Remove", + "placeholder": "e.g., 1,3,5-8,10" + }, "filenamePrefix": "pages_removed", "files": { "placeholder": "Select a PDF file in the main view to get started" }, "settings": { - "title": "Page Selection" + "title": "Settings" + }, + "tooltip": { + "header": { + "title": "Remove Pages Settings" + }, + "pageNumbers": { + "title": "Page Selection", + "text": "Specify which pages to remove from your PDF. You can select individual pages, ranges, or use mathematical expressions.", + "bullet1": "Individual pages: 1,3,5 (removes pages 1, 3, and 5)", + "bullet2": "Page ranges: 1-5,10-15 (removes pages 1-5 and 10-15)", + "bullet3": "Mathematical: 2n+1 (removes odd pages)", + "bullet4": "Open ranges: 5- (removes from page 5 to end)" + }, + "examples": { + "title": "Common Examples", + "text": "Here are some common page selection patterns:", + "bullet1": "Remove first page: 1", + "bullet2": "Remove last 3 pages: -3", + "bullet3": "Remove every other page: 2n", + "bullet4": "Remove specific scattered pages: 1,5,10,15" + }, + "safety": { + "title": "Safety Tips", + "text": "Important considerations when removing pages:", + "bullet1": "Always preview your selection before processing", + "bullet2": "Keep a backup of your original file", + "bullet3": "Page numbers start from 1, not 0", + "bullet4": "Invalid page numbers will be ignored" + } }, "error": { "failed": "An error occurred whilst removing pages." @@ -1383,11 +1413,46 @@ "tags": "cleanup,streamline,non-content,organize", "title": "Remove Blanks", "header": "Remove Blank Pages", - "threshold": "Pixel Whiteness Threshold:", - "thresholdDesc": "Threshold for determining how white a white pixel must be to be classed as 'White'. 0 = Black, 255 pure white.", - "whitePercent": "White Percent (%):", - "whitePercentDesc": "Percent of page that must be 'white' pixels to be removed", - "submit": "Remove Blanks" + "settings": { + "title": "Settings" + }, + "threshold": { + "label": "Pixel Whiteness Threshold" + }, + "whitePercent": { + "label": "White Percentage Threshold", + "unit": "%" + }, + "includeBlankPages": { + "label": "Include detected blank pages" + }, + "tooltip": { + "header": { + "title": "Remove Blank Pages Settings" + }, + "threshold": { + "title": "Pixel Whiteness Threshold", + "text": "Controls how white a pixel must be to be considered 'white'. This helps determine what counts as a blank area on the page.", + "bullet1": "0 = Pure black (most restrictive)", + "bullet2": "128 = Medium grey", + "bullet3": "255 = Pure white (least restrictive)" + }, + "whitePercent": { + "title": "White Percentage Threshold", + "text": "Sets the minimum percentage of white pixels required for a page to be considered blank and removed.", + "bullet1": "Lower values (e.g., 80%) = More pages removed", + "bullet2": "Higher values (e.g., 95%) = Only very blank pages removed", + "bullet3": "Use higher values for documents with light backgrounds" + }, + "includeBlankPages": { + "title": "Include Detected Blank Pages", + "text": "When enabled, creates a separate PDF containing all the blank pages that were detected and removed from the original document.", + "bullet1": "Useful for reviewing what was removed", + "bullet2": "Helps verify the detection accuracy", + "bullet3": "Can be disabled to reduce output file size" + } + }, + "submit": "Remove blank pages" }, "removeAnnotations": { "tags": "comments,highlight,notes,markup,remove", diff --git a/frontend/public/locales/en-US/translation.json b/frontend/public/locales/en-US/translation.json index 4b93181b8..ff3ccaaf7 100644 --- a/frontend/public/locales/en-US/translation.json +++ b/frontend/public/locales/en-US/translation.json @@ -745,15 +745,45 @@ "removePages": { "tags": "Remove pages,delete pages", "title": "Remove Pages", - "pageNumbers": "Pages to Remove", - "pageNumbersPlaceholder": "e.g. 1,3,5-7", - "pageNumbersHelp": "Enter page numbers separated by commas, or ranges like 1-5. Example: 1,3,5-7", + "pageNumbers": { + "label": "Pages to Remove", + "placeholder": "e.g., 1,3,5-8,10" + }, "filenamePrefix": "pages_removed", "files": { "placeholder": "Select a PDF file in the main view to get started" }, "settings": { - "title": "Page Selection" + "title": "Settings" + }, + "tooltip": { + "header": { + "title": "Remove Pages Settings" + }, + "pageNumbers": { + "title": "Page Selection", + "text": "Specify which pages to remove from your PDF. You can select individual pages, ranges, or use mathematical expressions.", + "bullet1": "Individual pages: 1,3,5 (removes pages 1, 3, and 5)", + "bullet2": "Page ranges: 1-5,10-15 (removes pages 1-5 and 10-15)", + "bullet3": "Mathematical: 2n+1 (removes odd pages)", + "bullet4": "Open ranges: 5- (removes from page 5 to end)" + }, + "examples": { + "title": "Common Examples", + "text": "Here are some common page selection patterns:", + "bullet1": "Remove first page: 1", + "bullet2": "Remove last 3 pages: -3", + "bullet3": "Remove every other page: 2n", + "bullet4": "Remove specific scattered pages: 1,5,10,15" + }, + "safety": { + "title": "Safety Tips", + "text": "Important considerations when removing pages:", + "bullet1": "Always preview your selection before processing", + "bullet2": "Keep a backup of your original file", + "bullet3": "Page numbers start from 1, not 0", + "bullet4": "Invalid page numbers will be ignored" + } }, "error": { "failed": "An error occurred while removing pages." @@ -1013,11 +1043,46 @@ "tags": "cleanup,streamline,non-content,organize", "title": "Remove Blanks", "header": "Remove Blank Pages", - "threshold": "Pixel Whiteness Threshold:", - "thresholdDesc": "Threshold for determining how white a white pixel must be to be classed as 'White'. 0 = Black, 255 pure white.", - "whitePercent": "White Percent (%):", - "whitePercentDesc": "Percent of page that must be 'white' pixels to be removed", - "submit": "Remove Blanks" + "settings": { + "title": "Settings" + }, + "threshold": { + "label": "Pixel Whiteness Threshold" + }, + "whitePercent": { + "label": "White Percentage Threshold", + "unit": "%" + }, + "includeBlankPages": { + "label": "Include detected blank pages" + }, + "tooltip": { + "header": { + "title": "Remove Blank Pages Settings" + }, + "threshold": { + "title": "Pixel Whiteness Threshold", + "text": "Controls how white a pixel must be to be considered 'white'. This helps determine what counts as a blank area on the page.", + "bullet1": "0 = Pure black (most restrictive)", + "bullet2": "128 = Medium gray", + "bullet3": "255 = Pure white (least restrictive)" + }, + "whitePercent": { + "title": "White Percentage Threshold", + "text": "Sets the minimum percentage of white pixels required for a page to be considered blank and removed.", + "bullet1": "Lower values (e.g., 80%) = More pages removed", + "bullet2": "Higher values (e.g., 95%) = Only very blank pages removed", + "bullet3": "Use higher values for documents with light backgrounds" + }, + "includeBlankPages": { + "title": "Include Detected Blank Pages", + "text": "When enabled, creates a separate PDF containing all the blank pages that were detected and removed from the original document.", + "bullet1": "Useful for reviewing what was removed", + "bullet2": "Helps verify the detection accuracy", + "bullet3": "Can be disabled to reduce output file size" + } + }, + "submit": "Remove blank pages" }, "removeAnnotations": { "tags": "comments,highlight,notes,markup,remove", diff --git a/frontend/src/components/tools/removePages/RemovePagesSettings.tsx b/frontend/src/components/tools/removePages/RemovePagesSettings.tsx index 2135fb49e..052455f14 100644 --- a/frontend/src/components/tools/removePages/RemovePagesSettings.tsx +++ b/frontend/src/components/tools/removePages/RemovePagesSettings.tsx @@ -1,4 +1,4 @@ -import { Stack, Text, TextInput } from "@mantine/core"; +import { Stack, TextInput } from "@mantine/core"; import { useTranslation } from "react-i18next"; import { RemovePagesParameters } from "../../../hooks/tools/removePages/useRemovePagesParameters"; @@ -19,19 +19,14 @@ const RemovePagesSettings = ({ parameters, onParameterChange, disabled = false } return ( - - handlePageNumbersChange(event.currentTarget.value)} - placeholder={t('removePages.pageNumbers.placeholder', 'e.g., 1,3,5-8,10')} - disabled={disabled} - required - /> - - {t('removePages.pageNumbers.desc', 'Enter page numbers or ranges separated by commas. Examples: 1,3,5 or 1-5,10-15')} - - + handlePageNumbersChange(event.currentTarget.value)} + placeholder={t('removePages.pageNumbers.placeholder', 'e.g., 1,3,5-8,10')} + disabled={disabled} + required + /> ); }; diff --git a/frontend/src/components/tooltips/useRemoveBlanksTips.ts b/frontend/src/components/tooltips/useRemoveBlanksTips.ts new file mode 100644 index 000000000..a011bd4ee --- /dev/null +++ b/frontend/src/components/tooltips/useRemoveBlanksTips.ts @@ -0,0 +1,41 @@ +import { useTranslation } from 'react-i18next'; +import { TooltipContent } from '../../types/tips'; + +export const useRemoveBlanksTips = (): TooltipContent => { + const { t } = useTranslation(); + + return { + header: { + title: t("removeBlanks.tooltip.header.title", "Remove Blank Pages Settings"), + }, + tips: [ + { + title: t("removeBlanks.tooltip.threshold.title", "Pixel Whiteness Threshold"), + description: t("removeBlanks.tooltip.threshold.text", "Controls how white a pixel must be to be considered 'white'. This helps determine what counts as a blank area on the page."), + bullets: [ + t("removeBlanks.tooltip.threshold.bullet1", "0 = Pure black (most restrictive)"), + t("removeBlanks.tooltip.threshold.bullet2", "128 = Medium gray"), + t("removeBlanks.tooltip.threshold.bullet3", "255 = Pure white (least restrictive)") + ] + }, + { + title: t("removeBlanks.tooltip.whitePercent.title", "White Percentage Threshold"), + description: t("removeBlanks.tooltip.whitePercent.text", "Sets the minimum percentage of white pixels required for a page to be considered blank and removed."), + bullets: [ + t("removeBlanks.tooltip.whitePercent.bullet1", "Lower values (e.g., 80%) = More pages removed"), + t("removeBlanks.tooltip.whitePercent.bullet2", "Higher values (e.g., 95%) = Only very blank pages removed"), + t("removeBlanks.tooltip.whitePercent.bullet3", "Use higher values for documents with light backgrounds") + ] + }, + { + title: t("removeBlanks.tooltip.includeBlankPages.title", "Include Detected Blank Pages"), + description: t("removeBlanks.tooltip.includeBlankPages.text", "When enabled, creates a separate PDF containing all the blank pages that were detected and removed from the original document."), + bullets: [ + t("removeBlanks.tooltip.includeBlankPages.bullet1", "Useful for reviewing what was removed"), + t("removeBlanks.tooltip.includeBlankPages.bullet2", "Helps verify the detection accuracy"), + t("removeBlanks.tooltip.includeBlankPages.bullet3", "Can be disabled to reduce output file size") + ] + } + ] + }; +}; diff --git a/frontend/src/components/tooltips/useRemovePagesTips.ts b/frontend/src/components/tooltips/useRemovePagesTips.ts new file mode 100644 index 000000000..1da2a1ad1 --- /dev/null +++ b/frontend/src/components/tooltips/useRemovePagesTips.ts @@ -0,0 +1,34 @@ +import { useTranslation } from 'react-i18next'; +import { TooltipContent } from '../../types/tips'; + +export const useRemovePagesTips = (): TooltipContent => { + const { t } = useTranslation(); + + return { + header: { + title: t("removePages.tooltip.header.title", "Remove Pages Settings"), + }, + tips: [ + { + title: t("removePages.tooltip.pageNumbers.title", "Page Selection"), + description: t("removePages.tooltip.pageNumbers.text", "Specify which pages to remove from your PDF. You can select individual pages, ranges, or use mathematical expressions."), + bullets: [ + t("removePages.tooltip.pageNumbers.bullet1", "Individual pages: 1,3,5 (removes pages 1, 3, and 5)"), + t("removePages.tooltip.pageNumbers.bullet2", "Page ranges: 1-5,10-15 (removes pages 1-5 and 10-15)"), + t("removePages.tooltip.pageNumbers.bullet3", "Mathematical: 2n+1 (removes odd pages)"), + t("removePages.tooltip.pageNumbers.bullet4", "Open ranges: 5- (removes from page 5 to end)") + ] + }, + { + title: t("removePages.tooltip.examples.title", "Common Examples"), + description: t("removePages.tooltip.examples.text", "Here are some common page selection patterns:"), + bullets: [ + t("removePages.tooltip.examples.bullet1", "Remove first page: 1"), + t("removePages.tooltip.examples.bullet2", "Remove last 3 pages: -3"), + t("removePages.tooltip.examples.bullet3", "Remove every other page: 2n"), + t("removePages.tooltip.examples.bullet4", "Remove specific scattered pages: 1,5,10,15") + ] + } + ] + }; +}; diff --git a/frontend/src/tools/RemoveBlanks.tsx b/frontend/src/tools/RemoveBlanks.tsx index c13b1a38d..89b0a84fb 100644 --- a/frontend/src/tools/RemoveBlanks.tsx +++ b/frontend/src/tools/RemoveBlanks.tsx @@ -6,9 +6,11 @@ import { useBaseTool } from "../hooks/tools/shared/useBaseTool"; import { useRemoveBlanksParameters } from "../hooks/tools/removeBlanks/useRemoveBlanksParameters"; import { useRemoveBlanksOperation } from "../hooks/tools/removeBlanks/useRemoveBlanksOperation"; import RemoveBlanksSettings from "../components/tools/removeBlanks/RemoveBlanksSettings"; +import { useRemoveBlanksTips } from "../components/tooltips/useRemoveBlanksTips"; const RemoveBlanks = (props: BaseToolProps) => { const { t } = useTranslation(); + const tooltipContent = useRemoveBlanksTips(); const base = useBaseTool( 'remove-blanks', @@ -18,12 +20,12 @@ const RemoveBlanks = (props: BaseToolProps) => { ); // Step expansion state management - const [expandedStep, setExpandedStep] = useState<"files" | "advanced" | null>("files"); + const [expandedStep, setExpandedStep] = useState<"files" | "settings" | null>("files"); - // Auto-expand advanced when files are selected + // Auto-expand settings when files are selected useEffect(() => { if (base.selectedFiles.length > 0 && expandedStep === "files") { - setExpandedStep("advanced"); + setExpandedStep("settings"); } }, [base.selectedFiles.length, expandedStep]); @@ -42,12 +44,12 @@ const RemoveBlanks = (props: BaseToolProps) => { /> ); - const handleAdvancedClick = () => { + const handleSettingsClick = () => { if (base.hasResults) { base.handleSettingsReset(); } else { if (!base.hasFiles) return; - setExpandedStep(expandedStep === "advanced" ? null : "advanced"); + setExpandedStep(expandedStep === "settings" ? null : "settings"); } }; @@ -58,10 +60,11 @@ const RemoveBlanks = (props: BaseToolProps) => { }, steps: [ { - title: t("removeBlanks.advanced.title", "Advanced"), - isCollapsed: expandedStep !== "advanced", - onCollapsedClick: handleAdvancedClick, + title: t("removeBlanks.settings.title", "Settings"), + isCollapsed: expandedStep !== "settings", + onCollapsedClick: handleSettingsClick, content: settingsContent, + tooltip: tooltipContent, }, ], executeButton: { diff --git a/frontend/src/tools/RemovePages.tsx b/frontend/src/tools/RemovePages.tsx index 413d1b54f..5ae0f6934 100644 --- a/frontend/src/tools/RemovePages.tsx +++ b/frontend/src/tools/RemovePages.tsx @@ -6,9 +6,11 @@ import { useBaseTool } from "../hooks/tools/shared/useBaseTool"; import { useRemovePagesParameters } from "../hooks/tools/removePages/useRemovePagesParameters"; import { useRemovePagesOperation } from "../hooks/tools/removePages/useRemovePagesOperation"; import RemovePagesSettings from "../components/tools/removePages/RemovePagesSettings"; +import { useRemovePagesTips } from "../components/tooltips/useRemovePagesTips"; const RemovePages = (props: BaseToolProps) => { const { t } = useTranslation(); + const tooltipContent = useRemovePagesTips(); const base = useBaseTool( 'remove-pages', @@ -37,6 +39,7 @@ const RemovePages = (props: BaseToolProps) => { isCollapsed: base.settingsCollapsed, onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined, content: settingsContent, + tooltip: tooltipContent, }, ], executeButton: {