diff --git a/frontend/src/core/components/pageEditor/BulkSelectionPanel.tsx b/frontend/src/core/components/pageEditor/BulkSelectionPanel.tsx
index 50b304e0b..97ca4f6d4 100644
--- a/frontend/src/core/components/pageEditor/BulkSelectionPanel.tsx
+++ b/frontend/src/core/components/pageEditor/BulkSelectionPanel.tsx
@@ -3,6 +3,7 @@ import classes from '@app/components/pageEditor/bulkSelectionPanel/BulkSelection
import { parseSelectionWithDiagnostics } from '@app/utils/bulkselection/parseSelection';
import PageSelectionInput from '@app/components/pageEditor/bulkSelectionPanel/PageSelectionInput';
import SelectedPagesDisplay from '@app/components/pageEditor/bulkSelectionPanel/SelectedPagesDisplay';
+import PageSelectionSyntaxHint from '@app/components/shared/PageSelectionSyntaxHint';
import AdvancedSelectionPanel from '@app/components/pageEditor/bulkSelectionPanel/AdvancedSelectionPanel';
interface BulkSelectionPanelProps {
@@ -56,10 +57,12 @@ const BulkSelectionPanel = ({
onToggleAdvanced={setAdvancedOpened}
/>
+
+
{
+ const [syntaxError, setSyntaxError] = useState(null);
+
+ useEffect(() => {
+ const text = (input || '').trim();
+ if (!text) {
+ setSyntaxError(null);
+ return;
+ }
+
+ try {
+ const { warning } = parseSelectionWithDiagnostics(text, maxPages && maxPages > 0 ? maxPages : FALLBACK_MAX_PAGES);
+ setSyntaxError(warning ? 'There is a syntax issue. See Page Selection tips for help.' : null);
+ } catch {
+ setSyntaxError('There is a syntax issue. See Page Selection tips for help.');
+ }
+ }, [input, maxPages]);
+
+ if (!syntaxError) return null;
+
+ return (
+
+ {syntaxError}
+
+ );
+};
+
+export default PageSelectionSyntaxHint;
+
+
diff --git a/frontend/src/core/components/tools/extractPages/ExtractPagesSettings.tsx b/frontend/src/core/components/tools/extractPages/ExtractPagesSettings.tsx
index 672c6b175..4489458db 100644
--- a/frontend/src/core/components/tools/extractPages/ExtractPagesSettings.tsx
+++ b/frontend/src/core/components/tools/extractPages/ExtractPagesSettings.tsx
@@ -1,6 +1,7 @@
import { Stack, TextInput } from "@mantine/core";
import { useTranslation } from "react-i18next";
import { ExtractPagesParameters } from "@app/hooks/tools/extractPages/useExtractPagesParameters";
+import PageSelectionSyntaxHint from "@app/components/shared/PageSelectionSyntaxHint";
interface ExtractPagesSettingsProps {
parameters: ExtractPagesParameters;
@@ -25,6 +26,7 @@ const ExtractPagesSettings = ({ parameters, onParameterChange, disabled = false
disabled={disabled}
required
/>
+
);
};