From dc739efddfb0e217814b2bd82d27b891c7c7dd3f Mon Sep 17 00:00:00 2001
From: Anthony Stirling <77850077+Frooodle@users.noreply.github.com.>
Date: Tue, 16 Sep 2025 17:03:50 +0100
Subject: [PATCH] translations and tooltips

---
 .../public/locales/en-GB/translation.json     | 25 +++++++++++
 .../BookletImpositionSettings.tsx             | 18 --------
 .../tooltips/useBookletImpositionTips.ts      | 44 +++++++++++++++++++
 frontend/src/tools/BookletImposition.tsx      |  4 ++
 4 files changed, 73 insertions(+), 18 deletions(-)
 create mode 100644 frontend/src/components/tooltips/useBookletImpositionTips.ts

diff --git a/frontend/public/locales/en-GB/translation.json b/frontend/public/locales/en-GB/translation.json
index 4c0d1adc4..7d14c212c 100644
--- a/frontend/public/locales/en-GB/translation.json
+++ b/frontend/public/locales/en-GB/translation.json
@@ -1710,6 +1710,31 @@
       "tooltip": "Adds borders around each page section to help with cutting and alignment",
       "description": "Helpful for cutting and alignment when printing"
     },
+    "tooltip": {
+      "title": "Booklet Imposition Guide",
+      "overview": {
+        "title": "What is Booklet Imposition?",
+        "description": "Arranges PDF pages in the correct order for booklet printing. Pages are reordered so that when printed and folded, they appear in sequence.",
+        "bullet1": "Creates printable booklets from regular PDFs",
+        "bullet2": "Handles page ordering for folding",
+        "bullet3": "Supports saddle-stitch and side-stitch binding"
+      },
+      "bookletTypes": {
+        "title": "Booklet Types",
+        "standard": "Standard: Saddle-stitched binding (staples along fold)",
+        "sideStitch": "Side-Stitch: Binding along edge (spiral, ring, perfect)"
+      },
+      "pagesPerSheet": {
+        "title": "Pages Per Sheet",
+        "two": "2 Pages: Standard layout (most common)",
+        "four": "4 Pages: Compact layout"
+      },
+      "orientation": {
+        "title": "Page Orientation",
+        "landscape": "Landscape: A4 → A5 booklet (recommended)",
+        "portrait": "Portrait: A4 → A6 booklet (compact)"
+      }
+    },
     "files": {
     },
     "error": {
diff --git a/frontend/src/components/tools/bookletImposition/BookletImpositionSettings.tsx b/frontend/src/components/tools/bookletImposition/BookletImpositionSettings.tsx
index 6be52a1d3..698240c5d 100644
--- a/frontend/src/components/tools/bookletImposition/BookletImpositionSettings.tsx
+++ b/frontend/src/components/tools/bookletImposition/BookletImpositionSettings.tsx
@@ -29,11 +29,6 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
           ]}
           disabled={disabled}
         />
-        <Text size="xs" c="dimmed">
-          {parameters.bookletType === 'BOOKLET'
-            ? t('bookletImposition.bookletType.standardDesc', 'Standard booklet for saddle-stitched binding (fold in half)')
-            : t('bookletImposition.bookletType.sideStitchDesc', 'Side-stitched booklet for binding along the edge')}
-        </Text>
       </Stack>
 
       <Divider />
@@ -50,11 +45,6 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
           ]}
           disabled={disabled}
         />
-        <Text size="xs" c="dimmed">
-          {parameters.pagesPerSheet === 2
-            ? t('bookletImposition.pagesPerSheet.twoDesc', 'Two pages side by side on each sheet (most common)')
-            : t('bookletImposition.pagesPerSheet.fourDesc', 'Four pages arranged in a 2x2 grid on each sheet')}
-        </Text>
       </Stack>
 
       <Divider />
@@ -71,11 +61,6 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
           ]}
           disabled={disabled}
         />
-        <Text size="xs" c="dimmed">
-          {parameters.pageOrientation === 'LANDSCAPE'
-            ? t('bookletImposition.pageOrientation.landscapeDesc', 'A4 landscape → A5 portrait when folded (recommended, standard booklet size)')
-            : t('bookletImposition.pageOrientation.portraitDesc', 'A4 portrait → A6 when folded (smaller booklet)')}
-        </Text>
       </Stack>
 
       <Divider />
@@ -94,9 +79,6 @@ const BookletImpositionSettings = ({ parameters, onParameterChange, disabled = f
           />
           <Text size="sm">{t('bookletImposition.addBorder.label', 'Add borders around pages')}</Text>
         </label>
-        <Text size="xs" c="dimmed" style={{ marginLeft: 'var(--mantine-spacing-lg)' }}>
-          {t('bookletImposition.addBorder.description', 'Helpful for cutting and alignment when printing')}
-        </Text>
       </Stack>
     </Stack>
   );
diff --git a/frontend/src/components/tooltips/useBookletImpositionTips.ts b/frontend/src/components/tooltips/useBookletImpositionTips.ts
new file mode 100644
index 000000000..70deb6c5b
--- /dev/null
+++ b/frontend/src/components/tooltips/useBookletImpositionTips.ts
@@ -0,0 +1,44 @@
+import { useTranslation } from 'react-i18next';
+import { TooltipContent } from '../../types/tips';
+
+export const useBookletImpositionTips = (): TooltipContent => {
+  const { t } = useTranslation();
+
+  return {
+    header: {
+      title: t("bookletImposition.tooltip.title", "Booklet Imposition Guide")
+    },
+    tips: [
+      {
+        title: t("bookletImposition.tooltip.overview.title", "What is Booklet Imposition?"),
+        description: t("bookletImposition.tooltip.overview.description", "Arranges PDF pages in the correct order for booklet printing. Pages are reordered so that when printed and folded, they appear in sequence."),
+        bullets: [
+          t("bookletImposition.tooltip.overview.bullet1", "Creates printable booklets from regular PDFs"),
+          t("bookletImposition.tooltip.overview.bullet2", "Handles page ordering for folding"),
+          t("bookletImposition.tooltip.overview.bullet3", "Supports saddle-stitch and side-stitch binding")
+        ]
+      },
+      {
+        title: t("bookletImposition.tooltip.bookletTypes.title", "Booklet Types"),
+        bullets: [
+          t("bookletImposition.tooltip.bookletTypes.standard", "Standard: Saddle-stitched binding (staples along fold)"),
+          t("bookletImposition.tooltip.bookletTypes.sideStitch", "Side-Stitch: Binding along edge (spiral, ring, perfect)")
+        ]
+      },
+      {
+        title: t("bookletImposition.tooltip.pagesPerSheet.title", "Pages Per Sheet"),
+        bullets: [
+          t("bookletImposition.tooltip.pagesPerSheet.two", "2 Pages: Standard layout (most common)"),
+          t("bookletImposition.tooltip.pagesPerSheet.four", "4 Pages: Compact layout")
+        ]
+      },
+      {
+        title: t("bookletImposition.tooltip.orientation.title", "Page Orientation"),
+        bullets: [
+          t("bookletImposition.tooltip.orientation.landscape", "Landscape: A4 → A5 booklet (recommended)"),
+          t("bookletImposition.tooltip.orientation.portrait", "Portrait: A4 → A6 booklet (compact)")
+        ]
+      }
+    ]
+  };
+};
\ No newline at end of file
diff --git a/frontend/src/tools/BookletImposition.tsx b/frontend/src/tools/BookletImposition.tsx
index 74a2086da..de3821710 100644
--- a/frontend/src/tools/BookletImposition.tsx
+++ b/frontend/src/tools/BookletImposition.tsx
@@ -4,6 +4,7 @@ import BookletImpositionSettings from "../components/tools/bookletImposition/Boo
 import { useBookletImpositionParameters } from "../hooks/tools/bookletImposition/useBookletImpositionParameters";
 import { useBookletImpositionOperation } from "../hooks/tools/bookletImposition/useBookletImpositionOperation";
 import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
+import { useBookletImpositionTips } from "../components/tooltips/useBookletImpositionTips";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
 const BookletImposition = (props: BaseToolProps) => {
@@ -16,6 +17,8 @@ const BookletImposition = (props: BaseToolProps) => {
     props
   );
 
+  const bookletTips = useBookletImpositionTips();
+
   return createToolFlow({
     files: {
       selectedFiles: base.selectedFiles,
@@ -26,6 +29,7 @@ const BookletImposition = (props: BaseToolProps) => {
         title: "Settings",
         isCollapsed: base.settingsCollapsed,
         onCollapsedClick: base.settingsCollapsed ? base.handleSettingsReset : undefined,
+        tooltip: bookletTips,
         content: (
           <BookletImpositionSettings
             parameters={base.params.parameters}