feat(ChatScreen): enhance message input and attachment handling
Some checks failed
Frontend CI / build-and-push-web (push) Successful in 8m3s
Frontend CI / ota-android (push) Successful in 11m1s
Frontend CI / build-android-apk (push) Has been cancelled

- Updated ChatInput to manage pending attachments, allowing users to upload multiple images before sending.
- Introduced functionality to remove pending attachments and display their thumbnails in the input area.
- Enhanced ChatScreen to reflect changes in attachment handling, including dynamic messaging during uploads.
- Refactored message segment rendering to support inline text and grouped images, improving visual organization.
- Added constants for maximum pending images to enforce limits on user uploads.
This commit is contained in:
lafay
2026-03-25 03:44:16 +08:00
parent 583ac64dfd
commit dc8f9061ab
7 changed files with 338 additions and 95 deletions

View File

@@ -107,11 +107,14 @@ export const MessageBubble: React.FC<MessageBubbleProps> = ({
// 检查是否有消息链(必须使用 segments 格式)
// 安全检查:确保 segments 是数组
const segments = Array.isArray(message.segments) ? message.segments : [];
const hasSegments = segments.length > 0;
// 检查是否是图片消息
const hasSegments = segments.length > 0;
// 检查是否是图片消息
const isImage = Array.isArray(segments) && segments.some(s => s.type === 'image');
// 检查是否是纯图片消息只有图片segment没有文本等其他内容
const isPureImageMessage = isImage && segments.every(s => s.type === 'image' || !s.type);
// 纯图片:除 reply 外均为 image支持多图同条
const segmentsWithoutReply = segments.filter(s => s.type !== 'reply');
const isPureImageMessage =
segmentsWithoutReply.length > 0 &&
segmentsWithoutReply.every(s => s.type === 'image');
// 提取所有图片 segments
const imageSegments = segments