[help-sidebar] Include subflow help in sidebar

packages/node_modules/@node-red/editor-client/src/js/ui/common/treeList.js

@@ -663,9 +663,14 @@
                 return this._data;
             }
         },
-        show: function(id) {
+        show: function(item) {
+            if (typeof item === "string") {
+                item = this._items[item]
+            }
+            if (!item) {
+                return;
+            }
             var that = this;
-            var item = this._items[id];
             var stack = [];
             var i = item;
             while(i) {
@@ -680,20 +685,19 @@
                     setTimeout(function() {
                         that.reveal(item);
                     },isOpening?200:0);
-                    // item.treeList.parentList.editableList('show',item);
                 } else {
                     item.treeList.expand(handleStack)
                 }
             }
             handleStack();
-
-            // for (var i=0;i<this._data.length;i++) {
-            //     if (this._data[i].id === id) {
-            //         this._topList.editableList('show',this._data[i]);
-            //     }
-            // }
         },
         reveal: function(item) {
+            if (typeof item === "string") {
+                item = this._items[item]
+            }
+            if (!item) {
+                return;
+            }
             var listOffset = this._topList.offset().top;
             var itemOffset = item.treeList.label.offset().top;
             var scrollTop = this._topList.parent().scrollTop();
@@ -705,15 +709,22 @@
             } else if (itemOffset+itemHeight > treeHeight) {
                 this._topList.parent().scrollTop(scrollTop+((itemOffset+2.5*itemHeight)-treeHeight));
             }
-            console.log("scroll now",this._topList.parent().scrollTop())
         },
-        select: function(item) {
+        select: function(item, triggerEvent) {
+            if (typeof item === "string") {
+                item = this._items[item]
+            }
             if (!this.options.multi) {
                 this._topList.find(".selected").removeClass("selected");
             }
+            if (!item) {
+                return;
+            }
             this.show(item.id);
             item.treeList.label.addClass("selected");
-            this._trigger("select",null,item)
+            if (triggerEvent !== false) {
+                this._trigger("select",null,item)
+            }
         },
         clearSelection: function() {
             this._topList.find(".selected").removeClass("selected");
@@ -767,6 +778,9 @@
                 return matchCount > 0
             }
             return this._topList.editableList('filter', filter);
+        },
+        get: function(id) {
+            return this._items[id] || null;
         }
     });
 

packages/node_modules/@node-red/editor-client/src/js/ui/tab-help.js

@@ -80,14 +80,15 @@ RED.sidebar.help = (function() {
         helpSearch = $('<input type="text" data-i18n="[placeholder]sidebar.help.search">').appendTo(toolbar).searchBox({
             delay: 100,
             change: function() {
-                var val = $(this).val();
+                var val = $(this).val().toLowerCase();
                 if (val) {
                     showTOC();
                     var c = treeList.treeList('filter',function(item) {
                         if (item.depth === 0) {
                             return true;
                         }
-                        return item.id &&  item.id.indexOf(val) > -1
+                        return (item.nodeType &&  item.nodeType.indexOf(val) > -1) ||
+                               (item.subflowLabel && item.subflowLabel.indexOf(val) > -1)
                     },true)
                 } else {
                     treeList.treeList('filter',null);
@@ -128,21 +129,30 @@ RED.sidebar.help = (function() {
         $(window).on("resize", resizeStack);
         $(window).on("focus", resizeStack);
 
-        var refreshTimer;
+        RED.events.on('registry:node-type-added', queueRefresh);
-
+        RED.events.on('registry:node-type-removed', queueRefresh);
-        RED.events.on('registry:node-type-added', function(nodeType) {
+        RED.events.on('subflows:change', refreshSubflow);
-            if (!refreshTimer) {
-                refreshTimer = setTimeout(function() {
-                    refreshTimer = null;
-                    refreshHelpIndex();
-                },500);
-            }
-        });
 
         RED.actions.add("core:show-help-tab",show);
 
     }
 
+    var refreshTimer;
+    function queueRefresh() {
+        if (!refreshTimer) {
+            refreshTimer = setTimeout(function() {
+                refreshTimer = null;
+                refreshHelpIndex();
+            },500);
+        }
+    }
+
+    function refreshSubflow(sf) {
+        var item = treeList.treeList('get',"node-type:subflow:"+sf.id);
+        item.subflowLabel = sf._def.label().toLowerCase();
+        item.treeList.replaceElement(getNodeLabel({_def:sf._def,type:sf._def.label()}));
+    }
+
     function hideTOC() {
         var tocButton = $('#red-ui-sidebar-help-show-toc')
         if (tocButton.hasClass('selected')) {
@@ -163,6 +173,10 @@ RED.sidebar.help = (function() {
             panels.ratio(Math.max(0.3,Math.min(panelRatio,0.7)));
             setTimeout(function() {
                 tocPanel.css({"transition":""})
+                var selected = treeList.treeList('selected');
+                if (selected.id) {
+                    treeList.treeList('show',selected);
+                }
             },250);
         }
     }
@@ -179,6 +193,24 @@ RED.sidebar.help = (function() {
             expanded: true
         }]
 
+        var subflows = RED.nodes.registry.getNodeTypes().filter(function(t) {return /subflow/.test(t)});
+        if (subflows.length > 0) {
+            helpData[0].children.push({
+                label: RED._("menu.label.subflows"),
+                children: []
+            })
+            subflows.forEach(function(nodeType) {
+                var sf = RED.nodes.getType(nodeType);
+                helpData[0].children[0].children.push({
+                    id:"node-type:"+nodeType,
+                    nodeType: nodeType,
+                    subflowLabel: sf.label().toLowerCase(),
+                    element: getNodeLabel({_def:sf,type:sf.label()})
+                })
+            })
+        }
+
+
         moduleNames.forEach(function(moduleName) {
             var module = modules[moduleName];
             var nodeTypes = [];
@@ -188,7 +220,7 @@ RED.sidebar.help = (function() {
                 module.sets[setName].types.forEach(function(nodeType) {
                     if ($("script[data-help-name='"+nodeType+"']").length) {
                         nodeTypes.push({
-                            id: moduleName+"/"+nodeType,
+                            id: "node-type:"+nodeType,
                             nodeType: nodeType,
                             element:getNodeLabel({_def:RED.nodes.getType(nodeType),type:nodeType})
                         })
@@ -211,20 +243,30 @@ RED.sidebar.help = (function() {
         var div = $('<div>',{class:"red-ui-info-outline-item"});
         RED.utils.createNodeIcon(n).appendTo(div);
         var contentDiv = $('<div>',{class:"red-ui-search-result-description"}).appendTo(div);
-        $('<div>',{class:"red-ui-search-result-node-label red-ui-info-outline-item-label"}).text(n.type).appendTo(contentDiv);
+        $('<div>',{class:"red-ui-search-result-node-label red-ui-info-outline-item-label"}).text(n.name||n.type).appendTo(contentDiv);
         return div;
     }
 
     function showHelp(nodeType) {
         helpSection.empty();
-        var helpText = $("script[data-help-name='"+nodeType+"']").html()||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>');
+        var helpText;
-        var title = nodeType;
+        var title;
+        var m = /^subflow(:(.+))?$/.exec(nodeType);
+        if (m && m[2]) {
+            var subflowNode = RED.nodes.subflow(m[2]);
+            helpText = (RED.utils.renderMarkdown(subflowNode.info||"")||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>'));
+            title = subflowNode.name || nodeType;
+        } else {
+            helpText = $("script[data-help-name='"+nodeType+"']").html()||('<span class="red-ui-help-info-none">'+RED._("sidebar.info.none")+'</span>');
+            title = nodeType;
+        }
         setInfoText(title, helpText, helpSection);
 
         var ratio = panels.ratio();
         if (ratio > 0.7) {
             panels.ratio(0.7)
         }
+        treeList.treeList("select","node-type:"+nodeType, false);
 
     }
 
@@ -284,6 +326,7 @@ RED.sidebar.help = (function() {
             // $(".red-ui-sidebar-info-stack").scrollTop(0);
         }
     }
+
     function setInfoText(title, infoText,target) {
         if (title) {
             $("<h1>",{class:"red-ui-help-title"}).text(title).appendTo(target);