fix(chat): show unlock dialog over image viewer

This commit is contained in:
2026-06-30 11:54:04 +08:00
parent 6e811b0e09
commit c1dbd93ce1
2 changed files with 30 additions and 23 deletions
@@ -1,7 +1,7 @@
.overlay { .overlay {
position: fixed; position: fixed;
inset: 0; inset: 0;
z-index: 75; z-index: 200;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@@ -39,22 +39,36 @@ export function ChatImageViewerScreen({
router.push(getChatPaywallNavigationUrl(authState.loginStatus)); 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) { if (!message) {
return ( return (
<MobileShell background="#0d0b14"> <>
<main className={styles.emptyScreen}> <MobileShell background="#0d0b14">
<button <main className={styles.emptyScreen}>
type="button" <button
className={styles.backButton} type="button"
onClick={handleClose} className={styles.backButton}
> onClick={handleClose}
Back to chat >
</button> Back to chat
<p className={styles.emptyText}> </button>
{chatState.historyLoaded ? "Image not found." : "Loading image..."} <p className={styles.emptyText}>
</p> {chatState.historyLoaded ? "Image not found." : "Loading image..."}
</main> </p>
</MobileShell> </main>
</MobileShell>
{historyUnlockDialog}
</>
); );
} }
@@ -68,14 +82,7 @@ export function ChatImageViewerScreen({
onClose={handleClose} onClose={handleClose}
/> />
</MobileShell> </MobileShell>
<HistoryUnlockDialog {historyUnlockDialog}
open={chatState.unlockHistoryPromptVisible}
lockedCount={chatState.lockedHistoryCount}
isLoading={chatState.isUnlockingHistory}
errorMessage={chatState.unlockHistoryError}
onClose={() => chatDispatch({ type: "ChatUnlockHistoryDismissed" })}
onConfirm={() => chatDispatch({ type: "ChatUnlockHistoryConfirmed" })}
/>
</> </>
); );
} }