Correctly update sublayer result with layer info

qgis · Feb 14, 2025 · e9077bf · e9077bf
1 parent 4bf5461
commit e9077bf
Showing 1 changed file with 22 additions and 5 deletions.
diff --git a/components/SearchBox.jsx b/components/SearchBox.jsx
@@ -364,7 +364,7 @@ class SearchBox extends React.Component {
             </div>
         );
     };
-    renderThemeLayerResult = (provider, group, result) => {
+    renderThemeLayerResult = (provider, group, result, parent = null) => {
         const key = provider + ":" + group.id + ":" + result.id;
         const addThemes = ConfigUtils.getConfigProp("allowAddingOtherThemes", this.props.theme);
         let icon = null;
@@ -384,15 +384,15 @@ class SearchBox extends React.Component {
                     {result.theme ? (<Icon className="searchbox-result-openicon" icon="open" />) : null}
                     <span className="searchbox-result-label" dangerouslySetInnerHTML={{__html: result.text.replace(/<br\s*\/>/ig, ' ')}} title={result.label ?? result.text} />
                     {result.theme && addThemes ? (<Icon icon="plus" onClick={(ev) => {MiscUtils.killEvent(ev); this.selectThemeLayerResult(provider, group, result); this.blur(); }} title={LocaleUtils.tr("themeswitcher.addtotheme")}/>) : null}
-                    {result.info ? <Icon icon="info-sign" onClick={ev => {MiscUtils.killEvent(ev); this.toggleLayerInfo(provider, group, result, key);} } /> : null}
+                    {result.info ? <Icon icon="info-sign" onClick={ev => {MiscUtils.killEvent(ev); this.toggleLayerInfo(provider, group, result, key, parent);} } /> : null}
                 </div>
                 {this.state.activeLayerInfo === key ? (
                     <div className="searchbox-result-abstract"
                         dangerouslySetInnerHTML={{__html: MiscUtils.addLinkAnchors(result.layer?.abstract || "") || LocaleUtils.tr("search.nodescription")}}
                     />
                 ) : null}
                 {this.state.expandedLayerGroup === key ? (
-                    <div className="searchbox-result-group">{result.sublayers.map(sublayer => this.renderThemeLayerResult(provider, group, sublayer))}</div>
+                    <div className="searchbox-result-group">{result.sublayers.map(sublayer => this.renderThemeLayerResult(provider, group, sublayer, result.id))}</div>
                 ) : null}
             </div>
         );
@@ -477,7 +477,7 @@ class SearchBox extends React.Component {
             }
         }
     };
-    toggleLayerInfo = (provider, group, result, key) => {
+    toggleLayerInfo = (provider, group, result, key, parent) => {
         const setResultLayerAndActiveInfo = (layer) => {
             // Embed returned layer into result item, so that layer info is read from item.layer.abstract
             this.setState((state) => ({
@@ -487,7 +487,24 @@ class SearchBox extends React.Component {
                         ...state.searchResults[provider],
                         results: state.searchResults[provider].results.map(g => {
                             if (g.id === group.id) {
-                                return {...g, items: g.items.map(i => (i.id === result.id ? {...i, layer: layer} : i))};
+                                return {...g, items: g.items.map(item => {
+                                    if (item.id === result.id) {
+                                        return {...item, layer: layer};
+                                    } else if (item.id === parent) {
+                                        return {
+                                            ...item,
+                                            sublayers: item.sublayers.map(sublayer => {
+                                                if (sublayer.id === result.id) {
+                                                    return {...sublayer, layer: layer};
+                                                } else {
+                                                    return sublayer;
+                                                }
+                                            })
+                                        };
+                                    } else {
+                                        return item;
+                                    }
+                                })};
                             } else {
                                 return g;
                             }