@geogirafe/lib-geoportal 1.0.2250856094 → 1.0.2259547422

package/api/apigeogirafeapp.js

@@ -115,7 +115,7 @@ export default class GeoGirafeApi extends GirafeHTMLElement {
     }
     injectConfigMetaTags() {
         const location = new URL(import.meta.url);
-        if (import.meta.env.DEV) {
+        if (import.meta?.env?.DEV) {
             location.pathname = location.pathname.replace('/src/api', '');
         }
         const origin = `${location.origin}${location.pathname.substring(0, location.pathname.lastIndexOf('/'))}`;

package/components/basemap/component.js

@@ -18,12 +18,11 @@ class BasemapComponent extends GirafeHTMLElement {
         if (basemap.opacity == 0)
             return;
         const newBasemapProjection = basemap.projection ?? this.context.configManager.Config.map.srid;
-        const opacityDisabled = basemap.opacity == -1;
         const activeBasemaps = [...this.state.activeBasemaps];
-        if (opacityDisabled) {
+        if (basemap.opacityDisabled) {
             // Normal basemap change (no opacity basemap)
             this.state.projection = newBasemapProjection;
-            const idx = activeBasemaps.findIndex((activeBasemap) => activeBasemap.opacity == -1);
+            const idx = activeBasemaps.findIndex((activeBasemap) => activeBasemap.opacityDisabled);
             if (idx >= 0) {
                 activeBasemaps.splice(idx, 1);
             }
@@ -51,7 +50,7 @@ class BasemapComponent extends GirafeHTMLElement {
     }
     changeBasemapOpacity(basemap, e) {
         e.stopPropagation();
-        if (basemap.opacity == -1) {
+        if (basemap.opacityDisabled) {
             console.warn(`Trying to set Opacity on Basemap '${basemap.name}' which does not allow it`);
             return;
         }

package/components/map/component.js

@@ -885,6 +885,12 @@ export default class MapComponent extends GirafeHTMLElement {
                 throw new TypeError('Unknown basemap type');
             }
         }
+        // Apply default opacity
+        for (const basemap of basemaps) {
+            if (!basemap.opacityDisabled) {
+                this.onChangeBasemapOpacity(basemap);
+            }
+        }
     }
     /**
      * This method checks for the presence of an initial selection originating from a shared state.

package/models/basemaps/basemap.d.ts

@@ -8,5 +8,6 @@ declare class Basemap {
     layersList: BaseLayer[];
     constructor(elem: GMFBackgroundLayer, opacity?: number);
     get projection(): string | undefined;
+    get opacityDisabled(): boolean;
 }
 export default Basemap;

package/models/basemaps/basemap.js

@@ -16,5 +16,8 @@ class Basemap {
         const layer = this.layersList.find((l) => l instanceof LayerVectorTiles);
         return layer?.projection;
     }
+    get opacityDisabled() {
+        return this.opacity === -1;
+    }
 }
 export default Basemap;

package/package.json

@@ -5,7 +5,7 @@
     "name": "GeoGirafe PSC",
     "url": "https://doc.geomapfish.dev"
   },
-  "version": "1.0.2250856094",
+  "version": "1.0.2259547422",
   "type": "module",
   "engines": {
     "node": ">=20.19.0"

package/templates/public/about.json

@@ -1 +1 @@
-{"version":"1.0.2250856094", "build":"2250856094", "date":"08/01/2026"}
+{"version":"1.0.2259547422", "build":"2259547422", "date":"13/01/2026"}

package/tools/configuration/girafeconfig.d.ts

@@ -84,6 +84,7 @@ declare class GirafeConfig {
     };
     share?: {
         service: 'gmf' | 'geogirafe' | null;
+        preferNames: boolean;
         createUrl: string;
         getUrl?: string;
     };

package/tools/configuration/girafeconfig.js

@@ -162,6 +162,7 @@ class GirafeConfig {
         }
         return {
             service: config.share?.service ?? 'gmf',
+            preferNames: config.share?.preferNames ?? false,
             createUrl: config.share?.createUrl,
             getUrl: config.share?.getUrl
         };
@@ -300,7 +301,7 @@ class GirafeConfig {
             locale: config.general.locale ?? GirafeConfig.DEFAULT_LOCALE,
             // NOTE REG: Small hack specific to Vite: When running in debug mode, we force the logLevel to debug.
             // Otherwise we will always have to manually activate it.
-            logLevel: import.meta.env.DEV ? 'debug' : (config.general.logLevel ?? 'warn')
+            logLevel: import.meta?.env?.DEV ? 'debug' : (config.general.logLevel ?? 'warn')
         };
     }
     initGmfOauth(config) {

package/tools/error/errormanager.js

@@ -61,7 +61,7 @@ ${stack}
         if (error?.stack) {
             try {
                 // NOTE REG: Specific to Vite: When running in debug mode, we do not need to calculate the original stacktrace
-                stack = import.meta.env.DEV ? error.stack : await this.getOriginalStackTrace(error);
+                stack = import.meta?.env?.DEV ? error.stack : await this.getOriginalStackTrace(error);
             }
             catch (e) {
                 // If an error accurs during the calculation of the stacktrace, we just ignore it

package/tools/main.d.ts

@@ -54,7 +54,7 @@ export { default as LayersConfigSerializer } from './share/serializers/layerconf
 export { default as MapPositionSerializer } from './share/serializers/mappositionserializer.js';
 export type { SharedInitialSelection } from './share/serializers/selectionserializer.js';
 export { default as SelectionSerializer } from './share/serializers/selectionserializer.js';
-export type { SharedFilter, SharedLayer, SharedInternalTheme, SharedInternalGroup, SharedInternalLayer, SharedExternalTheme, SharedExternalLayer } from './share/serializers/sharedtypes.js';
+export type { SharedFilter, SharedLayer, SharedInternalTheme, SharedInternalGroup, SharedInternalLayer, SharedExternalTheme, SharedExternalLayer, SharedBasemap } from './share/serializers/sharedtypes.js';
 export { default as SessionManager } from './share/sessionmanager.js';
 export { default as ShareManager } from './share/sharemanager.js';
 export { default as StateSerializer } from './share/stateserializer.js';

package/tools/share/serializers/activebasemapsserializer.d.ts

@@ -5,6 +5,9 @@ export default class ActiveBasemapsSerializer implements IBrainSerializer<Basema
     private readonly context;
     constructor(context: IGirafeContext);
     private get state();
-    brainSerialize(basemaps: Basemap[]): string;
+    private get preferNames();
+    brainSerialize(activeBasemaps: Basemap[]): string;
     brainDeserialize(serializedString: string): void;
+    private serialize;
+    private deserialize;
 }

package/tools/share/serializers/activebasemapsserializer.js

@@ -1,5 +1,3 @@
-import { applyOpacityToLayers } from '../../utils/utils.js';
-import { DEFAULT_OPACITY } from '../../themes/themes-config.js';
 export default class ActiveBasemapsSerializer {
     context;
     constructor(context) {
@@ -8,31 +6,43 @@ export default class ActiveBasemapsSerializer {
     get state() {
         return this.context.stateManager.state;
     }
-    brainSerialize(basemaps) {
-        const serializedBasemaps = basemaps
-            .map((basemap) => `${basemap.id.toString()}=${basemap.opacity.toString()}`)
-            .join(';');
-        console.debug(`Serialized Basemaps to ${serializedBasemaps}`);
-        return serializedBasemaps;
+    get preferNames() {
+        return this.context.configManager.Config.share?.preferNames ?? false;
+    }
+    brainSerialize(activeBasemaps) {
+        return this.serialize(activeBasemaps);
     }
     brainDeserialize(serializedString) {
-        console.debug(`Deserializing Basemaps from ${serializedString}`);
-        const basemapIdsWithOpacities = Object.fromEntries(serializedString.split(';').map((idAndOpacity) => idAndOpacity.split('=').map(Number)));
-        const basemapIds = Object.keys(basemapIdsWithOpacities).map(Number);
-        const basemaps = Object.values(this.state.basemaps).filter((b) => basemapIds.includes(b.id));
+        const activeBasemaps = this.deserialize(serializedString);
+        this.state.activeBasemaps = activeBasemaps;
+    }
+    serialize(basemaps) {
+        const sharedBasemaps = [];
         for (const basemap of basemaps) {
-            basemap.opacity = basemapIdsWithOpacities[basemap.id] ?? DEFAULT_OPACITY;
-            applyOpacityToLayers(basemap.opacity === -1 ? 1 : basemap.opacity, basemap.layersList);
-        }
-        if (basemaps.length > 0) {
-            this.state.activeBasemaps = basemaps;
+            const sharedBasemap = {
+                id: basemap.id,
+                name: basemap.name,
+                opacity: basemap.opacity
+            };
+            sharedBasemaps.push(sharedBasemap);
         }
-        else {
-            console.debug('No Basemaps could be deserialized => not changing state.activeBasemaps');
-        }
-        if (basemaps.length != basemapIds.length) {
-            const missingIds = basemapIds.filter((id) => basemaps.findIndex((basemap) => basemap.id == id) == -1); //NOSONAR(typescript:S7754) It IS about the Indexes
-            throw new Error(`Some basemaps could not be deserialized: ${missingIds.join(',')}.`);
+        return JSON.stringify(sharedBasemaps);
+    }
+    deserialize(str) {
+        const sharedBasemaps = JSON.parse(str);
+        const basemaps = [];
+        for (const sharedBasemap of sharedBasemaps) {
+            const basemap = this.preferNames
+                ? Object.values(this.state.basemaps).find((b) => b.name === sharedBasemap.name)
+                : Object.values(this.state.basemaps).find((b) => b.id === sharedBasemap.id);
+            if (basemap) {
+                basemap.opacity = sharedBasemap.opacity;
+                basemaps.push(basemap);
+            }
+            else {
+                console.error(`The basemap ${sharedBasemap.name} could not be deserialized`);
+            }
         }
+        return basemaps;
     }
 }

package/tools/share/serializers/activebasemapsserializer.spec.js

@@ -26,7 +26,7 @@ describe('ActiveBasemapsSerializer.serialize', () => {
             })
         ];
         const serialized = serializer.brainSerialize(basemaps);
-        expect(serialized).toBe('1=-1');
+        expect(serialized).toEqual('[{"id":1,"name":"OpenStreetMap","opacity":-1}]');
     });
 });
 describe('ActiveBasemapsSerializer.deserialize', () => {
@@ -40,13 +40,14 @@ describe('ActiveBasemapsSerializer.deserialize', () => {
         basemaps.forEach((basemap) => {
             context.stateManager.state.basemaps[basemap.id] = basemap;
         });
-        serializer.brainDeserialize('1=-1');
+        serializer.brainDeserialize('[{"id":1,"name":"OpenStreetMap","opacity":-1}]');
         const state = context.stateManager.state;
         expect(state.activeBasemaps).toBeInstanceOf((Array));
         expect(state.activeBasemaps[0].id).toBe(basemaps[0].id);
         expect(state.activeBasemaps[0].opacity).toBe(-1);
+        expect(state.activeBasemaps[0].opacityDisabled).toBeTruthy();
     });
-    it('deserializing with non existing IDs should throw an Error', () => {
+    it('should deserialize a valid basemap even if another one cannot be found', () => {
         const basemaps = [
             new Basemap({
                 id: 1,
@@ -56,6 +57,87 @@ describe('ActiveBasemapsSerializer.deserialize', () => {
         basemaps.forEach((basemap) => {
             context.stateManager.state.basemaps[basemap.id] = basemap;
         });
-        expect(() => serializer.brainDeserialize('1=-1;2=0;42=0.45')).toThrow(new Error(`Some basemaps could not be deserialized: 2,42.`));
+        serializer.brainDeserialize('[{"id":1,"name":"OpenStreetMap","opacity":-1},{"id":2,"name":"NotExisting","opacity":0.5}]');
+        const state = context.stateManager.state;
+        expect(state.activeBasemaps).toBeInstanceOf((Array));
+        expect(state.activeBasemaps[0].id).toBe(basemaps[0].id);
+        expect(state.activeBasemaps[0].opacity).toBe(-1);
+        expect(state.activeBasemaps[0].opacityDisabled).toBeTruthy();
+    });
+    it('should deserialize a valid basemap with the right opacity', () => {
+        const basemaps = [
+            new Basemap({
+                id: 1,
+                name: 'OpenStreetMap'
+            })
+        ];
+        basemaps.forEach((basemap) => {
+            context.stateManager.state.basemaps[basemap.id] = basemap;
+        });
+        serializer.brainDeserialize('[{"id":1,"name":"OpenStreetMap","opacity":0.45}]');
+        const state = context.stateManager.state;
+        expect(state.activeBasemaps).toBeInstanceOf((Array));
+        expect(state.activeBasemaps[0].id).toBe(basemaps[0].id);
+        expect(state.activeBasemaps[0].opacity).toBe(0.45);
+        expect(state.activeBasemaps[0].opacityDisabled).toBeFalsy();
+    });
+});
+describe('ActiveBasemapsSerializer.deserialize (preferNames)', () => {
+    beforeAll(() => {
+        context.configManager.Config.share.preferNames = true;
+    });
+    afterAll(() => {
+        context.configManager.Config.share.preferNames = false;
+    });
+    it('should deserialize a valid basemap id and set it as activeBasemap (preferNames)', () => {
+        const basemaps = [
+            new Basemap({
+                id: 1,
+                name: 'OpenStreetMap'
+            })
+        ];
+        basemaps.forEach((basemap) => {
+            context.stateManager.state.basemaps[basemap.id] = basemap;
+        });
+        serializer.brainDeserialize('[{"id":999,"name":"OpenStreetMap","opacity":-1}]');
+        const state = context.stateManager.state;
+        expect(state.activeBasemaps).toBeInstanceOf((Array));
+        expect(state.activeBasemaps[0].id).toBe(basemaps[0].id);
+        expect(state.activeBasemaps[0].opacity).toBe(-1);
+        expect(state.activeBasemaps[0].opacityDisabled).toBeTruthy();
+    });
+    it('should deserialize a valid basemap even if another one cannot be found (preferNames)', () => {
+        const basemaps = [
+            new Basemap({
+                id: 1,
+                name: 'OpenStreetMap'
+            })
+        ];
+        basemaps.forEach((basemap) => {
+            context.stateManager.state.basemaps[basemap.id] = basemap;
+        });
+        serializer.brainDeserialize('[{"id":999,"name":"OpenStreetMap","opacity":-1},{"id":888,"name":"NotExisting","opacity":0.5}]');
+        const state = context.stateManager.state;
+        expect(state.activeBasemaps).toBeInstanceOf((Array));
+        expect(state.activeBasemaps[0].id).toBe(basemaps[0].id);
+        expect(state.activeBasemaps[0].opacity).toBe(-1);
+        expect(state.activeBasemaps[0].opacityDisabled).toBeTruthy();
+    });
+    it('should deserialize a valid basemap with the right opacity (preferNames)', () => {
+        const basemaps = [
+            new Basemap({
+                id: 1,
+                name: 'OpenStreetMap'
+            })
+        ];
+        basemaps.forEach((basemap) => {
+            context.stateManager.state.basemaps[basemap.id] = basemap;
+        });
+        serializer.brainDeserialize('[{"id":999,"name":"OpenStreetMap","opacity":0.45}]');
+        const state = context.stateManager.state;
+        expect(state.activeBasemaps).toBeInstanceOf((Array));
+        expect(state.activeBasemaps[0].id).toBe(basemaps[0].id);
+        expect(state.activeBasemaps[0].opacity).toBe(0.45);
+        expect(state.activeBasemaps[0].opacityDisabled).toBeFalsy();
     });
 });

package/tools/share/serializers/layerconfigserializer.d.ts

@@ -7,6 +7,7 @@ export default class LayersConfigSerializer implements IBrainSerializer<LayersCo
     private readonly context;
     constructor(context: IGirafeContext);
     private get state();
+    private get preferNames();
     brainSerialize(layersConfig: LayersConfig): string;
     protected serialize(layers: BaseLayer[]): string;
     brainDeserialize(str: string): void;
@@ -16,6 +17,7 @@ export default class LayersConfigSerializer implements IBrainSerializer<LayersCo
     private getExternalSerializedTheme;
     private getExternalSerializedLayer;
     private getInternalSerializedGroupOrTheme;
+    private getInternalLayerType;
     private getInternalSerializedLayer;
     private getDeserializedLayerTree;
     private deserializeInternalObject;
@@ -24,8 +26,11 @@ export default class LayersConfigSerializer implements IBrainSerializer<LayersCo
     private deserializeInternalLayer;
     private checkUnknownLayers;
     private removeUnnecessaryChilds;
+    private reorderChildren;
     private findBaseLayerById;
-    private findLayerRecursive;
+    private findLayerRecursiveById;
+    private findBaseLayerByName;
+    private findLayerRecursiveByName;
     private deserializeExternalObject;
     private deserializeExternalTheme;
     private deserializeExternalWmsLayer;

package/tools/share/serializers/layerconfigserializer.js

@@ -7,6 +7,11 @@ import ThemeLayerExternal from '../../../models/layers/themelayerexternal.js';
 import LayerWmsExternal from '../../../models/layers/layerwmsexternal.js';
 import LayerWmtsExternal from '../../../models/layers/layerwmtsexternal.js';
 import ServerOgc from '../../../models/serverogc.js';
+import LayerWmts from '../../../models/layers/layerwmts.js';
+import LayerVectorTiles from '../../../models/layers/layervectortiles.js';
+import LayerCog from '../../../models/layers/layercog.js';
+import LayerOsm from '../../../models/layers/layerosm.js';
+import LayerXYZ from '../../../models/layers/layerxyz.js';
 export default class LayersConfigSerializer {
     context;
     constructor(context) {
@@ -15,6 +20,9 @@ export default class LayersConfigSerializer {
     get state() {
         return this.context.stateManager.state;
     }
+    get preferNames() {
+        return this.context.configManager.Config.share?.preferNames ?? false;
+    }
     brainSerialize(layersConfig) {
         return this.serialize(layersConfig.layersList);
     }
@@ -104,6 +112,7 @@ export default class LayersConfigSerializer {
         const originalTheme = this.context.themesHelper.findBaseLayerById(group.id);
         const sharedChildren = [];
         const removedChildrenIds = [];
+        const removedChildrenNames = [];
         for (const originalChild of originalTheme.children) {
             const index = group.children.findIndex((el) => el.id === originalChild.id);
             if (index >= 0) {
@@ -114,6 +123,7 @@ export default class LayersConfigSerializer {
             else {
                 // Element is not in the list any more, and therefore should not be shared or restored
                 removedChildrenIds.push(originalChild.id);
+                removedChildrenNames.push(originalChild.name);
             }
         }
         return {
@@ -123,9 +133,39 @@ export default class LayersConfigSerializer {
             isExpanded: Number(group.isExpanded),
             timeRestriction: isTimeAwareLayer(group) ? group.timeRestriction : undefined,
             children: sharedChildren,
-            excludedChildrenIds: removedChildrenIds
+            excludedChildrenIds: removedChildrenIds,
+            name: group.name,
+            type: this.getInternalLayerType(group),
+            excludedChildrenNames: removedChildrenNames
         };
     }
+    getInternalLayerType(layer) {
+        if (layer instanceof ThemeLayer) {
+            return 'theme';
+        }
+        if (layer instanceof GroupLayer) {
+            return 'group';
+        }
+        if (layer instanceof LayerWms) {
+            return 'wms';
+        }
+        if (layer instanceof LayerWmts) {
+            return 'wmts';
+        }
+        if (layer instanceof LayerVectorTiles) {
+            return 'vt';
+        }
+        if (layer instanceof LayerCog) {
+            return 'cog';
+        }
+        if (layer instanceof LayerOsm) {
+            return 'osm';
+        }
+        if (layer instanceof LayerXYZ) {
+            return 'xyz';
+        }
+        throw new Error(`The layer ${layer.name} has an unknown type and cannot be shared.`);
+    }
     getInternalSerializedLayer(layer) {
         return {
             id: layer.id,
@@ -137,7 +177,9 @@ export default class LayersConfigSerializer {
             filter: layer instanceof LayerWms && this.context.layerManager.isLayerWithFilter(layer)
                 ? layer.filter
                 : undefined,
-            timeRestriction: isTimeAwareLayer(layer) ? layer.timeRestriction : undefined
+            timeRestriction: isTimeAwareLayer(layer) ? layer.timeRestriction : undefined,
+            name: layer.name,
+            type: this.getInternalLayerType(layer)
         };
     }
     getDeserializedLayerTree(sharedLayers) {
@@ -146,7 +188,12 @@ export default class LayersConfigSerializer {
             let layer;
             if ('id' in sharedLayer) {
                 // Id attribute found => we are on an internal layer
-                layer = this.findBaseLayerById(sharedLayer.id);
+                if (this.preferNames && sharedLayer.name) {
+                    layer = this.findBaseLayerByName(sharedLayer.name, sharedLayer.type);
+                }
+                else {
+                    layer = this.findBaseLayerById(sharedLayer.id);
+                }
                 if (layer) {
                     this.deserializeInternalObject(layer, sharedLayer);
                 }
@@ -228,7 +275,9 @@ export default class LayersConfigSerializer {
         let reorder = false;
         for (let i = originalLayer.children.length - 1; i >= 0; i--) {
             const child = originalLayer.children[i];
-            const serializedChild = sharedLayer.children.find((l) => l.id == child.id);
+            const serializedChild = this.preferNames
+                ? sharedLayer.children.find((l) => l.name == child.name)
+                : sharedLayer.children.find((l) => l.id == child.id);
             if (serializedChild) {
                 this.deserializeInternalObject(child, serializedChild);
             }
@@ -236,7 +285,9 @@ export default class LayersConfigSerializer {
                 // This child exists in the original layer, but not in the shared state.
                 // => If it is present in the x list, it was explicitely removed
                 // And we can remove it from the current object
-                const explicitlyRemoved = sharedLayer.excludedChildrenIds.find((id) => id == child.id);
+                const explicitlyRemoved = this.preferNames
+                    ? sharedLayer.excludedChildrenNames.find((name) => name == child.name)
+                    : sharedLayer.excludedChildrenIds.find((id) => id == child.id);
                 if (explicitlyRemoved) {
                     originalLayer.children.splice(i, 1);
                     console.debug(`Layer ${child.name} was removed from initial state`);
@@ -253,23 +304,26 @@ export default class LayersConfigSerializer {
             }
         }
         if (reorder) {
-            console.debug(`Reordering childs for layer ${originalLayer.name}`);
-            let order = 1;
-            for (const child of originalLayer.children) {
-                child.order = order++;
-            }
+            this.reorderChildren(originalLayer);
+        }
+    }
+    reorderChildren(originalLayer) {
+        console.debug(`Reordering childs for layer ${originalLayer.name}`);
+        let order = 1;
+        for (const child of originalLayer.children) {
+            child.order = order++;
         }
     }
     findBaseLayerById(layerId) {
         for (const theme of Object.values(this.state.themes._allThemes)) {
-            const layer = this.findLayerRecursive(theme, layerId);
+            const layer = this.findLayerRecursiveById(theme, layerId);
             if (layer) {
                 return layer;
             }
         }
         return null;
     }
-    findLayerRecursive(layer, layerId) {
+    findLayerRecursiveById(layer, layerId) {
         if (layer.id === layerId) {
             // When deserializing the layer, we clone it,
             // otherwise the following operation will also
@@ -280,7 +334,35 @@ export default class LayersConfigSerializer {
         // Else, we call recursively on the children
         if (layer instanceof GroupLayer || layer instanceof ThemeLayer) {
             for (const childLayer of layer.children) {
-                const foundChild = this.findLayerRecursive(childLayer, layerId);
+                const foundChild = this.findLayerRecursiveById(childLayer, layerId);
+                if (foundChild) {
+                    return foundChild;
+                }
+            }
+        }
+        return null;
+    }
+    findBaseLayerByName(layerName, layerType) {
+        for (const theme of Object.values(this.state.themes._allThemes)) {
+            const layer = this.findLayerRecursiveByName(theme, layerName, layerType);
+            if (layer) {
+                return layer;
+            }
+        }
+        return null;
+    }
+    findLayerRecursiveByName(layer, layerName, layerType) {
+        if (layer.name === layerName && this.getInternalLayerType(layer) === layerType) {
+            // When deserializing the layer, we clone it,
+            // otherwise the following operation will also
+            // affect the layer referenced in other themes
+            const foundLayer = layer.clone();
+            return foundLayer;
+        }
+        // Else, we call recursively on the children
+        if (layer instanceof GroupLayer || layer instanceof ThemeLayer) {
+            for (const childLayer of layer.children) {
+                const foundChild = this.findLayerRecursiveByName(childLayer, layerName, layerType);
                 if (foundChild) {
                     return foundChild;
                 }

package/tools/share/serializers/layerconfigserializer.spec.js

@@ -74,10 +74,16 @@ function getTestData(options = {}) {
                     checked: options.isGroupChecked ? 1 : 0,
                     isExpanded: options.isGroupExpanded ? 1 : 0,
                     children: [],
-                    excludedChildrenIds: options.addSecondMissingLayer ? [22] : []
+                    excludedChildrenIds: options.addSecondMissingLayer ? [22] : [],
+                    name: 'Group 1',
+                    type: 'group',
+                    excludedChildrenNames: options.addSecondMissingLayer ? ['Layer WMTS 2'] : []
                 }
             ],
-            excludedChildrenIds: options.addSecondMissingGroup ? [12] : []
+            excludedChildrenIds: options.addSecondMissingGroup ? [12] : [],
+            name: 'test-theme',
+            type: 'theme',
+            excludedChildrenNames: options.addSecondMissingGroup ? ['Group 2'] : []
         }
     ];
     if (options.addWmtsLayer) {
@@ -87,7 +93,9 @@ function getTestData(options = {}) {
             checked: 0,
             isExpanded: 0,
             opacity: options.opacity ?? 1,
-            swiped: options.swiped ?? 'no'
+            swiped: options.swiped ?? 'no',
+            name: 'Layer WMTS 1',
+            type: 'wmts'
         });
     }
     return {
@@ -269,6 +277,70 @@ describe('LayersConfigSerializer.deserialize', () => {
         expect(serialized).toEqual(data.controlValue);
     });
 });
+describe('LayersConfigSerializer.deserialize (preferNames)', () => {
+    beforeAll(() => {
+        context.configManager.Config.share.preferNames = true;
+    });
+    afterAll(() => {
+        context.configManager.Config.share.preferNames = false;
+    });
+    it('should return serialized data for a GroupLayer (id, order) (preferNames)', () => {
+        const data = getTestData();
+        serializer.brainDeserialize(data.controlValue);
+        const layersConfig = context.stateManager.state.layers;
+        const serialized = serializer.brainSerialize(layersConfig);
+        expect(serialized).toEqual(data.controlValue);
+    });
+    it('should return serialized data for a GroupLayer (isExpanded) (preferNames)', () => {
+        const data = getTestData({ isGroupExpanded: true });
+        serializer.brainDeserialize(data.controlValue);
+        const layersConfig = context.stateManager.state.layers;
+        const serialized = serializer.brainSerialize(layersConfig);
+        expect(serialized).toEqual(data.controlValue);
+    });
+    it('should return serialized data for a GroupLayer with children (preferNames)', () => {
+        const data = getTestData({ addWmtsLayer: true });
+        serializer.brainDeserialize(data.controlValue);
+        const layersConfig = context.stateManager.state.layers;
+        const serialized = serializer.brainSerialize(layersConfig);
+        expect(serialized).toEqual(data.controlValue);
+    });
+    it('should return serialized data for a GroupLayer with children (opacity) (preferNames)', () => {
+        const data = getTestData({ addWmtsLayer: true, opacity: 0.5 });
+        serializer.brainDeserialize(data.controlValue);
+        const layersConfig = context.stateManager.state.layers;
+        const serialized = serializer.brainSerialize(layersConfig);
+        expect(serialized).toEqual(data.controlValue);
+    });
+    it('should return serialized data for a GroupLayer with children (swiped left) (preferNames)', () => {
+        const data = getTestData({ addWmtsLayer: true, swiped: 'left' });
+        serializer.brainDeserialize(data.controlValue);
+        const layersConfig = context.stateManager.state.layers;
+        const serialized = serializer.brainSerialize(layersConfig);
+        expect(serialized).toEqual(data.controlValue);
+    });
+    it('should return serialized data for a GroupLayer with children (swiped right) (preferNames)', () => {
+        const data = getTestData({ addWmtsLayer: true, swiped: 'left' });
+        serializer.brainDeserialize(data.controlValue);
+        const layersConfig = context.stateManager.state.layers;
+        const serialized = serializer.brainSerialize(layersConfig);
+        expect(serialized).toEqual(data.controlValue);
+    });
+    it('should serialize a missing original group correctly (explicitely removed) (preferNames)', () => {
+        const data = getTestData({ addSecondMissingGroup: true });
+        serializer.brainDeserialize(data.controlValue);
+        const layersConfig = context.stateManager.state.layers;
+        const serialized = serializer.brainSerialize(layersConfig);
+        expect(serialized).toEqual(data.controlValue);
+    });
+    it('should serialize a missing original layer correctly (explicitely removed) (preferNames)', () => {
+        const data = getTestData({ addWmtsLayer: true, addSecondMissingLayer: true });
+        serializer.brainDeserialize(data.controlValue);
+        const layersConfig = context.stateManager.state.layers;
+        const serialized = serializer.brainSerialize(layersConfig);
+        expect(serialized).toEqual(data.controlValue);
+    });
+});
 describe('LayersConfigSerializer.serialize external', () => {
     it('should return serialized data for an external theme', () => {
         const data = getExternalTestData();

package/tools/share/serializers/sharedtypes.d.ts

@@ -20,6 +20,16 @@ export type SharedInternalTheme = {
      * Or if it was explicitly removed from the user, and then we won't have to display it again
      */
     excludedChildrenIds: number[];
+    /**
+     * When configuring the share with "preferNames=true", the name of the layer will be used to generate the sahred state
+     * instead of the ID. But in this case, we also have to share the type os the layer, because tha layer name can be
+     * the same for a them, a group, a WMS-Layer, a WMTSLayer, etc...
+     * Also note that the "excludedChildrenNames" options has some limitations : if we have 2 layers of different types with the same name
+     * And if one of it is exceluded, both will be excluded.
+     */
+    name: string;
+    type: string;
+    excludedChildrenNames: string[];
 };
 export type SharedInternalGroup = {
     id: number;
@@ -29,6 +39,9 @@ export type SharedInternalGroup = {
     timeRestriction?: string;
     children: SharedInternalLayer[];
     excludedChildrenIds: number[];
+    name: string;
+    type: string;
+    excludedChildrenNames: string[];
 };
 export type SharedInternalLayer = {
     id: number;
@@ -39,6 +52,8 @@ export type SharedInternalLayer = {
     opacity?: number;
     swiped?: 'left' | 'right' | 'no';
     filter?: SharedFilter;
+    name: string;
+    type: string;
 };
 export type SharedExternalTheme = {
     name: string;
@@ -64,3 +79,8 @@ export type SharedExternalLayer = {
     opacity?: number;
     swiped?: 'left' | 'right' | 'no';
 };
+export type SharedBasemap = {
+    id: number;
+    name: string;
+    opacity: number;
+};