Feat: add SearXNG search tool to Agent (frontend + backend, i18n) (#9699)

### What problem does this PR solve?

This PR integrates SearXNG as a new search tool for Agents. It adds
corresponding form/config UI on the frontend and a new tool
implementation on the backend, enabling aggregated web searches via a
self-hosted SearXNG instance within chats/workflows. It also adds
multilingual copy to support internationalized presentation and
configuration guidance.

### Type of change

- [x] New Feature (non-breaking change which adds functionality)

### What’s Changed
- Frontend: new SearXNG tool configuration, forms, and command wiring
  - Main changes under `web/src/pages/agent/`
- New components and form entries are connected to Agent tool selection
and workflow node configuration
- Backend: new tool implementation
- `agent/tools/searxng.py`: connects to a SearXNG instance and performs
search based on the provided instance URL and query parameters
- i18n updates
- Added/updated keys under `web/src/locales/`: `searXNG` and
`searXNGDescription`
- English reference in
[web/src/locales/en.ts](cci:7://file:///c:/Users/ruy_x/Work/CRSC/2025/Software_Development/2025.8/ragflow-pr/ragflow/web/src/locales/en.ts:0:0-0:0):
    - `searXNG: 'SearXNG'`
- `searXNGDescription: 'A component that searches via your provided
SearXNG instance URL. Specify TopN and the instance URL.'`
- Other languages have `searXNG` and `searXNGDescription` added as well,
but accuracy is only guaranteed for English, Simplified Chinese, and
Traditional Chinese.

---------

Co-authored-by: xurui <xurui@crscd.com.cn>

web/src/pages/agent/canvas/node/dropdown/next-step-dropdown.tsx

@@ -201,6 +201,7 @@ function AccordionOperators({
               Operator.GitHub,
               Operator.Invoke,
               Operator.WenCai,
+              Operator.SearXNG,
             ]}
             isCustomDropdown={isCustomDropdown}
             mousePosition={mousePosition}

web/src/pages/agent/constant.tsx

@@ -88,6 +88,7 @@ export enum Operator {
   TavilyExtract = 'TavilyExtract',
   UserFillUp = 'UserFillUp',
   StringTransform = 'StringTransform',
+  SearXNG = 'SearXNG',
 }
 
 export const SwitchLogicOperatorOptions = ['and', 'or'];
@@ -211,6 +212,9 @@ export const componentMenuList = [
   {
     name: Operator.Email,
   },
+  {
+    name: Operator.SearXNG,
+  },
 ];
 
 export const SwitchOperatorOptions = [
@@ -340,6 +344,22 @@ export const initialDuckValues = {
   },
 };
 
+export const initialSearXNGValues = {
+  top_n: '10',
+  searxng_url: '',
+  query: AgentGlobals.SysQuery,
+  outputs: {
+    formalized_content: {
+      value: '',
+      type: 'string',
+    },
+    json: {
+      value: [],
+      type: 'Array<Object>',
+    },
+  },
+};
+
 export const initialBaiduValues = {
   top_n: 10,
   ...initialQueryBaseValues,
@@ -807,6 +827,7 @@ export const RestrictedUpstreamMap = {
   [Operator.GitHub]: [Operator.Begin, Operator.Retrieval],
   [Operator.BaiduFanyi]: [Operator.Begin, Operator.Retrieval],
   [Operator.QWeather]: [Operator.Begin, Operator.Retrieval],
+  [Operator.SearXNG]: [Operator.Begin, Operator.Retrieval],
   [Operator.ExeSQL]: [Operator.Begin],
   [Operator.Switch]: [Operator.Begin],
   [Operator.WenCai]: [Operator.Begin],
@@ -851,6 +872,7 @@ export const NodeMap = {
   [Operator.GitHub]: 'ragNode',
   [Operator.BaiduFanyi]: 'ragNode',
   [Operator.QWeather]: 'ragNode',
+  [Operator.SearXNG]: 'ragNode',
   [Operator.ExeSQL]: 'ragNode',
   [Operator.Switch]: 'switchNode',
   [Operator.Concentrator]: 'logicNode',

web/src/pages/agent/form-sheet/form-config-map.tsx

@@ -27,6 +27,7 @@ import QWeatherForm from '../form/qweather-form';
 import RelevantForm from '../form/relevant-form';
 import RetrievalForm from '../form/retrieval-form/next';
 import RewriteQuestionForm from '../form/rewrite-question-form';
+import SearXNGForm from '../form/searxng-form';
 import StringTransformForm from '../form/string-transform-form';
 import SwitchForm from '../form/switch-form';
 import TavilyExtractForm from '../form/tavily-extract-form';
@@ -132,6 +133,9 @@ export const FormConfigMap = {
   [Operator.Invoke]: {
     component: InvokeForm,
   },
+  [Operator.SearXNG]: {
+    component: SearXNGForm,
+  },
   [Operator.Concentrator]: {
     component: () => <></>,
   },

web/src/pages/agent/form/agent-form/tool-popover/tool-command.tsx

@@ -27,6 +27,7 @@ const Menus = [
       // Operator.Bing,
       Operator.DuckDuckGo,
       Operator.Wikipedia,
+      Operator.SearXNG,
       Operator.YahooFinance,
       Operator.PubMed,
       Operator.GoogleScholar,

web/src/pages/agent/form/searxng-form/index.tsx

@@ -0,0 +1,73 @@
+import { FormContainer } from '@/components/form-container';
+import { TopNFormField } from '@/components/top-n-item';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@/components/ui/form';
+import { Input } from '@/components/ui/input';
+import { useTranslate } from '@/hooks/common-hooks';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { memo } from 'react';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+import { initialSearXNGValues } from '../../constant';
+import { useFormValues } from '../../hooks/use-form-values';
+import { useWatchFormChange } from '../../hooks/use-watch-form-change';
+import { INextOperatorForm } from '../../interface';
+import { buildOutputList } from '../../utils/build-output-list';
+import { FormWrapper } from '../components/form-wrapper';
+import { Output } from '../components/output';
+import { QueryVariable } from '../components/query-variable';
+
+const FormSchema = z.object({
+  query: z.string(),
+  searxng_url: z.string().min(1),
+  top_n: z.string(),
+});
+
+const outputList = buildOutputList(initialSearXNGValues.outputs);
+
+function SearXNGForm({ node }: INextOperatorForm) {
+  const { t } = useTranslate('flow');
+  const defaultValues = useFormValues(initialSearXNGValues, node);
+
+  const form = useForm<z.infer<typeof FormSchema>>({
+    defaultValues,
+    resolver: zodResolver(FormSchema),
+  });
+
+  useWatchFormChange(node?.id, form);
+
+  return (
+    <Form {...form}>
+      <FormWrapper>
+        <FormContainer>
+          <QueryVariable></QueryVariable>
+          <TopNFormField></TopNFormField>
+          <FormField
+            control={form.control}
+            name="searxng_url"
+            render={({ field }) => (
+              <FormItem>
+                <FormLabel>SearXNG URL</FormLabel>
+                <FormControl>
+                  <Input {...field} placeholder="http://localhost:4000" />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            )}
+          />
+        </FormContainer>
+      </FormWrapper>
+      <div className="p-5">
+        <Output list={outputList}></Output>
+      </div>
+    </Form>
+  );
+}
+
+export default memo(SearXNGForm);

web/src/pages/agent/form/tool-form/constant.tsx

@@ -12,6 +12,7 @@ import GoogleForm from './google-form';
 import GoogleScholarForm from './google-scholar-form';
 import PubMedForm from './pubmed-form';
 import RetrievalForm from './retrieval-form';
+import SearXNGForm from './searxng-form';
 import TavilyForm from './tavily-form';
 import WenCaiForm from './wencai-form';
 import WikipediaForm from './wikipedia-form';
@@ -37,4 +38,5 @@ export const ToolFormConfigMap = {
   [Operator.TavilySearch]: TavilyForm,
   [Operator.TavilyExtract]: TavilyForm,
   [Operator.WenCai]: WenCaiForm,
+  [Operator.SearXNG]: SearXNGForm,
 };

web/src/pages/agent/form/tool-form/searxng-form/index.tsx

@@ -0,0 +1,58 @@
+import { FormContainer } from '@/components/form-container';
+import { TopNFormField } from '@/components/top-n-item';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@/components/ui/form';
+import { Input } from '@/components/ui/input';
+import { useTranslate } from '@/hooks/common-hooks';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { memo } from 'react';
+import { useForm } from 'react-hook-form';
+import { z } from 'zod';
+import { useValues } from '../use-values';
+import { useWatchFormChange } from '../use-watch-change';
+
+const FormSchema = z.object({
+  searxng_url: z.string().min(1),
+  top_n: z.string(),
+});
+
+function SearXNGForm() {
+  const { t } = useTranslate('flow');
+  const values = useValues();
+
+  const form = useForm<z.infer<typeof FormSchema>>({
+    defaultValues: values as any,
+    resolver: zodResolver(FormSchema),
+  });
+
+  useWatchFormChange(form);
+
+  return (
+    <Form {...form}>
+      <FormContainer>
+        <TopNFormField></TopNFormField>
+        <FormField
+          control={form.control}
+          name="searxng_url"
+          render={({ field }) => (
+            <FormItem>
+              <FormLabel>SearXNG URL</FormLabel>
+              <FormControl>
+                <Input {...field} placeholder="http://localhost:4000" />
+              </FormControl>
+              <FormMessage />
+            </FormItem>
+          )}
+        />
+      </FormContainer>
+    </Form>
+  );
+}
+
+export default memo(SearXNGForm);

web/src/pages/agent/hooks.tsx

@@ -45,6 +45,7 @@ import {
   initialRelevantValues,
   initialRetrievalValues,
   initialRewriteQuestionValues,
+  initialSearXNGValues,
   initialStringTransformValues,
   initialSwitchValues,
   initialTavilyExtractValues,
@@ -113,6 +114,7 @@ export const useInitializeOperatorParams = () => {
       [Operator.Bing]: initialBingValues,
       [Operator.GoogleScholar]: initialGoogleScholarValues,
       [Operator.DeepL]: initialDeepLValues,
+      [Operator.SearXNG]: initialSearXNGValues,
       [Operator.GitHub]: initialGithubValues,
       [Operator.BaiduFanyi]: initialBaiduFanyiValues,
       [Operator.QWeather]: initialQWeatherValues,

web/src/pages/agent/hooks/use-add-node.ts

@@ -39,6 +39,7 @@ import {
   initialRelevantValues,
   initialRetrievalValues,
   initialRewriteQuestionValues,
+  initialSearXNGValues,
   initialStringTransformValues,
   initialSwitchValues,
   initialTavilyExtractValues,
@@ -89,6 +90,7 @@ export const useInitializeOperatorParams = () => {
       [Operator.Bing]: initialBingValues,
       [Operator.GoogleScholar]: initialGoogleScholarValues,
       [Operator.DeepL]: initialDeepLValues,
+      [Operator.SearXNG]: initialSearXNGValues,
       [Operator.GitHub]: initialGithubValues,
       [Operator.BaiduFanyi]: initialBaiduFanyiValues,
       [Operator.QWeather]: initialQWeatherValues,

web/src/pages/agent/hooks/use-agent-tool-initial-values.ts

@@ -56,6 +56,8 @@ export function useAgentToolInitialValues() {
           return pick(initialValues, 'top_n', 'query_type');
         case Operator.Code:
           return {};
+        case Operator.SearXNG:
+          return pick(initialValues, 'searxng_url', 'top_n');
 
         default:
           return initialValues;

web/src/pages/agent/operator-icon.tsx

@@ -6,6 +6,7 @@ import { ReactComponent as GithubIcon } from '@/assets/svg/github.svg';
 import { ReactComponent as GoogleScholarIcon } from '@/assets/svg/google-scholar.svg';
 import { ReactComponent as GoogleIcon } from '@/assets/svg/google.svg';
 import { ReactComponent as PubMedIcon } from '@/assets/svg/pubmed.svg';
+import { ReactComponent as SearXNGIcon } from '@/assets/svg/searxng.svg';
 import { ReactComponent as TavilyIcon } from '@/assets/svg/tavily.svg';
 import { ReactComponent as WenCaiIcon } from '@/assets/svg/wencai.svg';
 import { ReactComponent as WikipediaIcon } from '@/assets/svg/wikipedia.svg';
@@ -46,6 +47,7 @@ export const SVGIconMap = {
   [Operator.Google]: GoogleIcon,
   [Operator.GoogleScholar]: GoogleScholarIcon,
   [Operator.PubMed]: PubMedIcon,
+  [Operator.SearXNG]: SearXNGIcon,
   [Operator.TavilyExtract]: TavilyIcon,
   [Operator.TavilySearch]: TavilyIcon,
   [Operator.Wikipedia]: WikipediaIcon,