Add configurable Sogou-backed web search

2026-06-12 18:08:54 +00:00 · 2026-04-14 22:58:07 +08:00
parent 08fc305d5e
commit 93977bf348
12 changed files with 1027 additions and 45 deletions
@@ -5,6 +5,7 @@ import (
 	"fmt"
 	"net/http"
 	"runtime"
+	"strings"

 	"github.com/sipeed/picoclaw/pkg/config"
 )
@@ -33,6 +34,38 @@ type toolStateRequest struct {
 	Enabled bool `json:"enabled"`
 }

+type webSearchProviderOption struct {
+	ID           string `json:"id"`
+	Label        string `json:"label"`
+	Configured   bool   `json:"configured"`
+	Current      bool   `json:"current"`
+	RequiresAuth bool   `json:"requires_auth"`
+}
+
+type webSearchProviderConfig struct {
+	Enabled    bool   `json:"enabled"`
+	MaxResults int    `json:"max_results"`
+	BaseURL    string `json:"base_url,omitempty"`
+	APIKey     string `json:"api_key,omitempty"`
+	APIKeySet  bool   `json:"api_key_set,omitempty"`
+}
+
+type webSearchConfigResponse struct {
+	Provider       string                             `json:"provider"`
+	CurrentService string                             `json:"current_service"`
+	PreferNative   bool                               `json:"prefer_native"`
+	Proxy          string                             `json:"proxy,omitempty"`
+	Providers      []webSearchProviderOption          `json:"providers"`
+	Settings       map[string]webSearchProviderConfig `json:"settings"`
+}
+
+type webSearchConfigRequest struct {
+	Provider     string                             `json:"provider"`
+	PreferNative bool                               `json:"prefer_native"`
+	Proxy        string                             `json:"proxy"`
+	Settings     map[string]webSearchProviderConfig `json:"settings"`
+}
+
 var toolCatalog = []toolCatalogEntry{
 	{
 		Name:        "read_file",
@@ -153,6 +186,8 @@ var toolCatalog = []toolCatalogEntry{
 func (h *Handler) registerToolRoutes(mux *http.ServeMux) {
 	mux.HandleFunc("GET /api/tools", h.handleListTools)
 	mux.HandleFunc("PUT /api/tools/{name}/state", h.handleUpdateToolState)
+	mux.HandleFunc("GET /api/tools/web-search-config", h.handleGetWebSearchConfig)
+	mux.HandleFunc("PUT /api/tools/web-search-config", h.handleUpdateWebSearchConfig)
 }

 func (h *Handler) handleListTools(w http.ResponseWriter, r *http.Request) {
@@ -333,3 +368,222 @@ func applyToolState(cfg *config.Config, toolName string, enabled bool) error {
 	}
 	return nil
 }
+
+func (h *Handler) handleGetWebSearchConfig(w http.ResponseWriter, r *http.Request) {
+	cfg, err := config.LoadConfig(h.configPath)
+	if err != nil {
+		http.Error(w, fmt.Sprintf("Failed to load config: %v", err), http.StatusInternalServerError)
+		return
+	}
+
+	w.Header().Set("Content-Type", "application/json")
+	if err := json.NewEncoder(w).Encode(buildWebSearchConfigResponse(cfg)); err != nil {
+		http.Error(w, "Failed to encode response", http.StatusInternalServerError)
+	}
+}
+
+func (h *Handler) handleUpdateWebSearchConfig(w http.ResponseWriter, r *http.Request) {
+	cfg, err := config.LoadConfig(h.configPath)
+	if err != nil {
+		http.Error(w, fmt.Sprintf("Failed to load config: %v", err), http.StatusInternalServerError)
+		return
+	}
+
+	var req webSearchConfigRequest
+	if err := json.NewDecoder(r.Body).Decode(&req); err != nil {
+		http.Error(w, fmt.Sprintf("Invalid JSON: %v", err), http.StatusBadRequest)
+		return
+	}
+
+	provider := normalizeWebSearchProvider(req.Provider)
+	if provider == "" {
+		http.Error(w, "invalid web search provider", http.StatusBadRequest)
+		return
+	}
+
+	cfg.Tools.Web.Provider = provider
+	cfg.Tools.Web.PreferNative = req.PreferNative
+	cfg.Tools.Web.Proxy = strings.TrimSpace(req.Proxy)
+
+	if settings, ok := req.Settings["sogou"]; ok {
+		cfg.Tools.Web.Sogou.Enabled = settings.Enabled
+		cfg.Tools.Web.Sogou.MaxResults = settings.MaxResults
+	}
+	if settings, ok := req.Settings["duckduckgo"]; ok {
+		cfg.Tools.Web.DuckDuckGo.Enabled = settings.Enabled
+		cfg.Tools.Web.DuckDuckGo.MaxResults = settings.MaxResults
+	}
+	if settings, ok := req.Settings["brave"]; ok {
+		cfg.Tools.Web.Brave.Enabled = settings.Enabled
+		cfg.Tools.Web.Brave.MaxResults = settings.MaxResults
+		if key := strings.TrimSpace(settings.APIKey); key != "" {
+			cfg.Tools.Web.Brave.SetAPIKey(key)
+		}
+	}
+	if settings, ok := req.Settings["tavily"]; ok {
+		cfg.Tools.Web.Tavily.Enabled = settings.Enabled
+		cfg.Tools.Web.Tavily.MaxResults = settings.MaxResults
+		cfg.Tools.Web.Tavily.BaseURL = strings.TrimSpace(settings.BaseURL)
+		if key := strings.TrimSpace(settings.APIKey); key != "" {
+			cfg.Tools.Web.Tavily.SetAPIKey(key)
+		}
+	}
+	if settings, ok := req.Settings["perplexity"]; ok {
+		cfg.Tools.Web.Perplexity.Enabled = settings.Enabled
+		cfg.Tools.Web.Perplexity.MaxResults = settings.MaxResults
+		if key := strings.TrimSpace(settings.APIKey); key != "" {
+			cfg.Tools.Web.Perplexity.SetAPIKey(key)
+		}
+	}
+	if settings, ok := req.Settings["searxng"]; ok {
+		cfg.Tools.Web.SearXNG.Enabled = settings.Enabled
+		cfg.Tools.Web.SearXNG.MaxResults = settings.MaxResults
+		cfg.Tools.Web.SearXNG.BaseURL = strings.TrimSpace(settings.BaseURL)
+	}
+	if settings, ok := req.Settings["glm_search"]; ok {
+		cfg.Tools.Web.GLMSearch.Enabled = settings.Enabled
+		cfg.Tools.Web.GLMSearch.MaxResults = settings.MaxResults
+		cfg.Tools.Web.GLMSearch.BaseURL = strings.TrimSpace(settings.BaseURL)
+		if key := strings.TrimSpace(settings.APIKey); key != "" {
+			cfg.Tools.Web.GLMSearch.APIKey = *config.NewSecureString(key)
+		}
+	}
+	if settings, ok := req.Settings["baidu_search"]; ok {
+		cfg.Tools.Web.BaiduSearch.Enabled = settings.Enabled
+		cfg.Tools.Web.BaiduSearch.MaxResults = settings.MaxResults
+		cfg.Tools.Web.BaiduSearch.BaseURL = strings.TrimSpace(settings.BaseURL)
+		if key := strings.TrimSpace(settings.APIKey); key != "" {
+			cfg.Tools.Web.BaiduSearch.APIKey = *config.NewSecureString(key)
+		}
+	}
+
+	if err := config.SaveConfig(h.configPath, cfg); err != nil {
+		http.Error(w, fmt.Sprintf("Failed to save config: %v", err), http.StatusInternalServerError)
+		return
+	}
+
+	w.Header().Set("Content-Type", "application/json")
+	if err := json.NewEncoder(w).Encode(buildWebSearchConfigResponse(cfg)); err != nil {
+		http.Error(w, "Failed to encode response", http.StatusInternalServerError)
+	}
+}
+
+func normalizeWebSearchProvider(provider string) string {
+	switch strings.ToLower(strings.TrimSpace(provider)) {
+	case "", "auto":
+		return "auto"
+	case "sogou", "brave", "tavily", "duckduckgo", "perplexity", "searxng", "glm_search", "baidu_search":
+		return strings.ToLower(strings.TrimSpace(provider))
+	default:
+		return ""
+	}
+}
+
+func buildWebSearchConfigResponse(cfg *config.Config) webSearchConfigResponse {
+	current := resolveCurrentWebSearchProvider(cfg)
+	settings := map[string]webSearchProviderConfig{
+		"sogou": {
+			Enabled:    cfg.Tools.Web.Sogou.Enabled,
+			MaxResults: cfg.Tools.Web.Sogou.MaxResults,
+		},
+		"duckduckgo": {
+			Enabled:    cfg.Tools.Web.DuckDuckGo.Enabled,
+			MaxResults: cfg.Tools.Web.DuckDuckGo.MaxResults,
+		},
+		"brave": {
+			Enabled:    cfg.Tools.Web.Brave.Enabled,
+			MaxResults: cfg.Tools.Web.Brave.MaxResults,
+			APIKeySet:  len(cfg.Tools.Web.Brave.APIKeys.Values()) > 0,
+		},
+		"tavily": {
+			Enabled:    cfg.Tools.Web.Tavily.Enabled,
+			MaxResults: cfg.Tools.Web.Tavily.MaxResults,
+			BaseURL:    cfg.Tools.Web.Tavily.BaseURL,
+			APIKeySet:  len(cfg.Tools.Web.Tavily.APIKeys.Values()) > 0,
+		},
+		"perplexity": {
+			Enabled:    cfg.Tools.Web.Perplexity.Enabled,
+			MaxResults: cfg.Tools.Web.Perplexity.MaxResults,
+			APIKeySet:  len(cfg.Tools.Web.Perplexity.APIKeys.Values()) > 0,
+		},
+		"searxng": {
+			Enabled:    cfg.Tools.Web.SearXNG.Enabled,
+			MaxResults: cfg.Tools.Web.SearXNG.MaxResults,
+			BaseURL:    cfg.Tools.Web.SearXNG.BaseURL,
+		},
+		"glm_search": {
+			Enabled:    cfg.Tools.Web.GLMSearch.Enabled,
+			MaxResults: cfg.Tools.Web.GLMSearch.MaxResults,
+			BaseURL:    cfg.Tools.Web.GLMSearch.BaseURL,
+			APIKeySet:  cfg.Tools.Web.GLMSearch.APIKey.String() != "",
+		},
+		"baidu_search": {
+			Enabled:    cfg.Tools.Web.BaiduSearch.Enabled,
+			MaxResults: cfg.Tools.Web.BaiduSearch.MaxResults,
+			BaseURL:    cfg.Tools.Web.BaiduSearch.BaseURL,
+			APIKeySet:  cfg.Tools.Web.BaiduSearch.APIKey.String() != "",
+		},
+	}
+
+	providers := []webSearchProviderOption{
+		{ID: "auto", Label: "Auto", Configured: current != "", Current: cfg.Tools.Web.Provider == "" || cfg.Tools.Web.Provider == "auto"},
+		{ID: "sogou", Label: "Sogou", Configured: cfg.Tools.Web.Sogou.Enabled, Current: current == "sogou"},
+		{ID: "duckduckgo", Label: "DuckDuckGo", Configured: cfg.Tools.Web.DuckDuckGo.Enabled, Current: current == "duckduckgo"},
+		{ID: "brave", Label: "Brave Search", Configured: cfg.Tools.Web.Brave.Enabled && len(cfg.Tools.Web.Brave.APIKeys.Values()) > 0, Current: current == "brave", RequiresAuth: true},
+		{ID: "tavily", Label: "Tavily", Configured: cfg.Tools.Web.Tavily.Enabled && len(cfg.Tools.Web.Tavily.APIKeys.Values()) > 0, Current: current == "tavily", RequiresAuth: true},
+		{ID: "perplexity", Label: "Perplexity", Configured: cfg.Tools.Web.Perplexity.Enabled && len(cfg.Tools.Web.Perplexity.APIKeys.Values()) > 0, Current: current == "perplexity", RequiresAuth: true},
+		{ID: "searxng", Label: "SearXNG", Configured: cfg.Tools.Web.SearXNG.Enabled && strings.TrimSpace(cfg.Tools.Web.SearXNG.BaseURL) != "", Current: current == "searxng"},
+		{ID: "glm_search", Label: "GLM Search", Configured: cfg.Tools.Web.GLMSearch.Enabled && cfg.Tools.Web.GLMSearch.APIKey.String() != "", Current: current == "glm_search", RequiresAuth: true},
+		{ID: "baidu_search", Label: "Baidu Search", Configured: cfg.Tools.Web.BaiduSearch.Enabled && cfg.Tools.Web.BaiduSearch.APIKey.String() != "", Current: current == "baidu_search", RequiresAuth: true},
+	}
+
+	provider := cfg.Tools.Web.Provider
+	if provider == "" {
+		provider = "auto"
+	}
+
+	return webSearchConfigResponse{
+		Provider:       provider,
+		CurrentService: current,
+		PreferNative:   cfg.Tools.Web.PreferNative,
+		Proxy:          cfg.Tools.Web.Proxy,
+		Providers:      providers,
+		Settings:       settings,
+	}
+}
+
+func resolveCurrentWebSearchProvider(cfg *config.Config) string {
+	selected := normalizeWebSearchProvider(cfg.Tools.Web.Provider)
+	if selected != "" && selected != "auto" && webSearchProviderConfigured(cfg, selected) {
+		return selected
+	}
+	for _, name := range []string{"sogou", "perplexity", "brave", "searxng", "tavily", "duckduckgo", "baidu_search", "glm_search"} {
+		if webSearchProviderConfigured(cfg, name) {
+			return name
+		}
+	}
+	return ""
+}
+
+func webSearchProviderConfigured(cfg *config.Config, name string) bool {
+	switch name {
+	case "sogou":
+		return cfg.Tools.Web.Sogou.Enabled
+	case "duckduckgo":
+		return cfg.Tools.Web.DuckDuckGo.Enabled
+	case "brave":
+		return cfg.Tools.Web.Brave.Enabled && len(cfg.Tools.Web.Brave.APIKeys.Values()) > 0
+	case "tavily":
+		return cfg.Tools.Web.Tavily.Enabled && len(cfg.Tools.Web.Tavily.APIKeys.Values()) > 0
+	case "perplexity":
+		return cfg.Tools.Web.Perplexity.Enabled && len(cfg.Tools.Web.Perplexity.APIKeys.Values()) > 0
+	case "searxng":
+		return cfg.Tools.Web.SearXNG.Enabled && strings.TrimSpace(cfg.Tools.Web.SearXNG.BaseURL) != ""
+	case "glm_search":
+		return cfg.Tools.Web.GLMSearch.Enabled && cfg.Tools.Web.GLMSearch.APIKey.String() != ""
+	case "baidu_search":
+		return cfg.Tools.Web.BaiduSearch.Enabled && cfg.Tools.Web.BaiduSearch.APIKey.String() != ""
+	default:
+		return false
+	}
+}
@@ -196,3 +196,101 @@ func TestHandleUpdateToolState(t *testing.T) {
 		t.Fatalf("cron should be enabled: %#v", updated.Tools.Cron)
 	}
 }
+
+func TestHandleGetWebSearchConfig(t *testing.T) {
+	configPath, cleanup := setupOAuthTestEnv(t)
+	defer cleanup()
+
+	cfg, err := config.LoadConfig(configPath)
+	if err != nil {
+		t.Fatalf("LoadConfig() error = %v", err)
+	}
+	cfg.Tools.Web.Provider = "sogou"
+	cfg.Tools.Web.Sogou.Enabled = true
+	cfg.Tools.Web.Sogou.MaxResults = 6
+	cfg.Tools.Web.Brave.Enabled = true
+	cfg.Tools.Web.Brave.SetAPIKey("brave-test-key")
+	if err := config.SaveConfig(configPath, cfg); err != nil {
+		t.Fatalf("SaveConfig() error = %v", err)
+	}
+
+	h := NewHandler(configPath)
+	mux := http.NewServeMux()
+	h.RegisterRoutes(mux)
+
+	rec := httptest.NewRecorder()
+	req := httptest.NewRequest(http.MethodGet, "/api/tools/web-search-config", nil)
+	mux.ServeHTTP(rec, req)
+
+	if rec.Code != http.StatusOK {
+		t.Fatalf("status = %d, want %d, body=%s", rec.Code, http.StatusOK, rec.Body.String())
+	}
+
+	var resp webSearchConfigResponse
+	if err := json.Unmarshal(rec.Body.Bytes(), &resp); err != nil {
+		t.Fatalf("Unmarshal() error = %v", err)
+	}
+	if resp.Provider != "sogou" {
+		t.Fatalf("provider = %q, want sogou", resp.Provider)
+	}
+	if resp.CurrentService != "sogou" {
+		t.Fatalf("current_service = %q, want sogou", resp.CurrentService)
+	}
+	if !resp.Settings["brave"].APIKeySet {
+		t.Fatalf("brave api_key_set should be true: %#v", resp.Settings["brave"])
+	}
+}
+
+func TestHandleUpdateWebSearchConfig(t *testing.T) {
+	configPath, cleanup := setupOAuthTestEnv(t)
+	defer cleanup()
+
+	h := NewHandler(configPath)
+	mux := http.NewServeMux()
+	h.RegisterRoutes(mux)
+
+	rec := httptest.NewRecorder()
+	req := httptest.NewRequest(
+		http.MethodPut,
+		"/api/tools/web-search-config",
+		bytes.NewBufferString(`{
+			"provider":"brave",
+			"prefer_native":false,
+			"proxy":"http://127.0.0.1:7890",
+			"settings":{
+				"sogou":{"enabled":true,"max_results":4},
+				"brave":{"enabled":true,"max_results":7,"api_key":"brave-new-key"},
+				"duckduckgo":{"enabled":false,"max_results":3}
+			}
+		}`),
+	)
+	req.Header.Set("Content-Type", "application/json")
+	mux.ServeHTTP(rec, req)
+
+	if rec.Code != http.StatusOK {
+		t.Fatalf("status = %d, want %d, body=%s", rec.Code, http.StatusOK, rec.Body.String())
+	}
+
+	updated, err := config.LoadConfig(configPath)
+	if err != nil {
+		t.Fatalf("LoadConfig() error = %v", err)
+	}
+	if updated.Tools.Web.Provider != "brave" {
+		t.Fatalf("provider = %q, want brave", updated.Tools.Web.Provider)
+	}
+	if updated.Tools.Web.PreferNative {
+		t.Fatal("prefer_native should be false after update")
+	}
+	if updated.Tools.Web.Proxy != "http://127.0.0.1:7890" {
+		t.Fatalf("proxy = %q", updated.Tools.Web.Proxy)
+	}
+	if !updated.Tools.Web.Sogou.Enabled || updated.Tools.Web.Sogou.MaxResults != 4 {
+		t.Fatalf("sogou config not updated: %#v", updated.Tools.Web.Sogou)
+	}
+	if !updated.Tools.Web.Brave.Enabled || updated.Tools.Web.Brave.MaxResults != 7 {
+		t.Fatalf("brave config not updated: %#v", updated.Tools.Web.Brave)
+	}
+	if updated.Tools.Web.Brave.APIKey() != "brave-new-key" {
+		t.Fatalf("brave api key not updated")
+	}
+}
@@ -17,6 +17,31 @@ interface ToolActionResponse {
  status: string
 }

+export interface WebSearchProviderOption {
+  id: string
+  label: string
+  configured: boolean
+  current: boolean
+  requires_auth: boolean
+}
+
+export interface WebSearchProviderConfig {
+  enabled: boolean
+  max_results: number
+  base_url?: string
+  api_key?: string
+  api_key_set?: boolean
+}
+
+export interface WebSearchConfigResponse {
+  provider: string
+  current_service: string
+  prefer_native: boolean
+  proxy?: string
+  providers: WebSearchProviderOption[]
+  settings: Record<string, WebSearchProviderConfig>
+}
+
 async function request<T>(path: string, options?: RequestInit): Promise<T> {
  const res = await launcherFetch(path, options)
  if (!res.ok) {
@@ -56,3 +81,17 @@ export async function setToolEnabled(
    },
  )
 }
+
+export async function getWebSearchConfig(): Promise<WebSearchConfigResponse> {
+  return request<WebSearchConfigResponse>("/api/tools/web-search-config")
+}
+
+export async function updateWebSearchConfig(
+  payload: WebSearchConfigResponse,
+): Promise<WebSearchConfigResponse> {
+  return request<WebSearchConfigResponse>("/api/tools/web-search-config", {
+    method: "PUT",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify(payload),
+  })
+}
@@ -1,11 +1,21 @@
 import { IconSearch } from "@tabler/icons-react"
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query"
-import { useMemo, useState } from "react"
+import { useEffect, useMemo, useState } from "react"
 import { useTranslation } from "react-i18next"
 import { toast } from "sonner"

-import { type ToolSupportItem, getTools, setToolEnabled } from "@/api/tools"
+import {
+  getTools,
+  getWebSearchConfig,
+  setToolEnabled,
+  type ToolSupportItem,
+  type WebSearchConfigResponse,
+  updateWebSearchConfig,
+} from "@/api/tools"
 import { PageHeader } from "@/components/page-header"
+import { maskedSecretPlaceholder } from "@/components/secret-placeholder"
+import { KeyInput } from "@/components/shared-form"
+import { Button } from "@/components/ui/button"
 import {
  Card,
  CardContent,
@@ -33,9 +43,25 @@ export function ToolsPage() {
    queryKey: ["tools"],
    queryFn: getTools,
  })
+  const {
+    data: webSearchData,
+    isLoading: isWebSearchLoading,
+    error: webSearchError,
+  } = useQuery({
+    queryKey: ["tools", "web-search-config"],
+    queryFn: getWebSearchConfig,
+  })

  const [searchQuery, setSearchQuery] = useState("")
  const [statusFilter, setStatusFilter] = useState("all")
+  const [webSearchDraft, setWebSearchDraft] =
+    useState<WebSearchConfigResponse | null>(null)
+
+  useEffect(() => {
+    if (webSearchData) {
+      setWebSearchDraft(webSearchData)
+    }
+  }, [webSearchData])

  const toggleMutation = useMutation({
    mutationFn: async ({ name, enabled }: { name: string; enabled: boolean }) =>
@@ -58,6 +84,24 @@ export function ToolsPage() {
    },
  })

+  const webSearchMutation = useMutation({
+    mutationFn: updateWebSearchConfig,
+    onSuccess: (updated) => {
+      setWebSearchDraft(updated)
+      toast.success(t("pages.agent.tools.web_search.save_success"))
+      void queryClient.invalidateQueries({ queryKey: ["tools", "web-search-config"] })
+      void queryClient.invalidateQueries({ queryKey: ["tools"] })
+      void refreshGatewayState({ force: true })
+    },
+    onError: (err) => {
+      toast.error(
+        err instanceof Error
+          ? err.message
+          : t("pages.agent.tools.web_search.save_error"),
+      )
+    },
+  })
+
  // Filter and group tools
  const { groupedTools, totalFilteredCount } = useMemo(() => {
    if (!data) return { groupedTools: [], totalFilteredCount: 0 }
@@ -91,12 +135,254 @@ export function ToolsPage() {
    }
  }, [data, searchQuery, statusFilter])

+  const providerLabelMap = useMemo(() => {
+    const entries = webSearchDraft?.providers ?? []
+    return new Map(entries.map((item) => [item.id, item.label]))
+  }, [webSearchDraft])
+
+  const currentProviderLabel = webSearchDraft?.current_service
+    ? (providerLabelMap.get(webSearchDraft.current_service) ??
+      webSearchDraft.current_service)
+    : t("pages.agent.tools.web_search.none")
+
+  const updateDraft = (
+    updater: (current: WebSearchConfigResponse) => WebSearchConfigResponse,
+  ) => {
+    setWebSearchDraft((current) => (current ? updater(current) : current))
+  }
+
  return (
    <div className="bg-background flex h-full flex-col">
      <PageHeader title={t("navigation.tools")} />

      <div className="flex-1 overflow-auto px-6 py-6">
        <div className="mx-auto w-full max-w-6xl space-y-8">
+          {webSearchError ? (
+            <Card className="border-destructive/50 bg-destructive/10 cursor-default">
+              <CardHeader>
+                <CardTitle>{t("pages.agent.tools.web_search.title")}</CardTitle>
+                <CardDescription>{t("pages.agent.tools.web_search.load_error")}</CardDescription>
+              </CardHeader>
+            </Card>
+          ) : isWebSearchLoading || !webSearchDraft ? (
+            <Card className="border-border/60 shadow-none">
+              <CardHeader>
+                <Skeleton className="h-5 w-48" />
+                <Skeleton className="h-4 w-80" />
+              </CardHeader>
+              <CardContent className="grid gap-4 lg:grid-cols-2">
+                <Skeleton className="h-9 w-full" />
+                <Skeleton className="h-9 w-full" />
+                <Skeleton className="h-24 w-full lg:col-span-2" />
+              </CardContent>
+            </Card>
+          ) : (
+            <Card className="border-border/60 shadow-none">
+              <CardHeader>
+                <CardTitle>{t("pages.agent.tools.web_search.title")}</CardTitle>
+                <CardDescription>
+                  {t("pages.agent.tools.web_search.description")}
+                </CardDescription>
+              </CardHeader>
+              <CardContent className="space-y-6">
+                <div className="grid gap-4 lg:grid-cols-3">
+                  <div className="space-y-2">
+                    <div className="text-sm font-medium">
+                      {t("pages.agent.tools.web_search.current_service")}
+                    </div>
+                    <div className="text-muted-foreground rounded-md border px-3 py-2 text-sm">
+                      {currentProviderLabel}
+                    </div>
+                  </div>
+                  <div className="space-y-2">
+                    <div className="text-sm font-medium">
+                      {t("pages.agent.tools.web_search.provider")}
+                    </div>
+                    <Select
+                      value={webSearchDraft.provider}
+                      onValueChange={(value) =>
+                        updateDraft((current) => ({ ...current, provider: value }))
+                      }
+                    >
+                      <SelectTrigger>
+                        <SelectValue />
+                      </SelectTrigger>
+                      <SelectContent>
+                        {webSearchDraft.providers.map((provider) => (
+                          <SelectItem key={provider.id} value={provider.id}>
+                            {provider.label}
+                          </SelectItem>
+                        ))}
+                      </SelectContent>
+                    </Select>
+                  </div>
+                  <div className="space-y-2">
+                    <div className="text-sm font-medium">
+                      {t("pages.agent.tools.web_search.proxy")}
+                    </div>
+                    <Input
+                      value={webSearchDraft.proxy ?? ""}
+                      onChange={(e) =>
+                        updateDraft((current) => ({
+                          ...current,
+                          proxy: e.target.value,
+                        }))
+                      }
+                      placeholder="http://127.0.0.1:7890"
+                    />
+                  </div>
+                </div>
+
+                <div className="flex items-center justify-between rounded-md border px-4 py-3">
+                  <div>
+                    <div className="text-sm font-medium">
+                      {t("pages.agent.tools.web_search.prefer_native")}
+                    </div>
+                    <div className="text-muted-foreground text-xs">
+                      {t("pages.agent.tools.web_search.prefer_native_hint")}
+                    </div>
+                  </div>
+                  <Switch
+                    checked={webSearchDraft.prefer_native}
+                    onCheckedChange={(checked) =>
+                      updateDraft((current) => ({
+                        ...current,
+                        prefer_native: checked,
+                      }))
+                    }
+                  />
+                </div>
+
+                <div className="grid gap-4 lg:grid-cols-2">
+                  {Object.entries(webSearchDraft.settings).map(([providerId, settings]) => {
+                    const providerLabel = providerLabelMap.get(providerId) ?? providerId
+                    const apiKeyPlaceholder = maskedSecretPlaceholder(
+                      settings.api_key_set ? `${providerId}-configured` : "",
+                      t("pages.agent.tools.web_search.api_key_placeholder"),
+                    )
+
+                    return (
+                      <Card key={providerId} className="border-border/60 shadow-none">
+                        <CardHeader className="pb-3">
+                          <div className="flex items-center justify-between gap-3">
+                            <div>
+                              <CardTitle className="text-base">{providerLabel}</CardTitle>
+                              <CardDescription className="mt-1 text-xs">
+                                {t("pages.agent.tools.web_search.provider_hint")}
+                              </CardDescription>
+                            </div>
+                            <Switch
+                              checked={settings.enabled}
+                              onCheckedChange={(checked) =>
+                                updateDraft((current) => ({
+                                  ...current,
+                                  settings: {
+                                    ...current.settings,
+                                    [providerId]: {
+                                      ...current.settings[providerId],
+                                      enabled: checked,
+                                    },
+                                  },
+                                }))
+                              }
+                            />
+                          </div>
+                        </CardHeader>
+                        <CardContent className="space-y-3">
+                          <div className="space-y-2">
+                            <div className="text-sm font-medium">
+                              {t("pages.agent.tools.web_search.max_results")}
+                            </div>
+                            <Input
+                              type="number"
+                              min={1}
+                              max={10}
+                              value={settings.max_results || 5}
+                              onChange={(e) =>
+                                updateDraft((current) => ({
+                                  ...current,
+                                  settings: {
+                                    ...current.settings,
+                                    [providerId]: {
+                                      ...current.settings[providerId],
+                                      max_results: Number(e.target.value) || 0,
+                                    },
+                                  },
+                                }))
+                              }
+                            />
+                          </div>
+                          {(providerId === "tavily" ||
+                            providerId === "searxng" ||
+                            providerId === "glm_search" ||
+                            providerId === "baidu_search") && (
+                            <div className="space-y-2">
+                              <div className="text-sm font-medium">
+                                {t("pages.agent.tools.web_search.base_url")}
+                              </div>
+                              <Input
+                                value={settings.base_url ?? ""}
+                                onChange={(e) =>
+                                  updateDraft((current) => ({
+                                    ...current,
+                                    settings: {
+                                      ...current.settings,
+                                      [providerId]: {
+                                        ...current.settings[providerId],
+                                        base_url: e.target.value,
+                                      },
+                                    },
+                                  }))
+                                }
+                                placeholder={t("pages.agent.tools.web_search.base_url_placeholder")}
+                              />
+                            </div>
+                          )}
+                          {(providerId === "brave" ||
+                            providerId === "tavily" ||
+                            providerId === "perplexity" ||
+                            providerId === "glm_search" ||
+                            providerId === "baidu_search") && (
+                            <div className="space-y-2">
+                              <div className="text-sm font-medium">
+                                {t("pages.agent.tools.web_search.api_key")}
+                              </div>
+                              <KeyInput
+                                value={settings.api_key ?? ""}
+                                onChange={(value) =>
+                                  updateDraft((current) => ({
+                                    ...current,
+                                    settings: {
+                                      ...current.settings,
+                                      [providerId]: {
+                                        ...current.settings[providerId],
+                                        api_key: value,
+                                      },
+                                    },
+                                  }))
+                                }
+                                placeholder={apiKeyPlaceholder}
+                              />
+                            </div>
+                          )}
+                        </CardContent>
+                      </Card>
+                    )
+                  })}
+                </div>
+
+                <div className="flex justify-end">
+                  <Button
+                    onClick={() => webSearchMutation.mutate(webSearchDraft)}
+                    disabled={webSearchMutation.isPending}
+                  >
+                    {t("pages.agent.tools.web_search.save")}
+                  </Button>
+                </div>
+              </CardContent>
+            </Card>
+          )}
+
          {/* Header & Description */}
          <div className="flex flex-col gap-4 sm:flex-row sm:items-end sm:justify-end">
            {/* Filters Toolbar */}
@@ -503,6 +503,26 @@
        "enable_success": "Tool enabled.",
        "disable_success": "Tool disabled.",
        "toggle_error": "Failed to update tool state.",
+        "web_search": {
+          "title": "Web Search Service",
+          "description": "Choose the default web search backend and configure supported providers.",
+          "load_error": "Failed to load web search configuration.",
+          "save": "Save Web Search Settings",
+          "save_success": "Web search configuration updated.",
+          "save_error": "Failed to update web search configuration.",
+          "current_service": "Current Service",
+          "provider": "Preferred Provider",
+          "proxy": "Proxy",
+          "prefer_native": "Prefer Provider Native Search",
+          "prefer_native_hint": "When the active model supports built-in web search, prefer that capability over the client-side tool.",
+          "provider_hint": "Enable this provider and fill any required connection settings.",
+          "max_results": "Max Results",
+          "base_url": "Base URL",
+          "base_url_placeholder": "https://api.example.com/search",
+          "api_key": "API Key",
+          "api_key_placeholder": "Leave blank to keep the existing key",
+          "none": "Unavailable"
+        },
        "status": {
          "enabled": "Enabled",
          "disabled": "Disabled",
@@ -656,4 +676,4 @@
      "description": "Need more help? Click the documentation button in the top right corner to view detailed guides and configuration docs."
    }
  }
-}
+}
@@ -503,6 +503,26 @@
        "enable_success": "工具已启用。",
        "disable_success": "工具已禁用。",
        "toggle_error": "更新工具状态失败。",
+        "web_search": {
+          "title": "Web Search 服务",
+          "description": "选择默认网页搜索后端，并配置已支持的搜索服务。",
+          "load_error": "加载 Web Search 配置失败。",
+          "save": "保存 Web Search 配置",
+          "save_success": "Web Search 配置已更新。",
+          "save_error": "更新 Web Search 配置失败。",
+          "current_service": "当前服务",
+          "provider": "首选服务",
+          "proxy": "代理",
+          "prefer_native": "优先使用模型原生搜索",
+          "prefer_native_hint": "如果当前模型支持内建网页搜索，优先使用模型原生能力而不是客户端工具。",
+          "provider_hint": "启用该服务后，可继续填写所需的连接参数。",
+          "max_results": "最大结果数",
+          "base_url": "基础 URL",
+          "base_url_placeholder": "https://api.example.com/search",
+          "api_key": "API Key",
+          "api_key_placeholder": "留空则保留现有密钥",
+          "none": "不可用"
+        },
        "status": {
          "enabled": "已启用",
          "disabled": "已禁用",
@@ -656,4 +676,4 @@
      "description": "需要更多帮助？点击右上角的文档按钮，查看详细的使用文档和配置指南。"
    }
  }
-}
+}