#9463 3D map reloaded when opening or closing the Annotations and Ide…

…ntification panels (#9530)
geosolutions-it · Oct 2, 2023 · 2fa78a5 · 2fa78a5
1 parent caaa908
commit 2fa78a5
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 4 deletions.
diff --git a/web/client/plugins/Map.jsx b/web/client/plugins/Map.jsx
@@ -226,7 +226,8 @@ class MapPlugin extends React.Component {
         currentLocaleLanguage: PropTypes.string,
         items: PropTypes.array,
         onLoadingMapPlugins: PropTypes.func,
-        onMapTypeLoaded: PropTypes.func
+        onMapTypeLoaded: PropTypes.func,
+        pluginsCreator: PropTypes.func
     };
 
     static defaultProps = {
@@ -265,7 +266,8 @@ class MapPlugin extends React.Component {
         onResolutionsChange: () => {},
         items: [],
         onLoadingMapPlugins: () => {},
-        onMapTypeLoaded: () => {}
+        onMapTypeLoaded: () => {},
+        pluginsCreator
     };
     state = {
         canRender: true
@@ -357,7 +359,8 @@ class MapPlugin extends React.Component {
             });
         }
         const plugins = this.state.plugins;
-        return [...this.props.layers, ...this.props.additionalLayers].filter(this.filterLayer).map((layer, index) => {
+        // all layers must have a valid id to avoid useless re-render
+        return [...this.props.layers, ...this.props.additionalLayers.map(({ id, ...layer }, idx) => ({ ...layer, id: id ? id : `additional-layers-${idx}` }))].filter(this.filterLayer).map((layer, index) => {
             return (
                 <plugins.Layer
                     type={layer.type}
@@ -460,7 +463,7 @@ class MapPlugin extends React.Component {
         props.onLoadingMapPlugins(true);
         // reset the map plugins to avoid previous map library in children
         this.setState({plugins: undefined });
-        pluginsCreator(props.mapType, props.actions).then((plugins) => {
+        this.props.pluginsCreator(props.mapType, props.actions).then((plugins) => {
             // #6652 fix mismatch on multiple concurrent plugins loading
             // to make the last mapType match the list of plugins
             if (this._isMounted && plugins.mapType === this.currentMapType) {

diff --git a/web/client/plugins/__tests__/Map-test.jsx b/web/client/plugins/__tests__/Map-test.jsx
@@ -78,4 +78,39 @@ describe('Map Plugin', () => {
         });
         expect(actions.filter(action => action.type === RESET_CONTROLS).length).toBe(1);
     });
+    it('should always assign an id to static additional layers', (done) => {
+        const { Plugin } = getPluginForTest(MapPlugin, { map });
+        ReactDOM.render(<Plugin
+            fonts={null}
+            additionalLayers={[
+                {
+                    type: 'terrain',
+                    provider: 'cesium',
+                    url: 'url/to/terrain',
+                    visibility: true
+                }
+            ]}
+            pluginsCreator={() => Promise.resolve({
+                Map: ({ children }) => <div className="map">{children}</div>,
+                Layer: ({ options }) => <div id={options.id} className="layers">{options.type}</div>,
+                Feature: () => null,
+                tools: {
+                    overview: () => null,
+                    scalebar: () => null,
+                    draw: () => null,
+                    highlight: () => null,
+                    selection: () => null,
+                    popup: () => null,
+                    box: () => null
+                },
+                mapType: 'openlayers'
+            })}
+        />, document.getElementById("container"));
+        waitFor(() => expect(document.querySelector('.layers')).toBeTruthy())
+            .then(() => {
+                expect(document.querySelector('.layers').getAttribute('id')).toBe('additional-layers-0');
+                done();
+            })
+            .catch(done);
+    });
 });