2024-01-25 16:28:41 +03:00
|
|
|
import { memo } from 'preact/compat';
|
|
|
|
|
2024-03-25 12:58:56 +03:00
|
|
|
import CustomEmoji from './custom-emoji';
|
|
|
|
|
2023-06-14 12:37:41 +03:00
|
|
|
function EmojiText({ text, emojis }) {
|
|
|
|
if (!text) return '';
|
|
|
|
if (!emojis?.length) return text;
|
|
|
|
if (text.indexOf(':') === -1) return text;
|
2023-08-08 09:04:12 +03:00
|
|
|
const regex = new RegExp(
|
|
|
|
`:(${emojis.map((e) => e.shortcode).join('|')}):`,
|
|
|
|
'g',
|
|
|
|
);
|
|
|
|
const elements = text.split(regex).map((word) => {
|
|
|
|
const emoji = emojis.find((e) => e.shortcode === word);
|
|
|
|
if (emoji) {
|
2023-08-08 10:34:24 +03:00
|
|
|
const { url, staticUrl } = emoji;
|
2024-03-25 12:58:56 +03:00
|
|
|
return <CustomEmoji staticUrl={staticUrl} alt={word} url={url} />;
|
2023-06-14 12:37:41 +03:00
|
|
|
}
|
2023-08-08 09:04:12 +03:00
|
|
|
return word;
|
2023-06-14 12:37:41 +03:00
|
|
|
});
|
2023-08-08 09:04:12 +03:00
|
|
|
return elements;
|
2023-06-14 12:37:41 +03:00
|
|
|
}
|
|
|
|
|
2024-01-25 16:28:41 +03:00
|
|
|
export default memo(
|
|
|
|
EmojiText,
|
|
|
|
(oldProps, newProps) =>
|
|
|
|
oldProps.text === newProps.text &&
|
|
|
|
oldProps.emojis?.length === newProps.emojis?.length,
|
|
|
|
);
|