From 505ceab895b428da9e0840e028522cf5484f0fc8 Mon Sep 17 00:00:00 2001
From: OG T <ogt@WOOOMacMiniM4.local>
Date: Thu, 26 Mar 2026 14:02:41 +0800
Subject: [PATCH] =?UTF-8?q?fix(web):=20=E5=AF=A9=E6=A0=B8=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90=E5=BE=8C=E6=AD=A3=E7=A2=BA=E5=B0=8E=E8=88=AA=E5=88=B0?=
 =?UTF-8?q?=E4=B8=8B=E4=B8=80=E5=BC=B5=E5=8D=A1=E7=89=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

問題: handleApprove 是異步的，但 setSelectedIndex 不等它完成就執行

修復:
1. fetchPendingApprovals 返回新的審核數量
2. handleApprove 返回 newCount
3. onApprove 使用 await 等待完成後，根據 newCount 決定導航
4. newCount > 0 且 index 有效: 保持 Modal 開啟顯示下一筆
5. newCount = 0: 關閉 Modal

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
---
 .../components/ai/openclaw-state-machine.tsx  | 32 ++++++++++++-------
 1 file changed, 21 insertions(+), 11 deletions(-)

diff --git a/apps/web/src/components/ai/openclaw-state-machine.tsx b/apps/web/src/components/ai/openclaw-state-machine.tsx
index 48b75eeb2..9a89ff2ba 100644
--- a/apps/web/src/components/ai/openclaw-state-machine.tsx
+++ b/apps/web/src/components/ai/openclaw-state-machine.tsx
@@ -126,9 +126,9 @@ export function OpenClawStateMachine({
   // ==========================================================================
   // API: Fetch Pending Approvals
   // ==========================================================================
-  const fetchPendingApprovals = useCallback(async () => {
+  const fetchPendingApprovals = useCallback(async (): Promise<number> => {
     const apiBaseUrl = getApiBaseUrl()
-    if (!apiBaseUrl) return
+    if (!apiBaseUrl) return 0
 
     setIsLoading(true)
     setError(null)
@@ -160,10 +160,12 @@ export function OpenClawStateMachine({
       }
 
       console.log('[OpenClaw] Fetched approvals:', data.count)
+      return data.count
     } catch (err) {
       const message = err instanceof Error ? err.message : 'Unknown error'
       setError(message)
       console.error('[OpenClaw] Fetch error:', message)
+      return 0
     } finally {
       setIsLoading(false)
     }
@@ -205,11 +207,13 @@ export function OpenClawStateMachine({
       }
 
       console.log('[OpenClaw] Approval signed by', signer.name, ':', approvalId)
-      // Refresh approvals list
-      await fetchPendingApprovals()
+      // Refresh approvals list and return new count
+      const newCount = await fetchPendingApprovals()
+      return newCount
     } catch (err) {
       console.error('[OpenClaw] Sign error:', err)
       setError(err instanceof Error ? err.message : 'Sign failed')
+      return -1
     }
   }, [fetchPendingApprovals])
 
@@ -423,17 +427,23 @@ export function OpenClawStateMachine({
         {selectedApproval && (
           <ApprovalCard
             request={selectedApproval}
-            onApprove={() => {
-              handleApprove(selectedApproval.id)
-              // 簽核後移到下一個或關閉
-              if (selectedIndex !== null && selectedIndex < pendingApprovals.length - 1) {
-                setSelectedIndex(selectedIndex + 1)
+            onApprove={async () => {
+              const newCount = await handleApprove(selectedApproval.id) ?? 0
+              // 簽核後: 根據 API 返回的新數量決定導航
+              if (newCount > 0 && selectedIndex !== null) {
+                // 還有待審核項目，保持 Modal 開啟
+                // 如果當前 index 超出範圍，調整到最後一筆
+                if (selectedIndex >= newCount) {
+                  setSelectedIndex(newCount - 1)
+                }
+                // 否則保持 index 不變，列表刷新後自動顯示下一筆
               } else {
+                // 沒有待審核項目了，關閉 Modal
                 setSelectedIndex(null)
               }
             }}
-            onReject={() => {
-              handleReject(selectedApproval.id)
+            onReject={async () => {
+              await handleReject(selectedApproval.id)
               setSelectedIndex(null)
             }}
             holdDuration={1000}