mirror of
				https://github.com/node-red/node-red.git
				synced 2025-03-01 10:36:34 +00:00 
			
		
		
		
	Improve with error handling, storage cleanup and centralization in one object
This commit is contained in:
		| @@ -35,6 +35,8 @@ RED.palette = (function() { | ||||
|     var categoryContainers = {}; | ||||
|     var sidebarControls; | ||||
|  | ||||
|     let lastState = { filter: "", collapsed: [] }; | ||||
|  | ||||
|     function createCategory(originalCategory,rootCategory,category,ns) { | ||||
|         if ($("#red-ui-palette-base-category-"+rootCategory).length === 0) { | ||||
|             createCategoryContainer(originalCategory,rootCategory, ns+":palette.label."+rootCategory); | ||||
| @@ -73,15 +75,16 @@ RED.palette = (function() { | ||||
|                 $("#red-ui-palette-header-"+category+" i").addClass("expanded"); | ||||
|             }, | ||||
|             toggle: function() { | ||||
|                 const collapse = JSON.parse(localStorage.getItem("palette-collapse") || "[]"); | ||||
|                 if (catDiv.hasClass("red-ui-palette-open")) { | ||||
|                     categoryContainers[category].close(); | ||||
|                     collapse.push(category); | ||||
|                     if (!lastState.collapsed.includes(category)) { | ||||
|                         lastState.collapsed.push(category); | ||||
|                     } | ||||
|                 } else { | ||||
|                     categoryContainers[category].open(); | ||||
|                     collapse.splice(collapse.indexOf(category), 1); | ||||
|                     lastState.collapsed.splice(lastState.collapsed.indexOf(category), 1); | ||||
|                 } | ||||
|                 localStorage.setItem("palette-collapse", JSON.stringify(collapse.filter((c, i, array) => array.indexOf(c) === i))); | ||||
|                 savePaletteState(); | ||||
|             } | ||||
|         }; | ||||
|  | ||||
| @@ -600,13 +603,12 @@ RED.palette = (function() { | ||||
|  | ||||
|         RED.events.on("subflows:change",refreshSubflow); | ||||
|  | ||||
|  | ||||
|  | ||||
|         $("#red-ui-palette-search input").searchBox({ | ||||
|             delay: 100, | ||||
|             change: function() { | ||||
|                 filterChange($(this).val()); | ||||
|                 localStorage.setItem("palette-filter", $(this).val()); | ||||
|                 lastState.filter = $(this).val(); | ||||
|                 savePaletteState(); | ||||
|             } | ||||
|         }); | ||||
|  | ||||
| @@ -675,14 +677,33 @@ RED.palette = (function() { | ||||
|             } | ||||
|         }); | ||||
|  | ||||
|         const collapse = JSON.parse(localStorage.getItem("palette-collapse") || "[]"); | ||||
|         const callback = function () { | ||||
|             collapse.forEach((category) => categoryContainers[category]?.close()); | ||||
|             $("#red-ui-palette-search input").searchBox("value", (localStorage.getItem("palette-filter") || "")); | ||||
|             RED.events.off("runtime-state", callback); | ||||
|         }; | ||||
|         RED.events.on("runtime-state", callback); | ||||
|         try { | ||||
|             const stateFromStorage = JSON.parse(localStorage.getItem("palette-state") || "{}"); | ||||
|  | ||||
|             for (const prop in stateFromStorage) { | ||||
|                 if (Object.prototype.hasOwnProperty.call(lastState, prop)) { | ||||
|                     lastState[prop] = stateFromStorage[prop]; | ||||
|                 } | ||||
|             } | ||||
|  | ||||
|             // Remove old/unknown category from localStorage | ||||
|             lastState.collapsed = lastState.collapsed.filter((c, i, a) => a.indexOf(c) === i && categoryContainers[c]); | ||||
|  | ||||
|             const callback = function () { | ||||
|                 // Hide categories previously hidded | ||||
|                 lastState.collapsed.forEach((category) => categoryContainers[category].close()); | ||||
|                 // Apply the category filter | ||||
|                 $("#red-ui-palette-search input").searchBox("value", lastState.filter); | ||||
|                 RED.events.off("runtime-state", callback); | ||||
|             }; | ||||
|  | ||||
|             savePaletteState(); | ||||
|             RED.events.on("runtime-state", callback); | ||||
|         } catch (error) { | ||||
|             console.error("Unexpected error loading palette state from localStorage: ", error); | ||||
|         } | ||||
|     } | ||||
|  | ||||
|     function togglePalette(state) { | ||||
|         if (!state) { | ||||
|             $("#red-ui-main-container").addClass("red-ui-palette-closed"); | ||||
| @@ -702,6 +723,15 @@ RED.palette = (function() { | ||||
|         }) | ||||
|         return categories; | ||||
|     } | ||||
|  | ||||
|     function savePaletteState() { | ||||
|         try { | ||||
|             localStorage.setItem("palette-state", JSON.stringify(lastState)); | ||||
|         } catch (error) { | ||||
|             console.error("Unexpected error saving palette state to localStorage: ", error); | ||||
|         } | ||||
|     } | ||||
|  | ||||
|     return { | ||||
|         init: init, | ||||
|         add:addNodeType, | ||||
|   | ||||
		Reference in New Issue
	
	Block a user