Feat: The query variables of the subsequent operators can reference the structured variables defined in the agent operator. #10866 (#10902)

### What problem does this PR solve?

Feat: The query variables of the subsequent operators can reference the
structured variables defined in the agent operator. #10866

### Type of change


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

web/src/pages/agent/form/components/query-variable.tsx

@@ -1,4 +1,3 @@
-import { SelectWithSearch } from '@/components/originui/select-with-search';
 import {
   FormControl,
   FormField,
@@ -12,6 +11,7 @@ import { useFormContext } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 import { VariableType } from '../../constant';
 import { useBuildQueryVariableOptions } from '../../hooks/use-get-begin-query';
+import { GroupedSelectWithSecondaryMenu } from './select-with-secondary-menu';
 
 type QueryVariableProps = {
   name?: string;
@@ -52,11 +52,11 @@ export function QueryVariable({
             </FormLabel>
           )}
           <FormControl>
-            <SelectWithSearch
+            <GroupedSelectWithSecondaryMenu
               options={finalOptions}
               {...field}
-              allowClear
-            ></SelectWithSearch>
+              // allowClear
+            ></GroupedSelectWithSecondaryMenu>
           </FormControl>
           <FormMessage />
         </FormItem>