@droneblocks/node-red-dexi/src/ros2-subscribe.html

You want to make sure you don't lose any of your flow development. Make sure to map the host "flows" directory to the container directory as shown below. This will store the flow on your host machine if/when the container is destroyed.

<script type="text/javascript">
    RED.nodes.registerType('ros2-subscribe',{
        category: 'DEXI',
        color: '#fef5ff',
        defaults: {
            server: {type: "ros2-websocket-server"},
            topicname: {value: ""},
            messagetype: {value: ""}
        },
        inputs:0,
        outputs:1,
        paletteLabel: 'ros2 subscribe',
        icon: "icon.png",
        label: function() {
            return this.topicname||"ros2 subscribe";
        },
        oneditprepare: function() {

            let node = this
            let topicsAndTypes = []

            $.getJSON('/dexi/topics', (topicsResponse) => {

                let merged = [];

                topicsResponse.topics.map((topic, i) => {
                    merged.push({topic: topic, type: topicsResponse.types[i]})
                })

                Object.assign(topicsAndTypes, merged)

                let mergedTopicsData = ""

                topicsAndTypes.map((object) => {

                    // Set the selected topic and message type
                    if (node.topicname === object.topic) {
                        mergedTopicsData += `<option value="${object.topic}" selected>${object.topic}</option>`
                        node.messagetype = object.type
                        $('#node-input-messagetype').text(object.type)
                    } else {
                        mergedTopicsData += `<option value="${object.topic}">${object.topic}</option>`
                    }
                })

                $('#node-input-topicname').html(mergedTopicsData)
            })

            $('#node-input-topicname').change((e) => {

                let val = $(e.target).val()
                
                // Changes triggers on load
                if (val == null) return

                node.topicname = val

                $('#node-input-messagetype').text(topicsAndTypes[e.target.selectedIndex].type)

            })
        }
    });
</script>

<script type="text/html" data-template-name="ros2-subscribe">
    <div class="form-row">
        <label for="node-input-server"><i class="fa fa-user"></i> ROS2 Websocket Server</label>
        <input type="text" id="node-input-server">
    </div>

    <div class="form-row">
        <label for="node-input-topicname"><i class="icon-tag"></i> Topic</label>
        <select id="node-input-topicname"></select>
    </div>

    <div class="form-row">
        <label><i class="icon-tag"></i> Message type</label>
        <span id="node-input-messagetype"></span>
    </div>
</script>

<script type="text/html" data-help-name="ros2-subscribe">
    <p>A node that subscribes to ROS2 bridge websocket server</p>
</script>