diff --git a/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js b/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js index 2a6d0bdc6..4437f6c40 100644 --- a/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js +++ b/packages/node_modules/@node-red/editor-client/src/js/ui/palette.js @@ -37,6 +37,8 @@ RED.palette = (function() { let paletteState = { filter: "", collapsed: [] }; + let filterRefreshTimeout + function createCategory(originalCategory,rootCategory,category,ns) { if ($("#red-ui-palette-base-category-"+rootCategory).length === 0) { createCategoryContainer(originalCategory,rootCategory, ns+":palette.label."+rootCategory); @@ -460,6 +462,10 @@ RED.palette = (function() { categoryContainers[rootCategory].close(true); } } + clearTimeout(filterRefreshTimeout) + filterRefreshTimeout = setTimeout(() => { + refreshFilter() + }, 200) } } @@ -559,7 +565,8 @@ RED.palette = (function() { paletteNode.css("backgroundColor", sf.color); } - function filterChange(val) { + function refreshFilter() { + const val = $("#red-ui-palette-search input").val() var re = new RegExp(val.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'),'i'); $("#red-ui-palette-container .red-ui-palette-node").each(function(i,el) { var currentLabel = $(el).attr("data-palette-label"); @@ -655,7 +662,7 @@ RED.palette = (function() { $("#red-ui-palette-search input").searchBox({ delay: 100, change: function() { - filterChange($(this).val()); + refreshFilter(); paletteState.filter = $(this).val(); savePaletteState(); } @@ -735,6 +742,11 @@ RED.palette = (function() { } catch (error) { console.error("Unexpected error loading palette state from localStorage: ", error); } + setTimeout(() => { + // Lazily tidy up any categories that haven't been reloaded + paletteState.collapsed = paletteState.collapsed.filter(category => !!categoryContainers[category]) + savePaletteState() + }, 10000) } function togglePalette(state) {