fix: improve agent list responsiveness and connector UI (#324)

## Summary

- keep agent listing responsive when runtime status probes stall
- localize connector controls and keep provider actions usable in narrow
layouts

Author: xxx7xxxx

internal/agent/service.go

@@ -1829,10 +1829,19 @@ func removeAll(path string) error {
 }
 
 func (s *Service) List() []Agent {
+	return s.ListContext(context.Background())
+}
+
+// ListContext returns the persisted agent registry with best-effort live runtime status.
+// Runtime status probes must honor ctx so API callers can remain responsive when a
+// sandbox runtime is unavailable or contended.
+func (s *Service) ListContext(ctx context.Context) []Agent {
+	if ctx == nil {
+		ctx = context.Background()
+	}
 	s.mu.RLock()
 	agents := sortedAgentsFromMap(s.agents)
 	s.mu.RUnlock()
-	ctx := context.Background()
 	for idx := range agents {
 		agents[idx] = s.withRuntimeImageMigrationStatus(ctx, s.hydrateAgentStatus(ctx, agents[idx]))
 	}

internal/agent/service_test.go

@@ -5014,6 +5014,48 @@ func TestListKeepsLastKnownStatusWhenHydrationFails(t *testing.T) {
 	}
 }
 
+func TestListContextStopsBlockedRuntimeStatusHydration(t *testing.T) {
+	svc, err := NewService(
+		config.ModelConfig{},
+		config.ServerConfig{},
+		"manager-image:test",
+		"",
+		WithRuntime(fakeAgentRuntime{
+			kind: RuntimeKindPicoClawSandbox,
+			info: func(ctx context.Context, _ agentruntime.Handle) (agentruntime.Info, error) {
+				<-ctx.Done()
+				return agentruntime.Info{}, ctx.Err()
+			},
+		}),
+	)
+	if err != nil {
+		t.Fatalf("NewService() error = %v", err)
+	}
+	svc.agents["agent-alice"] = Agent{
+		ID:          "agent-alice",
+		Name:        "alice",
+		Role:        RoleWorker,
+		RuntimeKind: RuntimeKindPicoClawSandbox,
+		Status:      string(sandbox.StateRunning),
+		CreatedAt:   time.Date(2026, 4, 1, 11, 0, 0, 0, time.UTC),
+	}
+
+	ctx, cancel := context.WithTimeout(context.Background(), 20*time.Millisecond)
+	defer cancel()
+	started := time.Now()
+	got := svc.ListContext(ctx)
+
+	if elapsed := time.Since(started); elapsed > time.Second {
+		t.Fatalf("ListContext() took %v after cancellation", elapsed)
+	}
+	if len(got) != 1 {
+		t.Fatalf("ListContext() len = %d, want 1", len(got))
+	}
+	if got[0].Status != string(sandbox.StateRunning) {
+		t.Fatalf("ListContext()[0].Status = %q, want running", got[0].Status)
+	}
+}
+
 func TestIsSandboxRuntimeContentionRecognizesBoxLiteLockErrors(t *testing.T) {
 	cases := []struct {
 		name string

internal/api/handler.go

@@ -77,7 +77,10 @@ type Handler struct {
 	participantActivityTurns   map[string]participantActivityTurn
 }
 
-const createOperationTimeout = 10 * time.Minute
+const (
+	createOperationTimeout = 10 * time.Minute
+	agentListStatusTimeout = 2 * time.Second
+)
 
 var sseHeartbeatInterval = 15 * time.Second
 var locateCodexCLI = func() (string, error) {
@@ -916,7 +919,9 @@ func (h *Handler) handleAgents(w http.ResponseWriter, r *http.Request) {
 			http.Error(w, err.Error(), http.StatusInternalServerError)
 			return
 		}
-		writeJSON(w, http.StatusOK, h.presentAgentsForRequest(r, h.svc.List()))
+		ctx, cancel := context.WithTimeout(r.Context(), agentListStatusTimeout)
+		defer cancel()
+		writeJSON(w, http.StatusOK, h.presentAgentsForRequest(r, h.svc.ListContext(ctx)))
 	case http.MethodPost:
 		h.handleCreateAgentWorker(w, r)
 	default:

web/app/src/components/business/ConversationPane/ConversationPane.css

@@ -611,6 +611,7 @@
 
 .connector-provider-row {
   min-width: 0;
+  flex-wrap: wrap;
   justify-content: space-between;
   gap: 12px;
   min-height: 54px;
@@ -620,6 +621,7 @@
 }
 
 .connector-provider-main {
+  flex: 1 1 120px;
   min-width: 0;
   gap: 10px;
 }
@@ -674,8 +676,11 @@
 }
 
 .connector-provider-actions {
+  max-width: 100%;
   display: inline-flex;
+  flex-wrap: wrap;
   align-items: center;
+  justify-content: flex-end;
   gap: 8px;
 }
 

web/app/src/shared/i18n/messages.ts

@@ -95,6 +95,37 @@ export const messages = {
     csghubLoginCompleted: "用户 {user} 登录完成。",
     csghubLoginEnvironmentCompleted: "用户 {user} 登录 {environment} 完成。",
     csghubLogoutCompleted: "用户 {user} 已登出。",
+    connectorManagerTitle: "管理连接器",
+    connectorGitHub: "GitHub",
+    connectorConnected: "已连接",
+    connectorConfigured: "已配置",
+    connectorSetUp: "设置",
+    connectorNotConnected: "未连接",
+    connectorConnect: "连接",
+    connectorConnectGitHub: "连接 GitHub",
+    connectorGitHubConnectedAs: "GitHub 已连接：{user}",
+    connectorManage: "管理",
+    connectorDisconnect: "断开",
+    connectorEdit: "编辑",
+    connectorSave: "保存",
+    connectorClientID: "Client ID",
+    connectorClientSecret: "Client Secret",
+    connectorCallbackURL: "Callback URL",
+    connectorScopes: "Scopes",
+    connectorOAuthPending: "等待 GitHub 授权完成...",
+    connectorClientIDRequired: "请填写 GitHub Client ID。",
+    connectorClientSecretRequired: "请填写 GitHub Client Secret。",
+    connectorSaveFailed: "保存 GitHub 连接器失败。",
+    connectorNotConfigured: "请先配置 GitHub OAuth Client ID 和 Client Secret。",
+    connectorConnectFailed: "GitHub 授权启动失败。",
+    connectorManageFailed: "打开 GitHub App 管理失败。",
+    connectorDisconnectFailed: "断开 GitHub 连接失败。",
+    connectorStatusFailed: "读取连接器状态失败。",
+    connectorLoginTimedOut: "GitHub 授权超时，请重新连接。",
+    connectorOAuthURLMissing: "GitHub 授权地址为空，请重试。",
+    connectorOAuthPopupBlocked: "浏览器阻止了 GitHub 授权窗口，请允许弹窗后重试。",
+    connectorManageURLMissing: "GitHub App 管理地址为空，请重试。",
+    connectorManagePopupBlocked: "浏览器阻止了 GitHub App 管理窗口，请允许弹窗后重试。",
     localAgentConsole: "本地 Agent 控制台",
     loading: "正在加载 IM 工作区...",
     loadingFailed: "加载失败，请稍后重试。",
@@ -1113,6 +1144,37 @@ export const messages = {
     csghubLoginCompleted: "{user} signed in.",
     csghubLoginEnvironmentCompleted: "{user} signed in to {environment}.",
     csghubLogoutCompleted: "Signed out: {user}.",
+    connectorManagerTitle: "Manage connectors",
+    connectorGitHub: "GitHub",
+    connectorConnected: "Connected",
+    connectorConfigured: "Configured",
+    connectorSetUp: "Set up",
+    connectorNotConnected: "Not connected",
+    connectorConnect: "Connect",
+    connectorConnectGitHub: "Connect GitHub",
+    connectorGitHubConnectedAs: "GitHub connected: {user}",
+    connectorManage: "Manage",
+    connectorDisconnect: "Disconnect",
+    connectorEdit: "Edit",
+    connectorSave: "Save",
+    connectorClientID: "Client ID",
+    connectorClientSecret: "Client Secret",
+    connectorCallbackURL: "Callback URL",
+    connectorScopes: "Scopes",
+    connectorOAuthPending: "Waiting for GitHub authorization...",
+    connectorClientIDRequired: "Enter a GitHub Client ID.",
+    connectorClientSecretRequired: "Enter a GitHub Client Secret.",
+    connectorSaveFailed: "Failed to save GitHub connector.",
+    connectorNotConfigured: "Configure the GitHub OAuth Client ID and Client Secret before connecting.",
+    connectorConnectFailed: "Failed to start GitHub authorization.",
+    connectorManageFailed: "Failed to open GitHub App management.",
+    connectorDisconnectFailed: "Failed to disconnect GitHub.",
+    connectorStatusFailed: "Failed to read connector status.",
+    connectorLoginTimedOut: "GitHub authorization timed out. Please connect again.",
+    connectorOAuthURLMissing: "The GitHub authorization URL was empty. Please retry.",
+    connectorOAuthPopupBlocked: "The browser blocked the GitHub authorization window. Allow pop-ups and retry.",
+    connectorManageURLMissing: "The GitHub App management URL was empty. Please retry.",
+    connectorManagePopupBlocked: "The browser blocked the GitHub App management window. Allow pop-ups and retry.",
     localAgentConsole: "Local agent console",
     loading: "Loading IM workspace...",
     loadingFailed: "Failed to load the workspace. Please try again.",

web/app/tests/shared/i18n.test.ts

@@ -6,6 +6,23 @@ describe("i18n messages", () => {
     expect(createTranslator("zh")("humanDetailSubtitle")).toBe("你在聊天、提及和协作中的显示方式。");
   });
 
+  it("localizes connector controls instead of exposing translation keys", () => {
+    const connectorLabels = {
+      en: ["Manage connectors", "Connected", "Manage", "Disconnect"],
+      zh: ["管理连接器", "已连接", "管理", "断开"],
+    } as const;
+
+    for (const locale of ["en", "zh"] as const) {
+      const t = createTranslator(locale);
+      expect([
+        t("connectorManagerTitle"),
+        t("connectorConnected"),
+        t("connectorManage"),
+        t("connectorDisconnect"),
+      ]).toEqual(connectorLabels[locale]);
+    }
+  });
+
   it("localizes personal Hub source tags", () => {
     expect(localizeTemplateSourceTag("personal", "zh")).toBe("个人");
     expect(localizeTemplateSourceTag("personal", "en")).toBe("personal");