remix-nlux/packages/shared/src/components/Message/utils/updateContentOnMessageChange.ts

Remix IDE NLUX integration. Remix IDE is the leading IDE for building and deploying smart contracts on Ethereum. NLUX is a JavaScript and React library for building conversational AI experiences.

import {emptyInnerHtml} from '../../../utils/dom/emptyInnerHtml';
import {MessageProps} from '../props';
import {createMessageContent} from './createMessageContent';

export const updateContentOnMessageChange = (
    element: HTMLElement,
    propsBefore: MessageProps,
    propsAfter: MessageProps,
) => {
    if (
        propsBefore.message === propsAfter.message &&
        propsBefore.format === propsAfter.format
    ) {
        return;
    }

    emptyInnerHtml(element);
    element.append(
        createMessageContent(propsAfter.message ?? '', propsAfter.format, {
            htmlSanitizer: propsAfter.htmlSanitizer,
        }),
    );
};