fixed update states while filter

fkie · Aug 27, 2024 · ec10822 · ec10822
1 parent feed78b
commit ec10822
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 9 deletions.
diff --git a/fkie_mas_gui/src/renderer/components/HostTreeView/HostTreeView.jsx b/fkie_mas_gui/src/renderer/components/HostTreeView/HostTreeView.jsx
@@ -72,6 +72,10 @@ function HostTreeView({
     setExpanded(nodeIds);
   }, []);
 
+  useEffect(() => {
+    setExpanded(groupKeys);
+  }, [groupKeys])
+
   /**
    * Callback when items on the tree are double clicked
    */
@@ -274,7 +278,6 @@ function HostTreeView({
    */
   useEffect(() => {
     updateSelectedNodeIds();
-    setExpanded(groupKeys);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [
     // update only if providerNodeTree was changed

diff --git a/fkie_mas_gui/src/renderer/pages/NodeManager/panels/HostTreeViewPanel.jsx b/fkie_mas_gui/src/renderer/pages/NodeManager/panels/HostTreeViewPanel.jsx
@@ -201,7 +201,11 @@ function HostTreeViewPanel() {
       });
     });
     setProviderNodeTree(newProvidersTree);
-    setGroupKeys(newGroupKeys.reverse());
+    if (filterText.length >= EXPAND_ON_SEARCH_MIN_CHARS) {
+      setGroupKeys(newGroupKeys);
+    } else if (groupKeys.length > 0) {
+      setGroupKeys([]);
+    }
   }, 300);
 
   useCustomEventListener(
@@ -1408,7 +1412,7 @@ function HostTreeViewPanel() {
             )}
             <HostTreeView
               providerNodeTree={providerNodeTree}
-              groupKeys={filterText.length < EXPAND_ON_SEARCH_MIN_CHARS ? [] : groupKeys}
+              groupKeys={groupKeys}
               onNodeSelect={handleNodesSelect}
               onProviderSelect={handleProviderSelect}
               showLoggers={createLoggerPanelFromId}

diff --git a/fkie_mas_gui/src/renderer/pages/NodeManager/panels/TopicsPanel.jsx b/fkie_mas_gui/src/renderer/pages/NodeManager/panels/TopicsPanel.jsx
@@ -254,7 +254,9 @@ function TopicsPanel({ initialSearchTerm = "" }) {
   useEffect(() => {
     const tree = fillTree("", filteredTopics);
     setRootDataList(tree.topics);
-    setExpandedFiltered(tree.groupKeys);
+    if (searchTerm.length < EXPAND_ON_SEARCH_MIN_CHARS) {
+      setExpandedFiltered(tree.groupKeys);
+    }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [filteredTopics]);
 
@@ -404,15 +406,11 @@ function TopicsPanel({ initialSearchTerm = "" }) {
         // defaultEndIcon={<div style={{ width: 24 }} />}
         onSelectedItemsChange={(event, itemId) => {
           setSelectedItem(itemId);
-          console.log(`el cha: ${itemId}`);
           const index =
             searchTerm.length < EXPAND_ON_SEARCH_MIN_CHARS
               ? expanded.indexOf(itemId)
               : expandedFiltered.indexOf(itemId);
-          const copyExpanded = [...expanded];
-          if (searchTerm.length >= EXPAND_ON_SEARCH_MIN_CHARS) {
-            copyExpanded.push(...expandedFiltered);
-          }
+          const copyExpanded = [...(searchTerm.length < EXPAND_ON_SEARCH_MIN_CHARS ? expanded : expandedFiltered)];
           if (index === -1) {
             copyExpanded.push(itemId);
           } else {