Fix message flickering during streaming

- Use stable React keys in MessageList to prevent component remounting
- Remove flex-1 constraint from markdown wrapper to allow natural height
- Prevents user message from resizing while assistant response streams

Author: amrmelsayed

src/components/chat/MessageBubble.tsx

@@ -103,7 +103,7 @@ const MessageBubble: React.FC<MessageBubbleProps> = ({
         <StyledText className='text-base leading-5 font-semibold mb-3 mt-1.5' color='primary' textAlign='left'>
           {isOutgoing ? (isShare ? t('anonymous') : t('you')) : t('ansariChat')}
         </StyledText>
-        <View className='flex-1 px-1'>
+        <View className='px-1'>
           <Markdown
             style={{
               body: [styles.messageText, textStyle],

src/components/chat/MessageList.tsx

@@ -107,7 +107,7 @@ const MessageList = forwardRef<MessageListRef, MessageListProps>(
           }}
         >
           {filteredMessages.map((message: Message, index) => {
-            const id = message.id || Helpers.generateUniqueId() + (isSending ? '-sending' : '')
+            const id = message.id || `${index}-sending`
 
             return (
               <MessageBubbleMemo