From 76f2fd3b76317383475a7cb4c4739c14db62fcf6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bal=C3=A1zs=20Sz=C3=BCcs?= <127139797+balazs-szucs@users.noreply.github.com> Date: Thu, 20 Nov 2025 16:00:16 +0100 Subject: [PATCH] [V2] refactor(tooltips): add merge tooltips header for consistency, and update other tooltips (#4895) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit # Description of Changes Note on tooltips: I'll do more PRs on tooltips, however this has priority, hence I submitted this for now. #### Before: image image image image #### After: image image image image --- ## Checklist ### General - [X] I have read the [Contribution Guidelines](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/CONTRIBUTING.md) - [X] 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) - [X] I have performed a self-review of my own code - [X] 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) ### Translations (if applicable) - [ ] I ran [`scripts/counter_translation.py`](https://github.com/Stirling-Tools/Stirling-PDF/blob/main/docs/counter_translation.md) ### UI Changes (if applicable) - [X] 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. --------- Signed-off-by: Balázs Szücs --- .../public/locales/en-GB/translation.json | 27 +++++++++++++++++++ .../addAttachments/AddAttachmentsSettings.tsx | 11 +------- .../RemoveAnnotationsSettings.tsx | 19 ++----------- .../tooltips/useAddAttachmentsTips.ts | 18 +++++++++++++ .../components/tooltips/useAutoRenameTips.ts | 4 +++ .../core/components/tooltips/useMergeTips.tsx | 3 +++ .../tooltips/useRemoveAnnotationsTips.ts | 20 ++++++++++++++ frontend/src/core/tools/AddAttachments.tsx | 3 +++ frontend/src/core/tools/AutoRename.tsx | 13 ++++++--- frontend/src/core/tools/RemoveAnnotations.tsx | 3 +++ 10 files changed, 91 insertions(+), 30 deletions(-) create mode 100644 frontend/src/core/components/tooltips/useAddAttachmentsTips.ts create mode 100644 frontend/src/core/components/tooltips/useRemoveAnnotationsTips.ts diff --git a/frontend/public/locales/en-GB/translation.json b/frontend/public/locales/en-GB/translation.json index 0a115f1c6..7ff36357c 100644 --- a/frontend/public/locales/en-GB/translation.json +++ b/frontend/public/locales/en-GB/translation.json @@ -918,6 +918,11 @@ }, "error": { "failed": "An error occurred while merging the PDFs." + }, + "tooltip": { + "header": { + "title": "Merge Settings Overview" + } } }, "split": { @@ -2372,6 +2377,14 @@ "title": "About Remove Annotations", "description": "This tool will remove all annotations (comments, highlights, notes, etc.) from your PDF documents." }, + "tooltip": { + "header": { + "title": "About Remove Annotations" + }, + "description": { + "title": "What it does" + } + }, "error": { "failed": "An error occurred while removing annotations from the PDF." } @@ -2834,6 +2847,9 @@ "header": { "title": "How Auto-Rename Works" }, + "description": { + "title": "What it does" + }, "howItWorks": { "title": "Smart Renaming", "text": "Automatically finds the title from your PDF content and uses it as the filename.", @@ -2841,6 +2857,9 @@ "bullet2": "Creates a clean, valid filename from the detected title", "bullet3": "Keeps the original name if no suitable title is found" } + }, + "settings": { + "title": "About" } }, "adjust-contrast": { @@ -4934,6 +4953,14 @@ "addMoreFiles": "Add more files...", "selectedFiles": "Selected Files", "submit": "Add Attachments", + "tooltip": { + "header": { + "title": "About Add Attachments" + }, + "description": { + "title": "What it does" + } + }, "results": { "title": "Attachment Results" }, diff --git a/frontend/src/core/components/tools/addAttachments/AddAttachmentsSettings.tsx b/frontend/src/core/components/tools/addAttachments/AddAttachmentsSettings.tsx index 80078d0d7..33d9e8b33 100644 --- a/frontend/src/core/components/tools/addAttachments/AddAttachmentsSettings.tsx +++ b/frontend/src/core/components/tools/addAttachments/AddAttachmentsSettings.tsx @@ -4,7 +4,7 @@ * Allows selecting files to attach to PDFs. */ -import { Stack, Text, Group, ActionIcon, Alert, ScrollArea, Button } from "@mantine/core"; +import { Stack, Text, Group, ActionIcon, ScrollArea, Button } from "@mantine/core"; import { useTranslation } from "react-i18next"; import { AddAttachmentsParameters } from "@app/hooks/tools/addAttachments/useAddAttachmentsParameters"; import LocalIcon from "@app/components/shared/LocalIcon"; @@ -20,16 +20,7 @@ const AddAttachmentsSettings = ({ parameters, onParameterChange, disabled = fals return ( - - - {t("AddAttachmentsRequest.info", "Select files to attach to your PDF. These files will be embedded and accessible through the PDF's attachment panel.")} - - - - - {t("AddAttachmentsRequest.selectFiles", "Select Files to Attach")} - { - const { t } = useTranslation(); - return ( - } - title={t('removeAnnotations.info.title', 'About Remove Annotations')} - color="blue" - variant="light" - > - - {t('removeAnnotations.info.description', - 'This tool will remove all annotations (comments, highlights, notes, etc.) from your PDF documents.' - )} - - + {/* No settings needed for this tool - description is in tooltip */} ); }; diff --git a/frontend/src/core/components/tooltips/useAddAttachmentsTips.ts b/frontend/src/core/components/tooltips/useAddAttachmentsTips.ts new file mode 100644 index 000000000..50f924501 --- /dev/null +++ b/frontend/src/core/components/tooltips/useAddAttachmentsTips.ts @@ -0,0 +1,18 @@ +import { useTranslation } from 'react-i18next'; +import { TooltipContent } from '@app/types/tips'; + +export const useAddAttachmentsTips = (): TooltipContent => { + const { t } = useTranslation(); + + return { + header: { + title: t("AddAttachmentsRequest.tooltip.header.title", "About Add Attachments") + }, + tips: [ + { + title: t("AddAttachmentsRequest.tooltip.description.title", "What it does"), + description: t("AddAttachmentsRequest.info", "Select files to attach to your PDF. These files will be embedded and accessible through the PDF's attachment panel."), + } + ] + }; +}; diff --git a/frontend/src/core/components/tooltips/useAutoRenameTips.ts b/frontend/src/core/components/tooltips/useAutoRenameTips.ts index 8b77e39b7..d46c86c75 100644 --- a/frontend/src/core/components/tooltips/useAutoRenameTips.ts +++ b/frontend/src/core/components/tooltips/useAutoRenameTips.ts @@ -9,6 +9,10 @@ export const useAutoRenameTips = (): TooltipContent => { title: t("auto-rename.tooltip.header.title", "How Auto-Rename Works") }, tips: [ + { + title: t("auto-rename.tooltip.description.title", "What it does"), + description: t("auto-rename.description", "Automatically finds the title from your PDF content and uses it as the filename."), + }, { title: t("auto-rename.tooltip.howItWorks.title", "Smart Renaming"), bullets: [ diff --git a/frontend/src/core/components/tooltips/useMergeTips.tsx b/frontend/src/core/components/tooltips/useMergeTips.tsx index decd109ef..741adccce 100644 --- a/frontend/src/core/components/tooltips/useMergeTips.tsx +++ b/frontend/src/core/components/tooltips/useMergeTips.tsx @@ -5,6 +5,9 @@ export const useMergeTips = (): TooltipContent => { const { t } = useTranslation(); return { + header: { + title: t('merge.tooltip.header.title', 'Merge Settings Overview') + }, tips: [ { title: t('merge.removeDigitalSignature.tooltip.title', 'Remove Digital Signature'), diff --git a/frontend/src/core/components/tooltips/useRemoveAnnotationsTips.ts b/frontend/src/core/components/tooltips/useRemoveAnnotationsTips.ts new file mode 100644 index 000000000..edaa03923 --- /dev/null +++ b/frontend/src/core/components/tooltips/useRemoveAnnotationsTips.ts @@ -0,0 +1,20 @@ +import { useTranslation } from 'react-i18next'; +import { TooltipContent } from '@app/types/tips'; + +export const useRemoveAnnotationsTips = (): TooltipContent => { + const { t } = useTranslation(); + + return { + header: { + title: t("removeAnnotations.tooltip.header.title", "About Remove Annotations") + }, + tips: [ + { + title: t("removeAnnotations.tooltip.description.title", "What it does"), + description: t('removeAnnotations.info.description', + 'This tool will remove all annotations (comments, highlights, notes, etc.) from your PDF documents.' + ), + } + ] + }; +}; diff --git a/frontend/src/core/tools/AddAttachments.tsx b/frontend/src/core/tools/AddAttachments.tsx index c248eab96..199ea1d0e 100644 --- a/frontend/src/core/tools/AddAttachments.tsx +++ b/frontend/src/core/tools/AddAttachments.tsx @@ -8,10 +8,12 @@ import { useAddAttachmentsParameters } from "@app/hooks/tools/addAttachments/use import { useAddAttachmentsOperation } from "@app/hooks/tools/addAttachments/useAddAttachmentsOperation"; import { useAccordionSteps } from "@app/hooks/tools/shared/useAccordionSteps"; import AddAttachmentsSettings from "@app/components/tools/addAttachments/AddAttachmentsSettings"; +import { useAddAttachmentsTips } from "@app/components/tooltips/useAddAttachmentsTips"; const AddAttachments = ({ onPreviewFile, onComplete, onError }: BaseToolProps) => { const { t } = useTranslation(); const { selectedFiles } = useFileSelection(); + const addAttachmentsTips = useAddAttachmentsTips(); const params = useAddAttachmentsParameters(); const operation = useAddAttachmentsOperation(); @@ -64,6 +66,7 @@ const AddAttachments = ({ onPreviewFile, onComplete, onError }: BaseToolProps) = isCollapsed: accordion.getCollapsedState(AddAttachmentsStep.ATTACHMENTS), onCollapsedClick: () => accordion.handleStepToggle(AddAttachmentsStep.ATTACHMENTS), isVisible: true, + tooltip: addAttachmentsTips, content: ( { const { t } = useTranslation(); + const autoRenameTips = useAutoRenameTips(); const base = useBaseTool( - '"auto-rename-pdf-file', + 'auto-rename-pdf-file', useAutoRenameParameters, useAutoRenameOperation, props ); return createToolFlow({ - title: { title:t("auto-rename.title", "Auto Rename PDF"), description: t("auto-rename.description", "Auto Rename PDF"), tooltip: useAutoRenameTips()}, files: { selectedFiles: base.selectedFiles, isCollapsed: base.hasResults, }, - steps: [], + steps: [ + { + title: t("auto-rename.settings.title", "About"), + isCollapsed: false, + tooltip: autoRenameTips, + content: null, + }, + ], executeButton: { text: t("auto-rename.submit", "Auto Rename"), isVisible: !base.hasResults, diff --git a/frontend/src/core/tools/RemoveAnnotations.tsx b/frontend/src/core/tools/RemoveAnnotations.tsx index 82d2f47b8..e2bf6c3f4 100644 --- a/frontend/src/core/tools/RemoveAnnotations.tsx +++ b/frontend/src/core/tools/RemoveAnnotations.tsx @@ -5,9 +5,11 @@ import { useRemoveAnnotationsParameters } from "@app/hooks/tools/removeAnnotatio import { useRemoveAnnotationsOperation } from "@app/hooks/tools/removeAnnotations/useRemoveAnnotationsOperation"; import { useBaseTool } from "@app/hooks/tools/shared/useBaseTool"; import { BaseToolProps, ToolComponent } from "@app/types/tool"; +import { useRemoveAnnotationsTips } from "@app/components/tooltips/useRemoveAnnotationsTips"; const RemoveAnnotations = (props: BaseToolProps) => { const { t } = useTranslation(); + const removeAnnotationsTips = useRemoveAnnotationsTips(); const base = useBaseTool( 'removeAnnotations', @@ -26,6 +28,7 @@ const RemoveAnnotations = (props: BaseToolProps) => { title: t("removeAnnotations.settings.title", "Settings"), isCollapsed: base.settingsCollapsed, onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined, + tooltip: removeAnnotationsTips, content: , }, ],