feat(chat): add private message unlock flow

src/app/chat/components/message-bubble.tsx

@@ -15,12 +15,26 @@ import { MessageContent } from "./message-content";
 import styles from "./chat-area.module.css";
 
 export interface MessageBubbleProps {
+  id?: string;
   content: string;
   imageUrl?: string | null;
   isFromAI: boolean;
+  privateLocked?: boolean | null;
+  privateHint?: string | null;
+  isUnlockingPrivate?: boolean;
+  onUnlockPrivateMessage?: (messageId: string) => void;
 }
 
-export function MessageBubble({ content, imageUrl, isFromAI }: MessageBubbleProps) {
+export function MessageBubble({
+  id,
+  content,
+  imageUrl,
+  isFromAI,
+  privateLocked,
+  privateHint,
+  isUnlockingPrivate,
+  onUnlockPrivateMessage,
+}: MessageBubbleProps) {
   const { avatarUrl } = useUserState();
 
   if (isFromAI) {
@@ -29,9 +43,14 @@ export function MessageBubble({ content, imageUrl, isFromAI }: MessageBubbleProp
         <MessageAvatar isFromAI={true} />
         <div style={{ width: 8 }} />
         <MessageContent
+          messageId={id}
           content={content}
           imageUrl={imageUrl}
           isFromAI={true}
+          privateLocked={privateLocked}
+          privateHint={privateHint}
+          isUnlockingPrivate={isUnlockingPrivate}
+          onUnlockPrivateMessage={onUnlockPrivateMessage}
         />
         <div style={{ width: 43 }} /> {/* 占位：保持与头像宽度一致 */}
       </div>
@@ -41,7 +60,16 @@ export function MessageBubble({ content, imageUrl, isFromAI }: MessageBubbleProp
   return (
     <div className={styles.bubbleRowUser} aria-label="User message">
       <div style={{ width: 43 }} /> {/* 占位 */}
-      <MessageContent content={content} imageUrl={imageUrl} isFromAI={false} />
+      <MessageContent
+        messageId={id}
+        content={content}
+        imageUrl={imageUrl}
+        isFromAI={false}
+        privateLocked={privateLocked}
+        privateHint={privateHint}
+        isUnlockingPrivate={isUnlockingPrivate}
+        onUnlockPrivateMessage={onUnlockPrivateMessage}
+      />
       <div style={{ width: 8 }} />
       <MessageAvatar isFromAI={false} userAvatarUrl={avatarUrl} />
     </div>