remix-nlux/packages/js/core/src/sections/miscellaneous/exceptionsBox/render.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 {createExceptionsBoxController, ExceptionsBoxController} from '@shared/components/ExceptionsBox/control';
import {createExceptionsBoxDom} from '@shared/components/ExceptionsBox/create';
import {CompRenderer} from '../../../types/comp';
import {
    CompExceptionsBoxActions,
    CompExceptionsBoxElements,
    CompExceptionsBoxEvents,
    CompExceptionsBoxProps,
} from './types';

export const renderExceptionsBox: CompRenderer<
    CompExceptionsBoxProps,
    CompExceptionsBoxElements,
    CompExceptionsBoxEvents,
    CompExceptionsBoxActions
> = ({
    props,
    appendToRoot,
}) => {
    const exceptionsBoxRoot = createExceptionsBoxDom();
    appendToRoot(exceptionsBoxRoot);

    let controller: ExceptionsBoxController | undefined = createExceptionsBoxController(exceptionsBoxRoot);

    return {
        elements: {
            root: exceptionsBoxRoot,
        },
        actions: {
            displayException: (message: string) => {
                controller?.displayException(message);
            },
        },
        onDestroy: () => {
            controller?.destroy();
            exceptionsBoxRoot.remove();
            controller = undefined;
        },
    };
};