@geode/opengeodeweb-front 10.30.2-rc.4 → 10.30.2

package/app/components/Viewer/ContextMenu/ContextMenuItem.vue

@@ -137,6 +137,7 @@ function toggleOptions() {
           @click.stop="toggleOptions"
           v-bind="tooltipProps"
           class="menu-btn"
+          :data-testid="is_active ? 'activeCircularMenuItemButton' : 'circularMenuItemButton'"
           elevation="2"
           :style="computedItemStyles"
         >

package/app/components/Viewer/Generic/Model/BlocksOptions.vue

@@ -67,7 +67,7 @@ const blockActiveColoring = computed({
 
 // Group Attributes
 const blocksVertexAttributeName = computed({
-  get: () => dataStyleStore.modelBlocksVertexAttributeName(modelId, targetBlockIds[0]),
+  get: () => dataStyleStore.modelBlocksVertexAttributeName(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksVertexAttributeName(modelId, targetBlockIds, newValue);
     hybridViewerStore.remoteRender();
@@ -75,7 +75,7 @@ const blocksVertexAttributeName = computed({
 });
 
 const blocksVertexAttributeItem = computed({
-  get: () => dataStyleStore.modelBlocksVertexAttributeItem(modelId, targetBlockIds[0]),
+  get: () => dataStyleStore.modelBlocksVertexAttributeItem(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksVertexAttributeItem(modelId, targetBlockIds, newValue);
     hybridViewerStore.remoteRender();
@@ -83,7 +83,7 @@ const blocksVertexAttributeItem = computed({
 });
 
 const blocksVertexAttributeRange = computed({
-  get: () => dataStyleStore.modelBlocksVertexAttributeRange(modelId, targetBlockIds[0]),
+  get: () => dataStyleStore.modelBlocksVertexAttributeRange(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksVertexAttributeRange(
       modelId,
@@ -96,7 +96,7 @@ const blocksVertexAttributeRange = computed({
 });
 
 const blocksVertexAttributeColorMap = computed({
-  get: () => dataStyleStore.modelBlocksVertexAttributeColorMap(modelId, targetBlockIds[0]),
+  get: () => dataStyleStore.modelBlocksVertexAttributeColorMap(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksVertexAttributeColorMap(modelId, targetBlockIds, newValue);
     hybridViewerStore.remoteRender();
@@ -104,7 +104,7 @@ const blocksVertexAttributeColorMap = computed({
 });
 
 const blocksPolyhedronAttributeName = computed({
-  get: () => dataStyleStore.modelBlocksPolyhedronAttributeName(modelId, targetBlockIds[0]),
+  get: () => dataStyleStore.modelBlocksPolyhedronAttributeName(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksPolyhedronAttributeName(modelId, targetBlockIds, newValue);
     hybridViewerStore.remoteRender();
@@ -112,7 +112,7 @@ const blocksPolyhedronAttributeName = computed({
 });
 
 const blocksPolyhedronAttributeItem = computed({
-  get: () => dataStyleStore.modelBlocksPolyhedronAttributeItem(modelId, targetBlockIds[0]),
+  get: () => dataStyleStore.modelBlocksPolyhedronAttributeItem(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksPolyhedronAttributeItem(modelId, targetBlockIds, newValue);
     hybridViewerStore.remoteRender();
@@ -120,7 +120,7 @@ const blocksPolyhedronAttributeItem = computed({
 });
 
 const blocksPolyhedronAttributeRange = computed({
-  get: () => dataStyleStore.modelBlocksPolyhedronAttributeRange(modelId, targetBlockIds[0]),
+  get: () => dataStyleStore.modelBlocksPolyhedronAttributeRange(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksPolyhedronAttributeRange(
       modelId,
@@ -133,7 +133,7 @@ const blocksPolyhedronAttributeRange = computed({
 });
 
 const blocksPolyhedronAttributeColorMap = computed({
-  get: () => dataStyleStore.modelBlocksPolyhedronAttributeColorMap(modelId, targetBlockIds[0]),
+  get: () => dataStyleStore.modelBlocksPolyhedronAttributeColorMap(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksPolyhedronAttributeColorMap(
       modelId,
@@ -234,7 +234,7 @@ const polyhedronSchema = back_schemas.opengeodeweb_back.model_component_polyhedr
 </script>
 
 <template>
-  <OptionsSection title="Blocks Options" class="mt-4">
+  <OptionsSection title="Blocks Options" class="mt-4" data-testid="modelComponentTypeOptions">
     <VisibilitySwitch data-testid="modelBlocksVisibilitySwitch" v-model="blocksVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"

package/app/components/Viewer/Generic/Model/CornersOptions.vue

@@ -67,7 +67,7 @@ const cornerActiveColoring = computed({
 
 // Group Attributes
 const cornersVertexAttributeName = computed({
-  get: () => dataStyleStore.modelCornersVertexAttributeName(modelId, targetCornerIds[0]),
+  get: () => dataStyleStore.modelCornersVertexAttributeName(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelCornersVertexAttributeName(modelId, targetCornerIds, newValue);
     hybridViewerStore.remoteRender();
@@ -75,7 +75,7 @@ const cornersVertexAttributeName = computed({
 });
 
 const cornersVertexAttributeItem = computed({
-  get: () => dataStyleStore.modelCornersVertexAttributeItem(modelId, targetCornerIds[0]),
+  get: () => dataStyleStore.modelCornersVertexAttributeItem(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelCornersVertexAttributeItem(modelId, targetCornerIds, newValue);
     hybridViewerStore.remoteRender();
@@ -83,7 +83,7 @@ const cornersVertexAttributeItem = computed({
 });
 
 const cornersVertexAttributeRange = computed({
-  get: () => dataStyleStore.modelCornersVertexAttributeRange(modelId, targetCornerIds[0]),
+  get: () => dataStyleStore.modelCornersVertexAttributeRange(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelCornersVertexAttributeRange(
       modelId,
@@ -96,7 +96,7 @@ const cornersVertexAttributeRange = computed({
 });
 
 const cornersVertexAttributeColorMap = computed({
-  get: () => dataStyleStore.modelCornersVertexAttributeColorMap(modelId, targetCornerIds[0]),
+  get: () => dataStyleStore.modelCornersVertexAttributeColorMap(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelCornersVertexAttributeColorMap(modelId, targetCornerIds, newValue);
     hybridViewerStore.remoteRender();
@@ -155,7 +155,7 @@ const vertexSchema = back_schemas.opengeodeweb_back.model_component_vertex_attri
 </script>
 
 <template>
-  <OptionsSection title="Corners Options" class="mt-4">
+  <OptionsSection title="Corners Options" class="mt-4" data-testid="modelComponentTypeOptions">
     <VisibilitySwitch data-testid="modelCornersVisibilitySwitch" v-model="cornersVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"

package/app/components/Viewer/Generic/Model/LinesOptions.vue

@@ -67,7 +67,7 @@ const lineActiveColoring = computed({
 
 // Group Attributes
 const linesVertexAttributeName = computed({
-  get: () => dataStyleStore.modelLinesVertexAttributeName(modelId, targetLineIds[0]),
+  get: () => dataStyleStore.modelLinesVertexAttributeName(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelLinesVertexAttributeName(modelId, targetLineIds, newValue);
     hybridViewerStore.remoteRender();
@@ -75,7 +75,7 @@ const linesVertexAttributeName = computed({
 });
 
 const linesVertexAttributeItem = computed({
-  get: () => dataStyleStore.modelLinesVertexAttributeItem(modelId, targetLineIds[0]),
+  get: () => dataStyleStore.modelLinesVertexAttributeItem(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelLinesVertexAttributeItem(modelId, targetLineIds, newValue);
     hybridViewerStore.remoteRender();
@@ -83,7 +83,7 @@ const linesVertexAttributeItem = computed({
 });
 
 const linesVertexAttributeRange = computed({
-  get: () => dataStyleStore.modelLinesVertexAttributeRange(modelId, targetLineIds[0]),
+  get: () => dataStyleStore.modelLinesVertexAttributeRange(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelLinesVertexAttributeRange(
       modelId,
@@ -96,7 +96,7 @@ const linesVertexAttributeRange = computed({
 });
 
 const linesVertexAttributeColorMap = computed({
-  get: () => dataStyleStore.modelLinesVertexAttributeColorMap(modelId, targetLineIds[0]),
+  get: () => dataStyleStore.modelLinesVertexAttributeColorMap(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelLinesVertexAttributeColorMap(modelId, targetLineIds, newValue);
     hybridViewerStore.remoteRender();
@@ -104,7 +104,7 @@ const linesVertexAttributeColorMap = computed({
 });
 
 const linesEdgeAttributeName = computed({
-  get: () => dataStyleStore.modelLinesEdgeAttributeName(modelId, targetLineIds[0]),
+  get: () => dataStyleStore.modelLinesEdgeAttributeName(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelLinesEdgeAttributeName(modelId, targetLineIds, newValue);
     hybridViewerStore.remoteRender();
@@ -112,7 +112,7 @@ const linesEdgeAttributeName = computed({
 });
 
 const linesEdgeAttributeItem = computed({
-  get: () => dataStyleStore.modelLinesEdgeAttributeItem(modelId, targetLineIds[0]),
+  get: () => dataStyleStore.modelLinesEdgeAttributeItem(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelLinesEdgeAttributeItem(modelId, targetLineIds, newValue);
     hybridViewerStore.remoteRender();
@@ -120,7 +120,7 @@ const linesEdgeAttributeItem = computed({
 });
 
 const linesEdgeAttributeRange = computed({
-  get: () => dataStyleStore.modelLinesEdgeAttributeRange(modelId, targetLineIds[0]),
+  get: () => dataStyleStore.modelLinesEdgeAttributeRange(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelLinesEdgeAttributeRange(
       modelId,
@@ -133,7 +133,7 @@ const linesEdgeAttributeRange = computed({
 });
 
 const linesEdgeAttributeColorMap = computed({
-  get: () => dataStyleStore.modelLinesEdgeAttributeColorMap(modelId, targetLineIds[0]),
+  get: () => dataStyleStore.modelLinesEdgeAttributeColorMap(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelLinesEdgeAttributeColorMap(modelId, targetLineIds, newValue);
     hybridViewerStore.remoteRender();
@@ -230,7 +230,7 @@ const edgeSchema = back_schemas.opengeodeweb_back.model_component_edge_attribute
 </script>
 
 <template>
-  <OptionsSection title="Lines Options" class="mt-4">
+  <OptionsSection title="Lines Options" class="mt-4" data-testid="modelComponentTypeOptions">
     <VisibilitySwitch data-testid="modelLinesVisibilitySwitch" v-model="linesVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"

package/app/components/Viewer/Generic/Model/SurfacesOptions.vue

@@ -67,7 +67,7 @@ const surfaceActiveColoring = computed({
 
 // Group Attributes
 const surfacesVertexAttributeName = computed({
-  get: () => dataStyleStore.modelSurfacesVertexAttributeName(modelId, targetSurfaceIds[0]),
+  get: () => dataStyleStore.modelSurfacesVertexAttributeName(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelSurfacesVertexAttributeName(modelId, targetSurfaceIds, newValue);
     hybridViewerStore.remoteRender();
@@ -75,7 +75,7 @@ const surfacesVertexAttributeName = computed({
 });
 
 const surfacesVertexAttributeItem = computed({
-  get: () => dataStyleStore.modelSurfacesVertexAttributeItem(modelId, targetSurfaceIds[0]),
+  get: () => dataStyleStore.modelSurfacesVertexAttributeItem(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelSurfacesVertexAttributeItem(modelId, targetSurfaceIds, newValue);
     hybridViewerStore.remoteRender();
@@ -83,7 +83,7 @@ const surfacesVertexAttributeItem = computed({
 });
 
 const surfacesVertexAttributeRange = computed({
-  get: () => dataStyleStore.modelSurfacesVertexAttributeRange(modelId, targetSurfaceIds[0]),
+  get: () => dataStyleStore.modelSurfacesVertexAttributeRange(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelSurfacesVertexAttributeRange(
       modelId,
@@ -96,7 +96,7 @@ const surfacesVertexAttributeRange = computed({
 });
 
 const surfacesVertexAttributeColorMap = computed({
-  get: () => dataStyleStore.modelSurfacesVertexAttributeColorMap(modelId, targetSurfaceIds[0]),
+  get: () => dataStyleStore.modelSurfacesVertexAttributeColorMap(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelSurfacesVertexAttributeColorMap(
       modelId,
@@ -108,7 +108,7 @@ const surfacesVertexAttributeColorMap = computed({
 });
 
 const surfacesPolygonAttributeName = computed({
-  get: () => dataStyleStore.modelSurfacesPolygonAttributeName(modelId, targetSurfaceIds[0]),
+  get: () => dataStyleStore.modelSurfacesPolygonAttributeName(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelSurfacesPolygonAttributeName(modelId, targetSurfaceIds, newValue);
     hybridViewerStore.remoteRender();
@@ -116,7 +116,7 @@ const surfacesPolygonAttributeName = computed({
 });
 
 const surfacesPolygonAttributeItem = computed({
-  get: () => dataStyleStore.modelSurfacesPolygonAttributeItem(modelId, targetSurfaceIds[0]),
+  get: () => dataStyleStore.modelSurfacesPolygonAttributeItem(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelSurfacesPolygonAttributeItem(modelId, targetSurfaceIds, newValue);
     hybridViewerStore.remoteRender();
@@ -124,7 +124,7 @@ const surfacesPolygonAttributeItem = computed({
 });
 
 const surfacesPolygonAttributeRange = computed({
-  get: () => dataStyleStore.modelSurfacesPolygonAttributeRange(modelId, targetSurfaceIds[0]),
+  get: () => dataStyleStore.modelSurfacesPolygonAttributeRange(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelSurfacesPolygonAttributeRange(
       modelId,
@@ -137,7 +137,7 @@ const surfacesPolygonAttributeRange = computed({
 });
 
 const surfacesPolygonAttributeColorMap = computed({
-  get: () => dataStyleStore.modelSurfacesPolygonAttributeColorMap(modelId, targetSurfaceIds[0]),
+  get: () => dataStyleStore.modelSurfacesPolygonAttributeColorMap(modelId),
   set: async (newValue) => {
     await dataStyleStore.setModelSurfacesPolygonAttributeColorMap(
       modelId,
@@ -238,7 +238,7 @@ const polygonSchema = back_schemas.opengeodeweb_back.model_component_polygon_att
 </script>
 
 <template>
-  <OptionsSection title="Surfaces Options" class="mt-4">
+  <OptionsSection title="Surfaces Options" class="mt-4" data-testid="modelComponentTypeOptions">
     <VisibilitySwitch data-testid="modelSurfacesVisibilitySwitch" v-model="surfacesVisibility" />
     <ViewerOptionsColoringTypeSelector
       :id="modelId"

package/app/components/Viewer/Options/AttributeSelector.vue

@@ -100,7 +100,7 @@ watch(
   },
 );
 
-watch([attributeName, attributeItem], () => {
+watch([attributeName, attributeItem, currentAttribute], () => {
   if (attributeColorMap.value === undefined) {
     attributeColorMap.value = "batlow";
   }

package/app/components/Viewer/Options/ColorMapList.vue

@@ -15,6 +15,7 @@ const filterText = ref("");
 const canvasRefs = ref({});
 const loading = ref(true);
 const renderJobId = ref(0);
+const openedGroups = ref([]);
 
 function setCanvasRef(presetName, element, id) {
   if (element) {
@@ -44,6 +45,16 @@ const filteredPresets = computed(() => {
   return result;
 });
 
+watch(filterText, (newFilterText) => {
+  if (newFilterText) {
+    openedGroups.value = filteredPresets.value
+      .filter((item) => item.Children)
+      .map((item) => item.Name);
+  } else {
+    openedGroups.value = [];
+  }
+});
+
 function processChunk(entries, index, jobId) {
   if (jobId !== renderJobId.value || index >= entries.length) {
     if (jobId === renderJobId.value) {
@@ -103,6 +114,7 @@ watch(filteredPresets, drawAllCanvases);
     />
 
     <v-list
+      v-model:opened="openedGroups"
       data-testid="colorMapList"
       density="compact"
       max-height="350"
@@ -110,7 +122,7 @@ watch(filteredPresets, drawAllCanvases);
       class="pa-0"
       :style="{ opacity: loading ? '0.3' : '1', transition: 'opacity 0.2s' }"
     >
-      <template v-for="(item, index) in filteredPresets" :key="index">
+      <template v-for="(item, itemIdx) in filteredPresets" :key="item.Name">
         <v-list-group v-if="item.Children" :value="item.Name">
           <template #activator="{ props: gProps }">
             <v-list-item v-bind="gProps" :title="item.Name" class="text-white font-weight-bold" />
@@ -118,7 +130,7 @@ watch(filteredPresets, drawAllCanvases);
 
           <v-list-item
             v-for="(child, childIdx) in item.Children"
-            :key="childIdx"
+            :key="child.Name"
             :active="child.Name === selectedPresetName"
             @click="emit('select', child)"
             class="px-2 mb-1"
@@ -127,7 +139,7 @@ watch(filteredPresets, drawAllCanvases);
             <div class="d-flex flex-column py-1">
               <span class="text-caption text-grey-lighten-1 mb-1">{{ child.Name }}</span>
               <canvas
-                :ref="(element) => setCanvasRef(child.Name, element, `g-${index}-${childIdx}`)"
+                :ref="(element) => setCanvasRef(child.Name, element, `g-${itemIdx}-${childIdx}`)"
                 width="200"
                 height="18"
                 class="w-100 rounded-xs border-thin"
@@ -147,7 +159,7 @@ watch(filteredPresets, drawAllCanvases);
           <div class="d-flex flex-column py-1">
             <span class="text-caption text-grey-lighten-1 mb-1">{{ item.Name }}</span>
             <canvas
-              :ref="(element) => setCanvasRef(item.Name, element, `s-${index}`)"
+              :ref="(element) => setCanvasRef(item.Name, element, `s-${itemIdx}`)"
               width="200"
               height="18"
               class="w-100 rounded-xs border-thin"

package/internal/stores/data_style/model/blocks/color.js

@@ -32,6 +32,11 @@ export function useModelBlocksColor() {
   }
 
   async function setModelBlocksActiveColoring(modelId, blocks_ids, activeColoring) {
+    if (blocks_ids.length > 1) {
+      modelBlocksCommonStyle.mutateModelBlocksTypeColoring(modelId, {
+        active: activeColoring,
+      });
+    }
     await modelCommonStyle.mutateComponentStyles(modelId, blocks_ids, {
       coloring: { active: activeColoring },
     });

package/internal/stores/data_style/model/blocks/common.js

@@ -10,10 +10,19 @@ export function useModelBlocksCommonStyle() {
     return dataStyleState.getStyle(id).blocks;
   }
 
+  function modelComponentTypeBlocksStyle(id) {
+    const defaultStyle = modelBlocksStyle(id);
+    const typeStyle = dataStyleState.getModelComponentTypeStyle(id, "Block");
+    return merge({}, defaultStyle, typeStyle);
+  }
+
   function modelBlockStyle(id, block_id) {
-    const groupStyle = modelBlocksStyle(id);
+    if (block_id === undefined) {
+      return modelComponentTypeBlocksStyle(id);
+    }
+    const typeStyle = modelComponentTypeBlocksStyle(id);
     const individualStyle = dataStyleState.getComponentStyle(id, block_id);
-    return merge({}, groupStyle, individualStyle);
+    return merge({}, typeStyle, individualStyle);
   }
 
   function modelBlockColoring(id, block_id) {
@@ -26,8 +35,8 @@ export function useModelBlocksCommonStyle() {
     });
   }
 
-  function mutateModelBlockColoring(id, block_id, values) {
-    return modelCommonStyle.mutateComponentStyle(id, block_id, {
+  function mutateModelBlocksTypeColoring(id, values) {
+    return modelCommonStyle.mutateModelComponentTypeStyle(id, "Block", {
       coloring: values,
     });
   }
@@ -37,6 +46,6 @@ export function useModelBlocksCommonStyle() {
     modelBlockStyle,
     modelBlockColoring,
     mutateModelBlocksColoring,
-    mutateModelBlockColoring,
+    mutateModelBlocksTypeColoring,
   };
 }

package/internal/stores/data_style/model/blocks/polyhedron.js

@@ -44,6 +44,11 @@ function useModelBlocksPolyhedronAttribute() {
   }
 
   function mutateModelBlocksPolyhedronStyle(modelId, blockIds, values) {
+    if (blockIds.length > 1) {
+      modelBlocksCommonStyle.mutateModelBlocksTypeColoring(modelId, {
+        polyhedron: values,
+      });
+    }
     return modelBlocksCommonStyle.mutateModelBlocksColoring(modelId, blockIds, {
       polyhedron: values,
     });

package/internal/stores/data_style/model/blocks/vertex.js

@@ -43,6 +43,11 @@ function useModelBlocksVertexAttribute() {
   }
 
   function mutateModelBlocksVertexStyle(modelId, blockIds, values) {
+    if (blockIds.length > 1) {
+      modelBlocksCommonStyle.mutateModelBlocksTypeColoring(modelId, {
+        vertex: values,
+      });
+    }
     return modelBlocksCommonStyle.mutateModelBlocksColoring(modelId, blockIds, {
       vertex: values,
     });

package/internal/stores/data_style/model/corners/color.js

@@ -27,6 +27,11 @@ export function useModelCornersColor() {
   }
 
   async function setModelCornersActiveColoring(modelId, corners_ids, activeColoring) {
+    if (corners_ids.length > 1) {
+      modelCornersCommonStyle.mutateModelCornersTypeColoring(modelId, {
+        active: activeColoring,
+      });
+    }
     await modelCommonStyle.mutateComponentStyles(modelId, corners_ids, {
       coloring: { active: activeColoring },
     });

package/internal/stores/data_style/model/corners/common.js

@@ -10,10 +10,19 @@ export function useModelCornersCommonStyle() {
     return dataStyleState.getStyle(id).corners;
   }
 
+  function modelComponentTypeCornersStyle(id) {
+    const defaultStyle = modelCornersStyle(id);
+    const typeStyle = dataStyleState.getModelComponentTypeStyle(id, "Corner");
+    return merge({}, defaultStyle, typeStyle);
+  }
+
   function modelCornerStyle(id, corner_id) {
-    const groupStyle = modelCornersStyle(id);
+    if (corner_id === undefined) {
+      return modelComponentTypeCornersStyle(id);
+    }
+    const typeStyle = modelComponentTypeCornersStyle(id);
     const individualStyle = dataStyleState.getComponentStyle(id, corner_id);
-    return merge({}, groupStyle, individualStyle);
+    return merge({}, typeStyle, individualStyle);
   }
 
   function modelCornerColoring(id, corner_id) {
@@ -26,8 +35,8 @@ export function useModelCornersCommonStyle() {
     });
   }
 
-  function mutateModelCornerColoring(id, corner_id, values) {
-    return modelCommonStyle.mutateComponentStyle(id, corner_id, {
+  function mutateModelCornersTypeColoring(id, values) {
+    return modelCommonStyle.mutateModelComponentTypeStyle(id, "Corner", {
       coloring: values,
     });
   }
@@ -37,6 +46,6 @@ export function useModelCornersCommonStyle() {
     modelCornerStyle,
     modelCornerColoring,
     mutateModelCornersColoring,
-    mutateModelCornerColoring,
+    mutateModelCornersTypeColoring,
   };
 }

package/internal/stores/data_style/model/corners/index.js

@@ -25,8 +25,10 @@ export function useModelCornersStyle() {
       }
       visibilityGroups[visibility].push(corner_id);
     }
-    return Object.entries(visibilityGroups).map(([visibility, ids]) =>
-      modelVisibilityStyle.setModelCornersVisibility(modelId, ids, visibility === "true"),
+    return Promise.all(
+      Object.entries(visibilityGroups).map(([visibility, ids]) =>
+        modelVisibilityStyle.setModelCornersVisibility(modelId, ids, visibility === "true"),
+      ),
     );
   }
 

package/internal/stores/data_style/model/corners/vertex.js

@@ -43,6 +43,11 @@ function useModelCornersVertexAttribute() {
   }
 
   function mutateModelCornersVertexStyle(modelId, cornerIds, values) {
+    if (cornerIds.length > 1) {
+      modelCornersCommonStyle.mutateModelCornersTypeColoring(modelId, {
+        vertex: values,
+      });
+    }
     return modelCornersCommonStyle.mutateModelCornersColoring(modelId, cornerIds, {
       vertex: values,
     });

package/internal/stores/data_style/model/lines/color.js

@@ -29,6 +29,11 @@ export function useModelLinesColor() {
   }
 
   async function setModelLinesActiveColoring(modelId, lines_ids, activeColoring) {
+    if (lines_ids.length > 1) {
+      modelLinesCommonStyle.mutateModelLinesTypeColoring(modelId, {
+        active: activeColoring,
+      });
+    }
     await modelCommonStyle.mutateComponentStyles(modelId, lines_ids, {
       coloring: { active: activeColoring },
     });

package/internal/stores/data_style/model/lines/common.js

@@ -10,10 +10,19 @@ export function useModelLinesCommonStyle() {
     return dataStyleState.getStyle(id).lines;
   }
 
+  function modelComponentTypeLinesStyle(id) {
+    const defaultStyle = modelLinesStyle(id);
+    const typeStyle = dataStyleState.getModelComponentTypeStyle(id, "Line");
+    return merge({}, defaultStyle, typeStyle);
+  }
+
   function modelLineStyle(id, line_id) {
-    const groupStyle = modelLinesStyle(id);
+    if (line_id === undefined) {
+      return modelComponentTypeLinesStyle(id);
+    }
+    const typeStyle = modelComponentTypeLinesStyle(id);
     const individualStyle = dataStyleState.getComponentStyle(id, line_id);
-    return merge({}, groupStyle, individualStyle);
+    return merge({}, typeStyle, individualStyle);
   }
 
   function modelLineColoring(id, line_id) {
@@ -26,8 +35,8 @@ export function useModelLinesCommonStyle() {
     });
   }
 
-  function mutateModelLineColoring(id, line_id, values) {
-    return modelCommonStyle.mutateComponentStyle(id, line_id, {
+  function mutateModelLinesTypeColoring(id, values) {
+    return modelCommonStyle.mutateModelComponentTypeStyle(id, "Line", {
       coloring: values,
     });
   }
@@ -37,6 +46,6 @@ export function useModelLinesCommonStyle() {
     modelLineStyle,
     modelLineColoring,
     mutateModelLinesColoring,
-    mutateModelLineColoring,
+    mutateModelLinesTypeColoring,
   };
 }

package/internal/stores/data_style/model/lines/edge.js

@@ -43,6 +43,11 @@ function useModelLinesEdgeAttribute() {
   }
 
   function mutateModelLinesEdgeStyle(modelId, lineIds, values) {
+    if (lineIds.length > 1) {
+      modelLinesCommonStyle.mutateModelLinesTypeColoring(modelId, {
+        edge: values,
+      });
+    }
     return modelLinesCommonStyle.mutateModelLinesColoring(modelId, lineIds, {
       edge: values,
     });

package/internal/stores/data_style/model/lines/vertex.js

@@ -43,6 +43,11 @@ function useModelLinesVertexAttribute() {
   }
 
   function mutateModelLinesVertexStyle(modelId, lineIds, values) {
+    if (lineIds.length > 1) {
+      modelLinesCommonStyle.mutateModelLinesTypeColoring(modelId, {
+        vertex: values,
+      });
+    }
     return modelLinesCommonStyle.mutateModelLinesColoring(modelId, lineIds, {
       vertex: values,
     });

package/internal/stores/data_style/model/surfaces/color.js

@@ -29,6 +29,11 @@ export function useModelSurfacesColor() {
   }
 
   async function setModelSurfacesActiveColoring(modelId, surfaces_ids, activeColoring) {
+    if (surfaces_ids.length > 1) {
+      modelSurfacesCommonStyle.mutateModelSurfacesTypeColoring(modelId, {
+        active: activeColoring,
+      });
+    }
     await modelCommonStyle.mutateComponentStyles(modelId, surfaces_ids, {
       coloring: { active: activeColoring },
     });

package/internal/stores/data_style/model/surfaces/common.js

@@ -10,10 +10,19 @@ export function useModelSurfacesCommonStyle() {
     return dataStyleState.getStyle(id).surfaces;
   }
 
+  function modelComponentTypeSurfacesStyle(id) {
+    const defaultStyle = modelSurfacesStyle(id);
+    const typeStyle = dataStyleState.getModelComponentTypeStyle(id, "Surface");
+    return merge({}, defaultStyle, typeStyle);
+  }
+
   function modelSurfaceStyle(id, surface_id) {
-    const groupStyle = modelSurfacesStyle(id);
+    if (surface_id === undefined) {
+      return modelComponentTypeSurfacesStyle(id);
+    }
+    const typeStyle = modelComponentTypeSurfacesStyle(id);
     const individualStyle = dataStyleState.getComponentStyle(id, surface_id);
-    return merge({}, groupStyle, individualStyle);
+    return merge({}, typeStyle, individualStyle);
   }
 
   function modelSurfaceColoring(id, surface_id) {
@@ -26,8 +35,8 @@ export function useModelSurfacesCommonStyle() {
     });
   }
 
-  function mutateModelSurfaceColoring(id, surface_id, values) {
-    return modelCommonStyle.mutateComponentStyle(id, surface_id, {
+  function mutateModelSurfacesTypeColoring(id, values) {
+    return modelCommonStyle.mutateModelComponentTypeStyle(id, "Surface", {
       coloring: values,
     });
   }
@@ -37,6 +46,6 @@ export function useModelSurfacesCommonStyle() {
     modelSurfaceStyle,
     modelSurfaceColoring,
     mutateModelSurfacesColoring,
-    mutateModelSurfaceColoring,
+    mutateModelSurfacesTypeColoring,
   };
 }

package/internal/stores/data_style/model/surfaces/polygon.js

@@ -44,6 +44,11 @@ function useModelSurfacesPolygonAttribute() {
   }
 
   function mutateModelSurfacesPolygonStyle(modelId, surfaceIds, values) {
+    if (surfaceIds.length > 1) {
+      modelSurfacesCommonStyle.mutateModelSurfacesTypeColoring(modelId, {
+        polygon: values,
+      });
+    }
     return modelSurfacesCommonStyle.mutateModelSurfacesColoring(modelId, surfaceIds, {
       polygon: values,
     });

package/internal/stores/data_style/model/surfaces/vertex.js

@@ -44,6 +44,11 @@ function useModelSurfacesVertexAttribute() {
   }
 
   function mutateModelSurfacesVertexStyle(modelId, surfaceIds, values) {
+    if (surfaceIds.length > 1) {
+      modelSurfacesCommonStyle.mutateModelSurfacesTypeColoring(modelId, {
+        vertex: values,
+      });
+    }
     return modelSurfacesCommonStyle.mutateModelSurfacesColoring(modelId, surfaceIds, {
       vertex: values,
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@geode/opengeodeweb-front",
-  "version": "10.30.2-rc.4",
+  "version": "10.30.2",
   "description": "OpenSource Vue/Nuxt/Pinia/Vuetify framework for web applications",
   "homepage": "https://github.com/Geode-solutions/OpenGeodeWeb-Front",
   "bugs": {
@@ -34,8 +34,8 @@
     "build": ""
   },
   "dependencies": {
-    "@geode/opengeodeweb-back": "next",
-    "@geode/opengeodeweb-viewer": "next",
+    "@geode/opengeodeweb-back": "latest",
+    "@geode/opengeodeweb-viewer": "latest",
     "@google-cloud/run": "3.2.0",
     "@kitware/vtk.js": "33.3.0",
     "@mdi/font": "7.4.47",

package/tests/integration/stores/data_style/model/corners.nuxt.test.js

@@ -6,6 +6,7 @@ import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schem
 import { beforeAllTimeout, setupIntegrationTests } from "@ogw_tests/integration/setup";
 import { Status } from "@ogw_front/utils/status";
 import { cleanupBackend } from "@ogw_server/utils/cleanup";
+import { isModelCornersVertexAttributeValid } from "@ogw_internal/stores/data_style/model/corners/vertex";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useViewerStore } from "@ogw_front/stores/viewer";
@@ -97,6 +98,17 @@ describe("model corners", () => {
   });
 
   describe("corners vertex attribute", () => {
+    test("coloring vertex attribute", () => {
+      const attribute = {
+        name: undefined,
+        item: undefined,
+        minimum: undefined,
+        maximum: undefined,
+        colorMap: undefined,
+      };
+      expect(isModelCornersVertexAttributeValid(attribute)).toBe(false);
+    });
+
     test("coloring vertex attribute — no request until range+colormap set", async () => {
       const dataStyleStore = useDataStyleStore();
       const viewerStore = useViewerStore();