feat(chat): unlock history after payment

src/app/chat/chat-screen.tsx

@@ -5,7 +5,7 @@ import Image from "next/image";
 import { useRouter } from "next/navigation";
 
 import { useAuthState } from "@/stores/auth/auth-context";
-import { useChatState } from "@/stores/chat/chat-context";
+import { useChatDispatch, useChatState } from "@/stores/chat/chat-context";
 
 import { MobileShell } from "@/app/_components/core";
 
@@ -16,6 +16,7 @@ import {
   ChatInputBar,
   ChatQuotaExhaustedBanner,
   ExternalBrowserDialog,
+  HistoryUnlockDialog,
   PwaInstallOverlay,
 } from "./components";
 import {
@@ -31,6 +32,7 @@ import styles from "./components/chat-screen.module.css";
 
 export function ChatScreen() {
   const state = useChatState();
+  const chatDispatch = useChatDispatch();
   const authState = useAuthState();
   const router = useRouter();
   const [showExternalBrowserDialog, setShowExternalBrowserDialog] =
@@ -159,6 +161,15 @@ export function ChatScreen() {
           onClose={() => setShowExternalBrowserDialog(false)}
           onConfirm={() => void handleOpenExternalBrowser()}
         />
+
+        <HistoryUnlockDialog
+          open={state.unlockHistoryPromptVisible}
+          lockedCount={state.lockedHistoryCount}
+          isLoading={state.isUnlockingHistory}
+          errorMessage={state.unlockHistoryError}
+          onClose={() => chatDispatch({ type: "ChatUnlockHistoryDismissed" })}
+          onConfirm={() => chatDispatch({ type: "ChatUnlockHistoryConfirmed" })}
+        />
       </div>
     </MobileShell>
   );