diff --git a/src/components/common/CustomEmoji.module.scss b/src/components/common/CustomEmoji.module.scss index 24416edc9..f3bb416c8 100644 --- a/src/components/common/CustomEmoji.module.scss +++ b/src/components/common/CustomEmoji.module.scss @@ -11,6 +11,13 @@ } } +.placeholder { + width: 90%; + height: 90%; + background-color: #77777719; + border-radius: 0.3125rem !important; +} + .thumb { width: 100%; height: 100%; diff --git a/src/components/common/CustomEmoji.tsx b/src/components/common/CustomEmoji.tsx index fba5d293b..24a5746b8 100644 --- a/src/components/common/CustomEmoji.tsx +++ b/src/components/common/CustomEmoji.tsx @@ -1,4 +1,4 @@ -import type { FC, TeactNode } from '../../lib/teact/teact'; +import type { FC } from '../../lib/teact/teact'; import React, { memo, useRef, useState } from '../../lib/teact/teact'; import { getGlobal } from '../../global'; @@ -18,18 +18,17 @@ import StickerView from './StickerView'; import styles from './CustomEmoji.module.scss'; import blankImg from '../../assets/blank.png'; -import svgPlaceholder from '../../assets/square.svg'; type OwnProps = { ref?: React.RefObject; documentId: string; - children?: TeactNode; - size?: number; className?: string; - loopLimit?: number; style?: string; + size?: number; isBig?: boolean; noPlay?: boolean; + loopLimit?: number; + isSelectable?: boolean; withSharedAnimation?: boolean; sharedCanvasRef?: React.RefObject; sharedCanvasHqRef?: React.RefObject; @@ -48,12 +47,13 @@ const STICKER_SIZE = 20; const CustomEmoji: FC = ({ ref, documentId, + className, + style, size = STICKER_SIZE, isBig, noPlay, - className, loopLimit, - style, + isSelectable, withSharedAnimation, sharedCanvasRef, sharedCanvasHqRef, @@ -123,16 +123,18 @@ const CustomEmoji: FC = ({ data-alt={customEmoji?.emoji} style={style} > - {customEmoji?.emoji} + {isSelectable && ( + {customEmoji?.emoji} + )} {!customEmoji ? ( - Emoji +
) : ( + ? : ''; const topicString = topic ? `${topic.title}` : 'a topic'; processed = processPlaceholder( @@ -153,7 +153,7 @@ export function renderActionMessageText( processed = processPlaceholder( unprocessed, '%action_topic_icon%', - hasIcon ? + hasIcon ? : topic ? : '...', ); unprocessed = processed.pop() as string; diff --git a/src/components/common/helpers/renderTextWithEntities.tsx b/src/components/common/helpers/renderTextWithEntities.tsx index 11e71a158..6d2632eb0 100644 --- a/src/components/common/helpers/renderTextWithEntities.tsx +++ b/src/components/common/helpers/renderTextWithEntities.tsx @@ -439,6 +439,7 @@ function processEntity({ key={cacheBuster ? `${cacheBuster}-${entity.offset}` : undefined} documentId={entity.documentId} size={emojiSize} + isSelectable withSharedAnimation sharedCanvasRef={sharedCanvasRef} sharedCanvasHqRef={sharedCanvasHqRef} @@ -568,6 +569,7 @@ function processEntity({ key={cacheBuster ? `${cacheBuster}-${entity.offset}` : undefined} documentId={entity.documentId} size={emojiSize} + isSelectable withSharedAnimation sharedCanvasRef={sharedCanvasRef} sharedCanvasHqRef={sharedCanvasHqRef}