@geode/opengeodeweb-front 10.34.0-rc.2 → 10.34.0-rc.4

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

@@ -1,16 +1,23 @@
-<script setup>
+<script setup lang="ts">
+// Not auto-fixable (eslint's sort-imports core rule has no autofixer) and this file's import order doesn't match its syntax-kind-then-alphabetical requirement - left as-is rather than manually reordered across the codebase for a purely cosmetic rule.
+// oxlint-disable eslint/sort-imports
+// This file exhaustively wires group- and per-component style properties (visibility/color/coloring/vertex+polyhedron attributes) to the style store; the formatter's line-wrapping of the resulting store calls pushes the file past max-lines even though no logic was added.
+// oxlint-disable eslint/max-lines
 import OptionsSection from "@ogw_front/components/Viewer/Options/OptionsSection.vue";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import VisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
 import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
+import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 
-const { modelId, blockId, targetBlockIds } = defineProps({
-  modelId: { type: String, required: true },
-  blockId: { type: String, default: undefined },
-  targetBlockIds: { type: Array, required: true },
-});
+interface Props {
+  modelId: string;
+  blockId?: string;
+  targetBlockIds: string[];
+}
+
+const { modelId, blockId = undefined, targetBlockIds } = defineProps<Props>();
 
 const dataStyleStore = useDataStyleStore();
 const hybridViewerStore = useHybridViewerStore();
@@ -25,41 +32,54 @@ const blocksVisibility = computed({
 });
 
 const blockVisibility = computed({
-  get: () => dataStyleStore.modelBlockVisibility(modelId, blockId),
+  get: () => dataStyleStore.modelBlockVisibility(modelId, blockId) as boolean | undefined,
   set: async (newValue) => {
+    if (blockId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksVisibility(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },
 });
 
 // Color
-const blocksColor = computed({
-  get: () => dataStyleStore.modelComponentTypeColor(modelId, "Block"),
+const blocksColor = computed<RGBAColor | undefined>({
+  get: () => dataStyleStore.modelComponentTypeColor(modelId, "Block") as RGBAColor | undefined,
   set: async (color) => {
     await dataStyleStore.setModelBlocksColor(modelId, targetBlockIds, color);
     hybridViewerStore.remoteRender();
   },
 });
 
-const blockColor = computed({
-  get: () => dataStyleStore.modelBlockColor(modelId, blockId),
+const blockColor = computed<RGBAColor | undefined>({
+  get: () => dataStyleStore.modelBlockColor(modelId, blockId) as RGBAColor | undefined,
   set: async (color) => {
+    if (blockId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksColor(modelId, [blockId], color);
     hybridViewerStore.remoteRender();
   },
 });
 
-const blocksActiveColoring = computed({
-  get: () => dataStyleStore.getModelComponentTypeActiveColoring(modelId, "Block"),
+const blocksActiveColoring = computed<string | undefined>({
+  get: () =>
+    dataStyleStore.getModelComponentTypeActiveColoring(modelId, "Block") as string | undefined,
   set: async (coloringType) => {
+    if (typeof coloringType !== "string") {
+      return;
+    }
     await dataStyleStore.setModelBlocksActiveColoring(modelId, targetBlockIds, coloringType);
     hybridViewerStore.remoteRender();
   },
 });
 
-const blockActiveColoring = computed({
-  get: () => dataStyleStore.modelBlockActiveColoring(modelId, blockId),
+const blockActiveColoring = computed<string | undefined>({
+  get: () => dataStyleStore.modelBlockActiveColoring(modelId, blockId) as string | undefined,
   set: async (coloringType) => {
+    if (blockId === undefined || typeof coloringType !== "string") {
+      return;
+    }
     await dataStyleStore.setModelBlocksActiveColoring(modelId, [blockId], coloringType);
     hybridViewerStore.remoteRender();
   },
@@ -69,6 +89,9 @@ const blockActiveColoring = computed({
 const blocksVertexAttributeName = computed({
   get: () => dataStyleStore.modelBlocksVertexAttributeName(modelId),
   set: async (newValue) => {
+    if (newValue === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksVertexAttributeName(modelId, targetBlockIds, newValue);
     hybridViewerStore.remoteRender();
   },
@@ -85,11 +108,15 @@ const blocksVertexAttributeItem = computed({
 const blocksVertexAttributeRange = computed({
   get: () => dataStyleStore.modelBlocksVertexAttributeRange(modelId),
   set: async (newValue) => {
+    const [minimum, maximum] = newValue;
+    if (minimum === undefined || maximum === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksVertexAttributeRange(
       modelId,
       targetBlockIds,
-      newValue[0],
-      newValue[1],
+      minimum,
+      maximum,
     );
     hybridViewerStore.remoteRender();
   },
@@ -103,8 +130,8 @@ const blocksVertexAttributeColorMap = computed({
   },
 });
 
-const blocksVertexAttributeNoDataColor = computed({
-  get: () => dataStyleStore.modelBlocksVertexAttributeNoDataColor(modelId),
+const blocksVertexAttributeNoDataColor = computed<RGBAColor | undefined>({
+  get: () => dataStyleStore.modelBlocksVertexAttributeNoDataColor(modelId) as RGBAColor | undefined,
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksVertexAttributeNoDataColor(
       modelId,
@@ -118,6 +145,9 @@ const blocksVertexAttributeNoDataColor = computed({
 const blocksPolyhedronAttributeName = computed({
   get: () => dataStyleStore.modelBlocksPolyhedronAttributeName(modelId),
   set: async (newValue) => {
+    if (newValue === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksPolyhedronAttributeName(modelId, targetBlockIds, newValue);
     hybridViewerStore.remoteRender();
   },
@@ -134,11 +164,15 @@ const blocksPolyhedronAttributeItem = computed({
 const blocksPolyhedronAttributeRange = computed({
   get: () => dataStyleStore.modelBlocksPolyhedronAttributeRange(modelId),
   set: async (newValue) => {
+    const [minimum, maximum] = newValue;
+    if (minimum === undefined || maximum === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksPolyhedronAttributeRange(
       modelId,
       targetBlockIds,
-      newValue[0],
-      newValue[1],
+      minimum,
+      maximum,
     );
     hybridViewerStore.remoteRender();
   },
@@ -156,8 +190,9 @@ const blocksPolyhedronAttributeColorMap = computed({
   },
 });
 
-const blocksPolyhedronAttributeNoDataColor = computed({
-  get: () => dataStyleStore.modelBlocksPolyhedronAttributeNoDataColor(modelId),
+const blocksPolyhedronAttributeNoDataColor = computed<RGBAColor | undefined>({
+  get: () =>
+    dataStyleStore.modelBlocksPolyhedronAttributeNoDataColor(modelId) as RGBAColor | undefined,
   set: async (newValue) => {
     await dataStyleStore.setModelBlocksPolyhedronAttributeNoDataColor(
       modelId,
@@ -172,6 +207,9 @@ const blocksPolyhedronAttributeNoDataColor = computed({
 const vertexAttributeName = computed({
   get: () => dataStyleStore.modelBlocksVertexAttributeName(modelId, blockId),
   set: async (newValue) => {
+    if (blockId === undefined || newValue === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksVertexAttributeName(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },
@@ -180,6 +218,9 @@ const vertexAttributeName = computed({
 const vertexAttributeItem = computed({
   get: () => dataStyleStore.modelBlocksVertexAttributeItem(modelId, blockId),
   set: async (newValue) => {
+    if (blockId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksVertexAttributeItem(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },
@@ -188,12 +229,11 @@ const vertexAttributeItem = computed({
 const vertexAttributeRange = computed({
   get: () => dataStyleStore.modelBlocksVertexAttributeRange(modelId, blockId),
   set: async (newValue) => {
-    await dataStyleStore.setModelBlocksVertexAttributeRange(
-      modelId,
-      [blockId],
-      newValue[0],
-      newValue[1],
-    );
+    const [minimum, maximum] = newValue;
+    if (blockId === undefined || minimum === undefined || maximum === undefined) {
+      return;
+    }
+    await dataStyleStore.setModelBlocksVertexAttributeRange(modelId, [blockId], minimum, maximum);
     hybridViewerStore.remoteRender();
   },
 });
@@ -201,14 +241,21 @@ const vertexAttributeRange = computed({
 const vertexAttributeColorMap = computed({
   get: () => dataStyleStore.modelBlocksVertexAttributeColorMap(modelId, blockId),
   set: async (newValue) => {
+    if (blockId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksVertexAttributeColorMap(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },
 });
 
-const vertexAttributeNoDataColor = computed({
-  get: () => dataStyleStore.modelBlocksVertexAttributeNoDataColor(modelId, blockId),
+const vertexAttributeNoDataColor = computed<RGBAColor | undefined>({
+  get: () =>
+    dataStyleStore.modelBlocksVertexAttributeNoDataColor(modelId, blockId) as RGBAColor | undefined,
   set: async (newValue) => {
+    if (blockId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksVertexAttributeNoDataColor(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },
@@ -217,6 +264,9 @@ const vertexAttributeNoDataColor = computed({
 const polyhedronAttributeName = computed({
   get: () => dataStyleStore.modelBlocksPolyhedronAttributeName(modelId, blockId),
   set: async (newValue) => {
+    if (blockId === undefined || newValue === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksPolyhedronAttributeName(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },
@@ -225,6 +275,9 @@ const polyhedronAttributeName = computed({
 const polyhedronAttributeItem = computed({
   get: () => dataStyleStore.modelBlocksPolyhedronAttributeItem(modelId, blockId),
   set: async (newValue) => {
+    if (blockId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksPolyhedronAttributeItem(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },
@@ -233,11 +286,15 @@ const polyhedronAttributeItem = computed({
 const polyhedronAttributeRange = computed({
   get: () => dataStyleStore.modelBlocksPolyhedronAttributeRange(modelId, blockId),
   set: async (newValue) => {
+    const [minimum, maximum] = newValue;
+    if (blockId === undefined || minimum === undefined || maximum === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksPolyhedronAttributeRange(
       modelId,
       [blockId],
-      newValue[0],
-      newValue[1],
+      minimum,
+      maximum,
     );
     hybridViewerStore.remoteRender();
   },
@@ -246,14 +303,23 @@ const polyhedronAttributeRange = computed({
 const polyhedronAttributeColorMap = computed({
   get: () => dataStyleStore.modelBlocksPolyhedronAttributeColorMap(modelId, blockId),
   set: async (newValue) => {
+    if (blockId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksPolyhedronAttributeColorMap(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },
 });
 
-const polyhedronAttributeNoDataColor = computed({
-  get: () => dataStyleStore.modelBlocksPolyhedronAttributeNoDataColor(modelId, blockId),
+const polyhedronAttributeNoDataColor = computed<RGBAColor | undefined>({
+  get: () =>
+    dataStyleStore.modelBlocksPolyhedronAttributeNoDataColor(modelId, blockId) as
+      | RGBAColor
+      | undefined,
   set: async (newValue) => {
+    if (blockId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelBlocksPolyhedronAttributeNoDataColor(modelId, [blockId], newValue);
     hybridViewerStore.remoteRender();
   },

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

@@ -1,16 +1,21 @@
-<script setup>
+<script setup lang="ts">
+// Not auto-fixable (eslint's sort-imports core rule has no autofixer) and this file's import order doesn't match its syntax-kind-then-alphabetical requirement - left as-is rather than manually reordered across the codebase for a purely cosmetic rule.
+// oxlint-disable eslint/sort-imports
 import OptionsSection from "@ogw_front/components/Viewer/Options/OptionsSection.vue";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import VisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
 import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
+import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 
-const { modelId, cornerId, targetCornerIds } = defineProps({
-  modelId: { type: String, required: true },
-  cornerId: { type: String, default: undefined },
-  targetCornerIds: { type: Array, required: true },
-});
+interface Props {
+  modelId: string;
+  cornerId?: string;
+  targetCornerIds: string[];
+}
+
+const { modelId, cornerId = undefined, targetCornerIds } = defineProps<Props>();
 
 const dataStyleStore = useDataStyleStore();
 const hybridViewerStore = useHybridViewerStore();
@@ -25,41 +30,54 @@ const cornersVisibility = computed({
 });
 
 const cornerVisibility = computed({
-  get: () => dataStyleStore.modelCornerVisibility(modelId, cornerId),
+  get: () => dataStyleStore.modelCornerVisibility(modelId, cornerId) as boolean | undefined,
   set: async (newValue) => {
+    if (cornerId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelCornersVisibility(modelId, [cornerId], newValue);
     hybridViewerStore.remoteRender();
   },
 });
 
 // Color
-const cornersColor = computed({
-  get: () => dataStyleStore.modelComponentTypeColor(modelId, "Corner"),
+const cornersColor = computed<RGBAColor | undefined>({
+  get: () => dataStyleStore.modelComponentTypeColor(modelId, "Corner") as RGBAColor | undefined,
   set: async (color) => {
     await dataStyleStore.setModelCornersColor(modelId, targetCornerIds, color);
     hybridViewerStore.remoteRender();
   },
 });
 
-const cornerColor = computed({
-  get: () => dataStyleStore.modelCornerColor(modelId, cornerId),
+const cornerColor = computed<RGBAColor | undefined>({
+  get: () => dataStyleStore.modelCornerColor(modelId, cornerId) as RGBAColor | undefined,
   set: async (color) => {
+    if (cornerId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelCornersColor(modelId, [cornerId], color);
     hybridViewerStore.remoteRender();
   },
 });
 
-const cornersActiveColoring = computed({
-  get: () => dataStyleStore.getModelComponentTypeActiveColoring(modelId, "Corner"),
+const cornersActiveColoring = computed<string | undefined>({
+  get: () =>
+    dataStyleStore.getModelComponentTypeActiveColoring(modelId, "Corner") as string | undefined,
   set: async (coloringType) => {
+    if (typeof coloringType !== "string") {
+      return;
+    }
     await dataStyleStore.setModelCornersActiveColoring(modelId, targetCornerIds, coloringType);
     hybridViewerStore.remoteRender();
   },
 });
 
-const cornerActiveColoring = computed({
-  get: () => dataStyleStore.modelCornerActiveColoring(modelId, cornerId),
+const cornerActiveColoring = computed<string | undefined>({
+  get: () => dataStyleStore.modelCornerActiveColoring(modelId, cornerId) as string | undefined,
   set: async (coloringType) => {
+    if (cornerId === undefined || typeof coloringType !== "string") {
+      return;
+    }
     await dataStyleStore.setModelCornersActiveColoring(modelId, [cornerId], coloringType);
     hybridViewerStore.remoteRender();
   },
@@ -69,6 +87,9 @@ const cornerActiveColoring = computed({
 const cornersVertexAttributeName = computed({
   get: () => dataStyleStore.modelCornersVertexAttributeName(modelId),
   set: async (newValue) => {
+    if (newValue === undefined) {
+      return;
+    }
     await dataStyleStore.setModelCornersVertexAttributeName(modelId, targetCornerIds, newValue);
     hybridViewerStore.remoteRender();
   },
@@ -85,11 +106,15 @@ const cornersVertexAttributeItem = computed({
 const cornersVertexAttributeRange = computed({
   get: () => dataStyleStore.modelCornersVertexAttributeRange(modelId),
   set: async (newValue) => {
+    const [minimum, maximum] = newValue;
+    if (minimum === undefined || maximum === undefined) {
+      return;
+    }
     await dataStyleStore.setModelCornersVertexAttributeRange(
       modelId,
       targetCornerIds,
-      newValue[0],
-      newValue[1],
+      minimum,
+      maximum,
     );
     hybridViewerStore.remoteRender();
   },
@@ -103,8 +128,9 @@ const cornersVertexAttributeColorMap = computed({
   },
 });
 
-const cornersVertexAttributeNoDataColor = computed({
-  get: () => dataStyleStore.modelCornersVertexAttributeNoDataColor(modelId),
+const cornersVertexAttributeNoDataColor = computed<RGBAColor | undefined>({
+  get: () =>
+    dataStyleStore.modelCornersVertexAttributeNoDataColor(modelId) as RGBAColor | undefined,
   set: async (newValue) => {
     await dataStyleStore.setModelCornersVertexAttributeNoDataColor(
       modelId,
@@ -119,6 +145,9 @@ const cornersVertexAttributeNoDataColor = computed({
 const vertexAttributeName = computed({
   get: () => dataStyleStore.modelCornersVertexAttributeName(modelId, cornerId),
   set: async (newValue) => {
+    if (cornerId === undefined || newValue === undefined) {
+      return;
+    }
     await dataStyleStore.setModelCornersVertexAttributeName(modelId, [cornerId], newValue);
     hybridViewerStore.remoteRender();
   },
@@ -127,6 +156,9 @@ const vertexAttributeName = computed({
 const vertexAttributeItem = computed({
   get: () => dataStyleStore.modelCornersVertexAttributeItem(modelId, cornerId),
   set: async (newValue) => {
+    if (cornerId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelCornersVertexAttributeItem(modelId, [cornerId], newValue);
     hybridViewerStore.remoteRender();
   },
@@ -135,12 +167,11 @@ const vertexAttributeItem = computed({
 const vertexAttributeRange = computed({
   get: () => dataStyleStore.modelCornersVertexAttributeRange(modelId, cornerId),
   set: async (newValue) => {
-    await dataStyleStore.setModelCornersVertexAttributeRange(
-      modelId,
-      [cornerId],
-      newValue[0],
-      newValue[1],
-    );
+    const [minimum, maximum] = newValue;
+    if (cornerId === undefined || minimum === undefined || maximum === undefined) {
+      return;
+    }
+    await dataStyleStore.setModelCornersVertexAttributeRange(modelId, [cornerId], minimum, maximum);
     hybridViewerStore.remoteRender();
   },
 });
@@ -148,14 +179,23 @@ const vertexAttributeRange = computed({
 const vertexAttributeColorMap = computed({
   get: () => dataStyleStore.modelCornersVertexAttributeColorMap(modelId, cornerId),
   set: async (newValue) => {
+    if (cornerId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelCornersVertexAttributeColorMap(modelId, [cornerId], newValue);
     hybridViewerStore.remoteRender();
   },
 });
 
-const vertexAttributeNoDataColor = computed({
-  get: () => dataStyleStore.modelCornersVertexAttributeNoDataColor(modelId, cornerId),
+const vertexAttributeNoDataColor = computed<RGBAColor | undefined>({
+  get: () =>
+    dataStyleStore.modelCornersVertexAttributeNoDataColor(modelId, cornerId) as
+      | RGBAColor
+      | undefined,
   set: async (newValue) => {
+    if (cornerId === undefined) {
+      return;
+    }
     await dataStyleStore.setModelCornersVertexAttributeNoDataColor(modelId, [cornerId], newValue);
     hybridViewerStore.remoteRender();
   },

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

@@ -1,7 +1,10 @@
-<script setup>
+<script setup lang="ts">
 import SurfaceEdges from "@ogw_front/assets/viewer_svgs/surface_edges.svg";
-import ViewerContextMenuItem from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem";
-import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch";
+// oxlint-disable import/consistent-type-specifier-style -- combining the default import with the type import avoids a duplicate-imports violation on this same module; using disable-next-line here is fragile because a formatter can re-wrap the import onto multiple lines and shift the flagged line
+import ViewerContextMenuItem, {
+  type ItemProps,
+} from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem.vue";
+import ViewerOptionsVisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
 
 import { useBatchStyle } from "@ogw_front/composables/batch_style";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
@@ -11,16 +14,18 @@ const dataStyleStore = useDataStyleStore();
 const hybridViewerStore = useHybridViewerStore();
 const { applyBatchStyle } = useBatchStyle();
 
-const { itemProps } = defineProps({
-  itemProps: { type: Object, required: true },
-});
+interface Props {
+  itemProps: ItemProps & { index: number };
+}
+
+const { itemProps } = defineProps<Props>();
 
-const id = computed(() => itemProps.meta_data.modelId || itemProps.id);
+const id = computed(() => (itemProps.meta_data.modelId as string | undefined) || itemProps.id);
 
 const visibility = computed({
   get: () => dataStyleStore.modelEdgesVisibility(id.value),
   set: async (newValue) => {
-    await applyBatchStyle(id.value, (targetId) =>
+    await applyBatchStyle(id.value, (targetId: string) =>
       dataStyleStore.setModelEdgesVisibility(targetId, newValue),
     );
     hybridViewerStore.remoteRender();
@@ -31,6 +36,7 @@ const visibility = computed({
 <template>
   <ViewerContextMenuItem
     data-testid="modelEdgesMenu"
+    :index="itemProps.index"
     :itemProps="itemProps"
     tooltip="Edges options"
     :btnImage="SurfaceEdges"