From 3366265f1d763bc75f93b6d17afb8f6c026036a1 Mon Sep 17 00:00:00 2001
From: Your Name <your.email@example.com>
Date: Thu, 22 Jan 2026 20:12:41 +0800
Subject: [PATCH] fix: prevent navigation to homepage when clicking buttons in
 angle edit dialog

---
 components/angle-edit-dialog.tsx | 29 +++++++++++++++++++++++++----
 1 file changed, 25 insertions(+), 4 deletions(-)

diff --git a/components/angle-edit-dialog.tsx b/components/angle-edit-dialog.tsx
index 81505bf33..edd42c3e8 100644
--- a/components/angle-edit-dialog.tsx
+++ b/components/angle-edit-dialog.tsx
@@ -56,6 +56,15 @@ export function AngleEditDialog({
     }
   }, [resultUrl]);
 
+  // 处理对话框关闭（防止意外触发导航）
+  const handleOpenChange = useCallback((newOpen: boolean) => {
+    // 只有在明确关闭时才调用 onOpenChange
+    // 避免在处理过程中意外关闭
+    if (!newOpen && !isProcessing) {
+      onOpenChange(newOpen);
+    }
+  }, [isProcessing, onOpenChange]);
+
   // 处理相机状态变化
   const handleCameraStateChange = useCallback((state: CameraState) => {
     setCameraState(state);
@@ -66,7 +75,11 @@ export function AngleEditDialog({
   }, [isProcessing]);
 
   // 生成新视角
-  const handleGenerate = useCallback(async () => {
+  const handleGenerate = useCallback(async (e?: React.MouseEvent) => {
+    if (e) {
+      e.stopPropagation(); // 阻止事件冒泡，避免触发外层的 onCancel
+    }
+    
     setIsProcessing(true);
     setResultUrl(null);
     setActiveTab("result"); // 切换到结果 Tab 显示加载状态
@@ -124,14 +137,22 @@ export function AngleEditDialog({
   }, [resultUrl, cameraState]);
 
   // 使用此图片（直接发送到聊天）
-  const handleUseImage = useCallback(() => {
+  const handleUseImage = useCallback((e?: React.MouseEvent) => {
+    if (e) {
+      e.stopPropagation(); // 阻止事件冒泡，避免触发外层的 onCancel
+      e.preventDefault(); // 阻止默认行为
+    }
+    
     if (resultUrl) {
       // 如果提供了 onComplete 回调，调用它
       if (onComplete) {
         onComplete(resultUrl);
       }
       // 关闭对话框，图片已经通过 API 保存到数据库
-      onOpenChange(false);
+      // 使用 setTimeout 确保回调先执行，避免事件冒泡
+      setTimeout(() => {
+        onOpenChange(false);
+      }, 100);
       toast.success("图片已添加到对话");
     }
   }, [resultUrl, onOpenChange, onComplete]);
@@ -149,7 +170,7 @@ export function AngleEditDialog({
   }, []);
 
   return (
-    <Dialog open={open} onOpenChange={onOpenChange}>
+    <Dialog open={open} onOpenChange={handleOpenChange}>
       <DialogContent className="max-w-4xl p-0 gap-0 overflow-hidden border-none shadow-2xl bg-background/95 backdrop-blur-xl">
         {/* 紧凑标题栏 */}
         <div className="flex items-center justify-between px-4 py-3 border-b bg-muted/20">