From 6eb5f1b961650db760461806cca49be405a00ae8 Mon Sep 17 00:00:00 2001
From: "alan.cl" <1165243776@qq.com>
Date: Tue, 26 May 2026 13:47:39 +0800
Subject: [PATCH] feat(connector): wire HITL ConfirmDialog into chat composer
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- useConfirmPolling activated when a connector is attached and Agent is streaming
- Render ConfirmDialog at bottom of Playground; backend pending-confirms now
  reach the user as a bottom-right modal
- 300s backend timeout matches dialog countdown — auto-deny on lapse
---
 web/pages/index.tsx | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/web/pages/index.tsx b/web/pages/index.tsx
index 77fcb41c0..198fbbbdf 100644
--- a/web/pages/index.tsx
+++ b/web/pages/index.tsx
@@ -14,6 +14,8 @@ import ManusRightPanel, {
 } from '@/new-components/chat/content/ManusRightPanel';
 import { MessagePart, ToolPart, ToolStatus } from '@/new-components/chat/content/OpenCodeSessionTurn';
 import { ConnectorInstance, AttachedConnector } from '@/new-components/connector/types';
+import { useConfirmPolling } from '@/new-components/connector/useConfirmPolling';
+import ConfirmDialog from '@/new-components/connector/ConfirmDialog';
 import { useConnectors } from '@/hooks/use-connector-api';
 import axios from '@/utils/ctx-axios';
 import { sendSpacePostRequest } from '@/utils/request';
@@ -582,6 +584,11 @@ const Playground: NextPage = () => {
   const [connectorSearchQuery, setConnectorSearchQuery] = useState('');
   const { connectors: connectorsList } = useConnectors();
 
+  const isConfirmPollingActive = loading && selectedConnectors.length > 0;
+  const { pendingConfirmation, approve, deny, dismiss } = useConfirmPolling({
+    isActive: isConfirmPollingActive,
+  });
+
   const [selectedStepId, setSelectedStepId] = useState<string | null>(null);
   const [rightPanelCollapsed, setRightPanelCollapsed] = useState(false);
   const [rightPanelView, setRightPanelView] = useState<PanelView>('execution');
@@ -3875,6 +3882,12 @@ const Playground: NextPage = () => {
             </Button>
           </div>
         </Modal>
+        <ConfirmDialog
+          confirmation={pendingConfirmation}
+          onApprove={approve}
+          onDeny={deny}
+          onDismiss={dismiss}
+        />
       </div>
     </ConfigProvider>
   );