diff --git a/src/components/ChatMessage.tsx b/src/components/ChatMessage.tsx index 97721c5..d45c4cd 100644 --- a/src/components/ChatMessage.tsx +++ b/src/components/ChatMessage.tsx @@ -43,8 +43,9 @@ const parseMessage = (message: string | undefined) => { const parseUI = (message: string | undefined, onLoaded: () => void) => { if (message && message.includes('<')) { let messageParser = new MessageUIHelper(message, () => onLoaded()); + let element = messageParser.build(); - return { standalone: true, element: messageParser.build() }; + return { standalone: messageParser.containsImages, element: element }; } return { standalone: false, element: message }; diff --git a/src/helper/MessageUIHelper.tsx b/src/helper/MessageUIHelper.tsx index 994c70f..695cd02 100644 --- a/src/helper/MessageUIHelper.tsx +++ b/src/helper/MessageUIHelper.tsx @@ -5,6 +5,7 @@ import UrlPreview from '../components/UrlPreview'; export default class MessageUIHelper { private input: string; + private _containsImages: boolean = false; private loaded: (() => void) | undefined; constructor(input: string, loaded?: () => void) { @@ -12,11 +13,16 @@ export default class MessageUIHelper { this.loaded = loaded; } + get containsImages() { + return this._containsImages; + } + build() { const options: HTMLReactParserOptions = { replace: ({ name, attribs, children }: any) => { switch (name) { case 'img': + this._containsImages = true; return ( );