Split tips and fix error

frontend/public/locales/en-GB/translation.json

@@ -683,7 +683,54 @@
       "8": "Document #6: Page 10"
     },
     "splitPages": "Enter pages to split on:",
-    "submit": "Split"
+    "submit": "Split",
+    "error": {
+      "failed": "An error occurred while splitting the PDF."
+    },
+    "method": {
+      "label": "Choose split method",
+      "placeholder": "Select how to split the PDF"
+    },
+    "tooltip": {
+      "header": {
+        "title": "Split Methods Overview"
+      },
+      "byPages": {
+        "title": "Split by Pages",
+        "text": "Extract specific pages or ranges from your PDF. Use commas to separate individual pages and hyphens for ranges.",
+        "bullet1": "Single pages: 1,3,5",
+        "bullet2": "Page ranges: 1-5,10-15",
+        "bullet3": "Mixed: 1,3-7,12,15-20"
+      },
+      "bySections": {
+        "title": "Split by Grid Sections",
+        "text": "Divide each page into a grid of sections. Useful for splitting documents with multiple columns or extracting specific areas.",
+        "bullet1": "Horizontal: Number of rows to create",
+        "bullet2": "Vertical: Number of columns to create",
+        "bullet3": "Merge: Combine all sections into one PDF"
+      },
+      "bySize": {
+        "title": "Split by File Size",
+        "text": "Create multiple PDFs that don't exceed a specified file size. Ideal for file size limitations or email attachments.",
+        "bullet1": "Use MB for larger files (e.g., 10MB)",
+        "bullet2": "Use KB for smaller files (e.g., 500KB)",
+        "bullet3": "System will split at page boundaries"
+      },
+      "byCount": {
+        "title": "Split by Count",
+        "text": "Create multiple PDFs with a specific number of pages or documents each.",
+        "bullet1": "Page Count: Fixed number of pages per file",
+        "bullet2": "Document Count: Fixed number of output files",
+        "bullet3": "Useful for batch processing workflows"
+      },
+      "byChapters": {
+        "title": "Split by Chapters",
+        "text": "Use PDF bookmarks to automatically split at chapter boundaries. Requires PDFs with bookmark structure.",
+        "bullet1": "Bookmark Level: Which level to split on (1=top level)",
+        "bullet2": "Include Metadata: Preserve document properties",
+        "bullet3": "Allow Duplicates: Handle repeated bookmark names"
+      }
+    }
   },
   "rotate": {
     "tags": "server side",

frontend/src/components/tooltips/useSplitTips.ts

@@ -0,0 +1,59 @@
+import { useTranslation } from 'react-i18next';
+import { TooltipContent } from '../../types/tips';
+
+export const useSplitTips = (): TooltipContent => {
+  const { t } = useTranslation();
+
+  return {
+    header: {
+      title: t("split.tooltip.header.title", "Split Methods Overview")
+    },
+    tips: [
+      {
+        title: t("split.tooltip.byPages.title", "Split by Pages"),
+        description: t("split.tooltip.byPages.text", "Extract specific pages or ranges from your PDF. Use commas to separate individual pages and hyphens for ranges."),
+        bullets: [
+          t("split.tooltip.byPages.bullet1", "Single pages: 1,3,5"),
+          t("split.tooltip.byPages.bullet2", "Page ranges: 1-5,10-15"),
+          t("split.tooltip.byPages.bullet3", "Mixed: 1,3-7,12,15-20")
+        ]
+      },
+      {
+        title: t("split.tooltip.bySections.title", "Split by Grid Sections"),
+        description: t("split.tooltip.bySections.text", "Divide each page into a grid of sections. Useful for splitting documents with multiple columns or extracting specific areas."),
+        bullets: [
+          t("split.tooltip.bySections.bullet1", "Horizontal: Number of rows to create"),
+          t("split.tooltip.bySections.bullet2", "Vertical: Number of columns to create"),
+          t("split.tooltip.bySections.bullet3", "Merge: Combine all sections into one PDF")
+        ]
+      },
+      {
+        title: t("split.tooltip.bySize.title", "Split by File Size"),
+        description: t("split.tooltip.bySize.text", "Create multiple PDFs that don't exceed a specified file size. Ideal for file size limitations or email attachments."),
+        bullets: [
+          t("split.tooltip.bySize.bullet1", "Use MB for larger files (e.g., 10MB)"),
+          t("split.tooltip.bySize.bullet2", "Use KB for smaller files (e.g., 500KB)"),
+          t("split.tooltip.bySize.bullet3", "System will split at page boundaries")
+        ]
+      },
+      {
+        title: t("split.tooltip.byCount.title", "Split by Count"),
+        description: t("split.tooltip.byCount.text", "Create multiple PDFs with a specific number of pages or documents each."),
+        bullets: [
+          t("split.tooltip.byCount.bullet1", "Page Count: Fixed number of pages per file"),
+          t("split.tooltip.byCount.bullet2", "Document Count: Fixed number of output files"),
+          t("split.tooltip.byCount.bullet3", "Useful for batch processing workflows")
+        ]
+      },
+      {
+        title: t("split.tooltip.byChapters.title", "Split by Chapters"),
+        description: t("split.tooltip.byChapters.text", "Use PDF bookmarks to automatically split at chapter boundaries. Requires PDFs with bookmark structure."),
+        bullets: [
+          t("split.tooltip.byChapters.bullet1", "Bookmark Level: Which level to split on (1=top level)"),
+          t("split.tooltip.byChapters.bullet2", "Include Metadata: Preserve document properties"),
+          t("split.tooltip.byChapters.bullet3", "Allow Duplicates: Handle repeated bookmark names")
+        ]
+      }
+    ]
+  };
+};

frontend/src/theme/mantineTheme.ts

@@ -183,10 +183,10 @@ export const mantineTheme = createTheme({
         },
         option: {
           color: 'var(--text-primary)',
-          '&[data-hovered]': {
+          '&[dataHovered]': {
             backgroundColor: 'var(--hover-bg)',
           },
-          '&[data-selected]': {
+          '&[dataSelected]': {
             backgroundColor: 'var(--color-primary-100)',
             color: 'var(--color-primary-900)',
           },

frontend/src/tools/Split.tsx

@@ -4,10 +4,12 @@ import SplitSettings from "../components/tools/split/SplitSettings";
 import { useSplitParameters } from "../hooks/tools/split/useSplitParameters";
 import { useSplitOperation } from "../hooks/tools/split/useSplitOperation";
 import { useBaseTool } from "../hooks/tools/shared/useBaseTool";
+import { useSplitTips } from "../components/tooltips/useSplitTips";
 import { BaseToolProps, ToolComponent } from "../types/tool";
 
 const Split = (props: BaseToolProps) => {
   const { t } = useTranslation();
+  const splitTips = useSplitTips();
 
   const base = useBaseTool(
     'split',
@@ -26,6 +28,7 @@ const Split = (props: BaseToolProps) => {
         title: "Settings",
         isCollapsed: base.settingsCollapsed,
         onCollapsedClick: base.hasResults ? base.handleSettingsReset : undefined,
+        tooltip: splitTips,
         content: (
           <SplitSettings
             parameters={base.params.parameters}