From c1dbd93ce15c4f012da1d44fc93c6e7933d4be92 Mon Sep 17 00:00:00 2001
From: chenhang <averych@126.com>
Date: Tue, 30 Jun 2026 11:54:04 +0800
Subject: [PATCH] fix(chat): show unlock dialog over image viewer

---
 .../history-unlock-dialog.module.css          |  2 +-
 .../[messageId]/chat-image-viewer-screen.tsx  | 51 +++++++++++--------
 2 files changed, 30 insertions(+), 23 deletions(-)

diff --git a/src/app/chat/components/history-unlock-dialog.module.css b/src/app/chat/components/history-unlock-dialog.module.css
index 67bbe8d4..180d4d78 100644
--- a/src/app/chat/components/history-unlock-dialog.module.css
+++ b/src/app/chat/components/history-unlock-dialog.module.css
@@ -1,7 +1,7 @@
 .overlay {
   position: fixed;
   inset: 0;
-  z-index: 75;
+  z-index: 200;
   display: flex;
   align-items: center;
   justify-content: center;
diff --git a/src/app/chat/image/[messageId]/chat-image-viewer-screen.tsx b/src/app/chat/image/[messageId]/chat-image-viewer-screen.tsx
index 847ffa57..568f33aa 100644
--- a/src/app/chat/image/[messageId]/chat-image-viewer-screen.tsx
+++ b/src/app/chat/image/[messageId]/chat-image-viewer-screen.tsx
@@ -39,22 +39,36 @@ export function ChatImageViewerScreen({
     router.push(getChatPaywallNavigationUrl(authState.loginStatus));
   };
 
+  const historyUnlockDialog = (
+    <HistoryUnlockDialog
+      open={chatState.unlockHistoryPromptVisible}
+      lockedCount={chatState.lockedHistoryCount}
+      isLoading={chatState.isUnlockingHistory}
+      errorMessage={chatState.unlockHistoryError}
+      onClose={() => chatDispatch({ type: "ChatUnlockHistoryDismissed" })}
+      onConfirm={() => chatDispatch({ type: "ChatUnlockHistoryConfirmed" })}
+    />
+  );
+
   if (!message) {
     return (
-      <MobileShell background="#0d0b14">
-        <main className={styles.emptyScreen}>
-          <button
-            type="button"
-            className={styles.backButton}
-            onClick={handleClose}
-          >
-            Back to chat
-          </button>
-          <p className={styles.emptyText}>
-            {chatState.historyLoaded ? "Image not found." : "Loading image..."}
-          </p>
-        </main>
-      </MobileShell>
+      <>
+        <MobileShell background="#0d0b14">
+          <main className={styles.emptyScreen}>
+            <button
+              type="button"
+              className={styles.backButton}
+              onClick={handleClose}
+            >
+              Back to chat
+            </button>
+            <p className={styles.emptyText}>
+              {chatState.historyLoaded ? "Image not found." : "Loading image..."}
+            </p>
+          </main>
+        </MobileShell>
+        {historyUnlockDialog}
+      </>
     );
   }
 
@@ -68,14 +82,7 @@ export function ChatImageViewerScreen({
           onClose={handleClose}
         />
       </MobileShell>
-      <HistoryUnlockDialog
-        open={chatState.unlockHistoryPromptVisible}
-        lockedCount={chatState.lockedHistoryCount}
-        isLoading={chatState.isUnlockingHistory}
-        errorMessage={chatState.unlockHistoryError}
-        onClose={() => chatDispatch({ type: "ChatUnlockHistoryDismissed" })}
-        onConfirm={() => chatDispatch({ type: "ChatUnlockHistoryConfirmed" })}
-      />
+      {historyUnlockDialog}
     </>
   );
 }