Normalize layers/groups management in TOC #10247

web/client/components/widgets/builder/wizard/map/enhancers/__tests__/mapToNodes-test.jsx

@@ -11,6 +11,7 @@ import ReactDOM from 'react-dom';
 import {createSink} from 'recompose';
 
 import mapToNodes from '../mapToNodes';
+import { DEFAULT_GROUP_ID } from '../../../../../../../utils/LayersUtils';
 
 describe('mapToNodes enhancer', () => {
     beforeEach((done) => {
@@ -27,7 +28,11 @@ describe('mapToNodes enhancer', () => {
             expect(props).toExist();
             expect(props.nodes).toExist();
             expect(props.nodes.length).toBe(1);
-            const gNode = props.nodes[0];
+            const defaultNode = props.nodes[0];
+            // check default node
+            expect(defaultNode.name).toBe(DEFAULT_GROUP_ID);
+            expect(defaultNode.id).toBe(DEFAULT_GROUP_ID);
+            const gNode = defaultNode.nodes[0];
             expect(gNode.name).toBe("GGG");
             expect(gNode.title).toBe("GGG");
             expect(gNode.id).toBe("GGG");

web/client/plugins/TOC/components/__tests__/TOC-test.jsx

@@ -58,7 +58,8 @@ describe('TOC', () => {
                 ]
             }}
             onChangeMap={(map) => {
-                expect(map.groups[0].visibility).toBe(false);
+                // skipping "Default" group in [0] which is invisible in UI
+                expect(map.groups[1].visibility).toBe(false);
                 done();
             }}
         />, document.getElementById("container"));

web/client/utils/LayersUtils.js

@@ -23,6 +23,8 @@ import { addAuthenticationParameter } from './SecurityUtils';
 import { getEPSGCode } from './CoordinatesUtils';
 import { ANNOTATIONS, updateAnnotationsLayer, isAnnotationLayer } from '../plugins/Annotations/utils/AnnotationsUtils';
 import { getLocale } from './LocaleUtils';
+import { isSingleDefaultGroup } from '../plugins/TOC/utils/TOCUtils';
+
 
 let LayersUtils;
 
@@ -573,6 +575,53 @@ export const sortUsing = (sortFun, action) => {
         return action(node, reorder, sortFun);
     };
 };
+/**
+ * Converts an array of legacy groups to a new standardized format.
+ *
+ * @param {Array<Object>} legecyGroups - An array of legacy group objects.
+ *
+ * @returns {Array<Object>} - An array containing a single default group object with modified nodes.
+ *
+ * @example
+ * const legacyGroups = [
+ *     { id: '1', name: 'Group 1' },
+ *     { id: "Default" , ...}
+ *     ...
+ * ];
+ *
+ * const newFormat = convertLegacyGroupsToNewFormat(legacyGroups);
+ * // returns [
+ * //     {
+ * //         id: "Default",
+ * //         name: "Default",
+ * //         nodes: [
+ * //             { id: '1', name: 'Group 1' },
+ * //             { id: 'Default.Default', name: "Default", ... },
+ * //                ...
+ * //         ],
+ * //         expanded: true
+ * //     }
+ * // ]
+ */
+export function convertLegacyGroupsToNewFormat(legacyGroups) {
+    const modifiedNodes = legacyGroups.map(node => {
+        if (node.id === DEFAULT_GROUP_ID) {
+            return {
+                ...node,
+                id: `${DEFAULT_GROUP_ID}.${node.id}`,
+                name: node?.name
+            };
+        }
+        return node;
+    });
+
+    return [{
+        id: "Default",
+        name: "Default",
+        nodes: modifiedNodes,
+        expanded: true
+    }];
+}
 export const splitMapAndLayers = (mapState) => {
     if (mapState && isArray(mapState.layers)) {
         let groups = LayersUtils.getLayersByGroup(mapState.layers, mapState.groups);
@@ -598,6 +647,8 @@ export const splitMapAndLayers = (mapState) => {
                 return newGroups;
             }, [].concat(groups));
         }
+        // to convert old format to new format: UI wise invisible default group as parent of all groups
+        groups = !isSingleDefaultGroup(groups) ? convertLegacyGroupsToNewFormat(groups) : groups;
 
         let layers = extractDataFromSources(mapState);
 

web/client/utils/__tests__/LayersUtils-test.js

@@ -176,7 +176,9 @@ describe('LayersUtils', () => {
         expect(state.layers).toExist();
         expect(state.layers.flat).toExist();
         expect(state.layers.flat.length).toBe(2);
-        expect(state.layers.groups.length).toBe(2);
+        // single Default Group, all other groups inside it
+        expect(state.layers.groups.length).toBe(1);
+        expect(state.layers.groups[0].nodes.length).toBe(2);
     });
 
     it('splits layers and groups groups additional data (expanded and title)', () => {
@@ -196,65 +198,72 @@ describe('LayersUtils', () => {
         ];
 
         const state = LayersUtils.splitMapAndLayers({groups, layers});
-
-        expect(state.layers.groups).toEqual([
-            {
-                expanded: true,
-                id: 'test',
-                name: 'test',
-                title: 'Test-group',
-                description: 'description',
-                tooltipOptions: 'both',
-                tooltipPlacement: 'right',
-                nodes: ['layer005'],
-                visibility: undefined,
-                nodesMutuallyExclusive: undefined
-            },
+        // first group is always the "Default" Group(invisible on UI)
+        expect(state.layers.groups.length).toBe(1);
+        expect(state.layers.groups[0].id).toBe("Default");
+        expect(JSON.stringify(state.layers.groups)).toBe(JSON.stringify([
             {
-                expanded: true,
-                id: 'custom',
-                name: 'custom',
-                title: {'default': 'Default', 'en-US': 'new'},
-                description: undefined,
-                tooltipOptions: undefined,
-                tooltipPlacement: undefined,
-                nodes: [
+                "id": LayersUtils.DEFAULT_GROUP_ID,
+                "name": LayersUtils.DEFAULT_GROUP_ID,
+                "nodes": [
+                    {
+                        "id": "test",
+                        "title": "Test-group",
+                        "name": "test",
+                        "nodes": [
+                            "layer005"
+                        ],
+                        "expanded": true,
+                        "description": "description",
+                        "tooltipOptions": "both",
+                        "tooltipPlacement": "right"
+                    },
                     {
-                        expanded: true,
-                        id: 'custom.nested001',
-                        name: 'nested001',
-                        title: 'nested001',
-                        nodes: [
+                        "id": "custom",
+                        "title": {
+                            "default": "Default",
+                            "en-US": "new"
+                        },
+                        "name": "custom",
+                        "nodes": [
                             {
-                                expanded: false,
-                                id: 'custom.nested001.nested002',
-                                name: 'nested002',
-                                title: 'nested002',
-                                nodes: ['layer004'],
-                                visibility: undefined,
-                                nodesMutuallyExclusive: undefined
-                            },
-                            'layer003'
+                                "id": "custom.nested001",
+                                "title": "nested001",
+                                "name": "nested001",
+                                "nodes": [
+                                    {
+                                        "id": "custom.nested001.nested002",
+                                        "title": "nested002",
+                                        "name": "nested002",
+                                        "nodes": [
+                                            "layer004"
+                                        ],
+                                        "expanded": false
+                                    },
+                                    "layer003"
+                                ],
+                                "expanded": true
+                            }
+                        ],
+                        "expanded": true
+                    },
+                    {
+                        "id": `${LayersUtils.DEFAULT_GROUP_ID}.Default`,
+                        "title": "Default",
+                        "name": "Default",
+                        "nodes": [
+                            "layer002",
+                            "layer001"
                         ],
-                        visibility: undefined,
-                        nodesMutuallyExclusive: undefined
+                        "expanded": false
                     }
                 ],
-                visibility: undefined,
-                nodesMutuallyExclusive: undefined
-            },
-            {
-                expanded: false,
-                id: 'Default',
-                name: 'Default',
-                nodes: ['layer002', 'layer001'],
-                title: 'Default',
-                visibility: undefined,
-                nodesMutuallyExclusive: undefined
+                "expanded": true
             }
-        ]);
+        ]));
     });
 
+
     it('deep change in nested group', () => {
 
         const nestedGroups = [
@@ -1672,4 +1681,30 @@ describe('LayersUtils', () => {
         };
         expect(getTitle(title, locale)).toBe("Livello");
     });
+
+    it('should modify the default group ID correctly and retain the name', () => {
+        const legacyGroups = [
+            { id: LayersUtils.DEFAULT_GROUP_ID, name: 'Test Group 1' },
+            { id: 'anotherGroupId', name: 'Test Group 2' }
+        ];
+
+        const result = LayersUtils.convertLegacyGroupsToNewFormat(legacyGroups);
+
+        expect(result.length).toBe(1);
+        // always "Default" group as a root
+        const defaultGroup = result[0];
+        expect(defaultGroup.id).toBe(LayersUtils.DEFAULT_GROUP_ID);
+        expect(defaultGroup.name).toBe(LayersUtils.DEFAULT_GROUP_ID);
+        expect(defaultGroup.nodes.length).toBe(2);
+
+        // Check if the first node (default group) was modified correctly
+        const firstNode = defaultGroup.nodes[0];
+        expect(firstNode.id).toBe(`${LayersUtils.DEFAULT_GROUP_ID}.${LayersUtils.DEFAULT_GROUP_ID}`);
+        expect(firstNode.name).toBe('Test Group 1');
+
+        // Check if the second node (non-default) is unchanged
+        const secondNode = defaultGroup.nodes[1];
+        expect(secondNode.id).toBe('anotherGroupId');
+        expect(secondNode.name).toBe('Test Group 2');
+    });
 });