refactor(App, navigation): migrate to Expo Router and clean up navigation structure

- Updated App entry point to utilize Expo Router, simplifying the navigation setup.
- Removed legacy navigation components and services to streamline the codebase.
- Adjusted package.json to reflect the new entry point and updated dependencies for compatibility.
- Enhanced overall application structure by consolidating navigation logic and improving maintainability.

src/screens/message/components/ChatScreen/MessageBubble.tsx

@@ -120,7 +120,7 @@ export const MessageBubble: React.FC<MessageBubbleProps> = ({
       const data = s.data as ImageSegmentData;
       return {
         id: `img-${message.id}-${idx}`,
-        url: data.url,
+        url: data.url || data.thumbnail_url || '',
         thumbnail_url: data.thumbnail_url,
         width: data.width,
         height: data.height,
@@ -128,7 +128,6 @@ export const MessageBubble: React.FC<MessageBubbleProps> = ({
     });
   
   // 检查当前消息是否被选中
-  const isSelected = selectedMessageId === String(message.id);
   
   // 获取发送者信息（群聊）- 供子组件使用
   const getSenderInfo = React.useCallback((senderId: string): SenderInfo => {
@@ -307,7 +306,6 @@ export const MessageBubble: React.FC<MessageBubbleProps> = ({
         isMe ? styles.myBubble : styles.theirBubble,
         hasReply && segmentStyles.replyBubble,
         isPureImageMessage && segmentStyles.pureImageBubble,
-        isSelected && (isMe ? styles.mySelectedBubble : styles.theirSelectedBubble),
       ]}>
         <MessageSegmentsRenderer
           segments={segments}
@@ -320,7 +318,9 @@ export const MessageBubble: React.FC<MessageBubbleProps> = ({
           onReplyPress={onReplyPress}
           onImagePress={(url) => {
             // 查找点击的图片索引
-            const clickIndex = imageSegments.findIndex(img => img.url === url);
+            const clickIndex = imageSegments.findIndex(
+              img => img.url === url || img.thumbnail_url === url
+            );
             if (clickIndex !== -1 && onImagePress) {
               onImagePress(imageSegments, clickIndex);
             }
@@ -419,7 +419,7 @@ export const MessageBubble: React.FC<MessageBubbleProps> = ({
             </TouchableOpacity>
           )}
           
-          <View style={styles.messageContent}>
+          <View style={[styles.messageContent, isMe ? styles.myMessageContentPanel : null]}>
             {/* 群聊模式：显示发送者昵称 */}
             {isGroupChat && !isMe && senderInfo && (
               <Text style={styles.senderName}>{senderInfo.nickname}</Text>
@@ -483,16 +483,4 @@ const segmentStyles = StyleSheet.create({
   },
 });
 
-// 使用 React.memo 优化渲染性能
-export default React.memo(MessageBubble, (prevProps, nextProps) => {
-  // 自定义比较逻辑：只比较关键属性
-  return (
-    prevProps.message.id === nextProps.message.id &&
-    prevProps.message.status === nextProps.message.status &&
-    prevProps.selectedMessageId === nextProps.selectedMessageId &&
-    prevProps.currentUserId === nextProps.currentUserId &&
-    prevProps.isGroupChat === nextProps.isGroupChat &&
-    prevProps.otherUserLastReadSeq === nextProps.otherUserLastReadSeq &&
-    prevProps.index === nextProps.index
-  );
-});
+export default MessageBubble;