diff --git a/src/components/common/embedded/EmbeddedMessage.tsx b/src/components/common/embedded/EmbeddedMessage.tsx index e5d9bc725..bd0cdf245 100644 --- a/src/components/common/embedded/EmbeddedMessage.tsx +++ b/src/components/common/embedded/EmbeddedMessage.tsx @@ -20,6 +20,7 @@ import { isMessageTranslatable, } from '../../../global/helpers'; import buildClassName from '../../../util/buildClassName'; +import freezeWhenClosed from '../../../util/hoc/freezeWhenClosed'; import { getPictogramDimensions } from '../helpers/mediaDimensions'; import { getPeerColorClass } from '../helpers/peerColor'; import renderText from '../helpers/renderText'; @@ -54,6 +55,7 @@ type OwnProps = { isInComposer?: boolean; chatTranslations?: ChatTranslatedMessages; requestedChatTranslationLanguage?: string; + isOpen?: boolean; observeIntersectionForLoading?: ObserveFn; observeIntersectionForPlaying?: ObserveFn; onClick: NoneToVoidFunction; @@ -256,4 +258,6 @@ function renderPictogram( ); } +export const ClosableEmbeddedMessage = freezeWhenClosed(EmbeddedMessage); + export default EmbeddedMessage; diff --git a/src/components/middle/composer/ComposerEmbeddedMessage.tsx b/src/components/middle/composer/ComposerEmbeddedMessage.tsx index a8e1fdb92..3cc369b21 100644 --- a/src/components/middle/composer/ComposerEmbeddedMessage.tsx +++ b/src/components/middle/composer/ComposerEmbeddedMessage.tsx @@ -27,13 +27,14 @@ import captureEscKeyListener from '../../../util/captureEscKeyListener'; import { getPeerColorClass } from '../../common/helpers/peerColor'; import useContextMenuHandlers from '../../../hooks/useContextMenuHandlers'; +import useCurrentOrPrev from '../../../hooks/useCurrentOrPrev'; import useLang from '../../../hooks/useLang'; import useLastCallback from '../../../hooks/useLastCallback'; import useMenuPosition from '../../../hooks/useMenuPosition'; import useShowTransition from '../../../hooks/useShowTransition'; import useAsyncRendering from '../../right/hooks/useAsyncRendering'; -import EmbeddedMessage from '../../common/embedded/EmbeddedMessage'; +import { ClosableEmbeddedMessage } from '../../common/embedded/EmbeddedMessage'; import Icon from '../../common/Icon'; import Button from '../../ui/Button'; import Menu from '../../ui/Menu'; @@ -165,9 +166,10 @@ const ComposerEmbeddedMessage: FC = ({ }, [handleContextMenuClose, shouldRender]); const className = buildClassName('ComposerEmbeddedMessage', transitionClassNames); + const renderingSender = useCurrentOrPrev(sender, true); const innerClassName = buildClassName( 'ComposerEmbeddedMessage_inner', - getPeerColorClass(sender), + getPeerColorClass(renderingSender), ); const isShowingReply = replyInfo && !shouldForceShowEditing; @@ -203,6 +205,8 @@ const ComposerEmbeddedMessage: FC = ({ }; }, [isCurrentUserPremium, isForwarding, message, noAuthors]); + const renderingLeftIcon = useCurrentOrPrev(leftIcon, true); + if (!shouldRender) { return undefined; } @@ -211,12 +215,13 @@ const ComposerEmbeddedMessage: FC = ({
- {leftIcon && } + {renderingLeftIcon && } {Boolean(replyInfo?.quoteText) && ( )}
-