diff --git a/src/components/middle/helpers/groupMessages.ts b/src/components/middle/helpers/groupMessages.ts index f4ab6469f..12db830f3 100644 --- a/src/components/middle/helpers/groupMessages.ts +++ b/src/components/middle/helpers/groupMessages.ts @@ -38,11 +38,20 @@ export function groupMessages( albumId: message.groupedId!, messages: [message], mainMessage: message, + hasMultipleCaptions: false, }; } else { currentAlbum.messages.push(message); - if (message.hasComments || (message.content.text && !currentAlbum.mainMessage.hasComments)) { - currentAlbum.mainMessage = message; + if (message.hasComments) { + currentAlbum.commentsMessage = message; + } + if (message.content.text && !currentAlbum.hasMultipleCaptions) { + if (currentAlbum.captionMessage) { + currentAlbum.hasMultipleCaptions = true; + currentAlbum.captionMessage = undefined; + } else { + currentAlbum.captionMessage = message; + } } } } else { diff --git a/src/components/middle/message/Message.tsx b/src/components/middle/message/Message.tsx index 4addb9004..3b797cf57 100644 --- a/src/components/middle/message/Message.tsx +++ b/src/components/middle/message/Message.tsx @@ -541,7 +541,6 @@ const Message: FC = ({ const avatarPeer = shouldPreferOriginSender ? originSender : messageSender; const messageColorPeer = originSender || sender; const senderPeer = (forwardInfo || message.content.storyData) ? originSender : messageSender; - const hasText = hasMessageText(message); const hasTtl = hasMessageTtl(message); const { @@ -623,6 +622,9 @@ const Message: FC = ({ } }, [focusLastMessage, isLastInList, transcribedText, withVoiceTranscription]); + const textMessage = album?.hasMultipleCaptions ? undefined : (album?.captionMessage || message); + const hasText = textMessage && hasMessageText(textMessage); + const containerClassName = buildClassName( 'Message message-list-item', isFirstInGroup && 'first-in-group', @@ -654,12 +656,13 @@ const Message: FC = ({ ); const { - text, photo, video, audio, + photo, video, audio, voice, document, sticker, contact, poll, webPage, invoice, location, action, game, storyData, giveaway, giveawayResults, } = getMessageContent(message); + const text = textMessage && getMessageContent(textMessage).text; const { replyToMsgId, replyToPeerId, isQuote } = messageReplyInfo || {}; const { peerId: storyReplyPeerId, storyId: storyReplyId } = storyReplyInfo || {}; @@ -692,7 +695,7 @@ const Message: FC = ({ const withQuickReactionButton = !isTouchScreen && !phoneCall && !isInSelectMode && defaultReaction && !isInDocumentGroupNotLast && !isStoryMention && !hasTtl; - const contentClassName = buildContentClassName(message, { + const contentClassName = buildContentClassName(message, album, { hasSubheader, isCustomShape, isLastInGroup, @@ -889,9 +892,10 @@ const Message: FC = ({ } function renderMessageText(isForAnimation?: boolean) { + if (!textMessage) return undefined; return ( ( const { canReply } = (messageListType === 'thread' && selectAllowedMessageActions(global, message, threadId)) || {}; const isDownloading = selectIsDownloading(global, message); - const repliesThreadInfo = selectThreadInfo(global, chatId, album?.mainMessage.id || id); + const repliesThreadInfo = selectThreadInfo(global, chatId, album?.commentsMessage?.id || id); const isInDocumentGroup = Boolean(message.groupedId) && !message.isInAlbum; const documentGroupFirstMessageId = isInDocumentGroup diff --git a/src/components/middle/message/helpers/buildContentClassName.ts b/src/components/middle/message/helpers/buildContentClassName.ts index 6f412cab3..73ee88948 100644 --- a/src/components/middle/message/helpers/buildContentClassName.ts +++ b/src/components/middle/message/helpers/buildContentClassName.ts @@ -1,10 +1,12 @@ import type { ApiMessage } from '../../../../api/types'; +import type { IAlbum } from '../../../../types'; import { EMOJI_SIZES, MESSAGE_CONTENT_CLASS_NAME } from '../../../../config'; import { getMessageContent } from '../../../../global/helpers'; export function buildContentClassName( message: ApiMessage, + album?: IAlbum, { hasSubheader, isCustomShape, @@ -34,9 +36,10 @@ export function buildContentClassName( } = {}, ) { const { - text, photo, video, audio, voice, document, poll, webPage, contact, location, invoice, storyData, + photo, video, audio, voice, document, poll, webPage, contact, location, invoice, storyData, giveaway, giveawayResults, } = getMessageContent(message); + const text = album?.hasMultipleCaptions ? undefined : getMessageContent(album?.captionMessage || message).text; const classNames = [MESSAGE_CONTENT_CLASS_NAME]; const isMedia = storyData || photo || video || location || invoice?.extendedMedia; diff --git a/src/types/index.ts b/src/types/index.ts index 34a5f76cc..704f74c54 100644 --- a/src/types/index.ts +++ b/src/types/index.ts @@ -27,6 +27,9 @@ export interface IAlbum { albumId: string; messages: ApiMessage[]; mainMessage: ApiMessage; + captionMessage?: ApiMessage; + hasMultipleCaptions: boolean; + commentsMessage?: ApiMessage; } export type ThreadId = string | number;