@geode/opengeodeweb-front 10.34.0-rc.9 → 10.34.0

package/internal/stores/data_style/mesh/polyhedra/index.ts

@@ -9,87 +9,146 @@ import {
   isMeshPolyhedraVertexAttributeValid,
   useMeshPolyhedraVertexAttributeStyle,
 } from "./vertex";
+import type { StyleValues } from "@ogw_internal/stores/data_style/types.js";
 import { useMeshPolyhedraColorStyle } from "./color";
 import { useMeshPolyhedraCommonStyle } from "./common";
 import { useMeshPolyhedraVisibilityStyle } from "./visibility";
 
 // Local constants
 
-export function useMeshPolyhedraStyle() {
+interface MeshPolyhedraActiveColoringDeps {
+  readonly commonStyle: ReturnType<typeof useMeshPolyhedraCommonStyle>;
+  readonly colorStyle: ReturnType<typeof useMeshPolyhedraColorStyle>;
+  readonly vertexAttributeStyle: ReturnType<typeof useMeshPolyhedraVertexAttributeStyle>;
+  readonly polyhedronAttributeStyle: ReturnType<typeof useMeshPolyhedraPolyhedronAttributeStyle>;
+}
+
+function handleMeshPolyhedraVertexColoring(
+  id: string,
+  vertexAttributeStyle: ReturnType<typeof useMeshPolyhedraVertexAttributeStyle>,
+): Promise<unknown> | undefined {
+  const name = vertexAttributeStyle.meshPolyhedraVertexAttributeName(id);
+  const item = vertexAttributeStyle.meshPolyhedraVertexAttributeItem(id);
+  const [minimum, maximum] = vertexAttributeStyle.meshPolyhedraVertexAttributeRange(id);
+  const colorMap = vertexAttributeStyle.meshPolyhedraVertexAttributeColorMap(id);
+  const vertex_attribute = { name, item, minimum, maximum, colorMap };
+  if (!isMeshPolyhedraVertexAttributeValid(vertex_attribute)) {
+    return undefined;
+  }
+  return vertexAttributeStyle.setMeshPolyhedraVertexAttribute(id, vertex_attribute);
+}
+
+function handleMeshPolyhedraPolyhedronColoring(
+  id: string,
+  polyhedronAttributeStyle: ReturnType<typeof useMeshPolyhedraPolyhedronAttributeStyle>,
+): Promise<unknown> | undefined {
+  const name = polyhedronAttributeStyle.meshPolyhedraPolyhedronAttributeName(id);
+  const item = polyhedronAttributeStyle.meshPolyhedraPolyhedronAttributeItem(id);
+  const [minimum, maximum] = polyhedronAttributeStyle.meshPolyhedraPolyhedronAttributeRange(id);
+  const colorMap = polyhedronAttributeStyle.meshPolyhedraPolyhedronAttributeColorMap(id);
+  const polyhedron_attribute = { name, item, minimum, maximum, colorMap };
+  if (!isMeshPolyhedraPolyhedronAttributeValid(polyhedron_attribute)) {
+    return undefined;
+  }
+  return polyhedronAttributeStyle.setMeshPolyhedraPolyhedronAttribute(id, polyhedron_attribute);
+}
+
+async function setMeshPolyhedraActiveColoring(
+  id: string,
+  type: string | undefined,
+  deps: MeshPolyhedraActiveColoringDeps,
+): Promise<unknown> {
+  await deps.commonStyle.mutateMeshPolyhedraStyle(id, {
+    coloring: { active: type },
+  });
+  if (type === "constant") {
+    const result = await deps.colorStyle.setMeshPolyhedraColor(
+      id,
+      deps.colorStyle.meshPolyhedraColor(id),
+    );
+    return result;
+  }
+  if (type === "vertex") {
+    const result = await handleMeshPolyhedraVertexColoring(id, deps.vertexAttributeStyle);
+    return result;
+  }
+  if (type === "polyhedron") {
+    const result = await handleMeshPolyhedraPolyhedronColoring(id, deps.polyhedronAttributeStyle);
+    return result;
+  }
+  throw new Error(`Unknown mesh polyhedra coloring type: ${type}`);
+}
+
+async function applyMeshPolyhedraStyle(
+  id: string,
+  visibilityStyle: ReturnType<typeof useMeshPolyhedraVisibilityStyle>,
+  activeColoringType: string | undefined,
+  deps: MeshPolyhedraActiveColoringDeps,
+): Promise<unknown[]> {
+  const result = await Promise.all([
+    visibilityStyle.setMeshPolyhedraVisibility(id, visibilityStyle.meshPolyhedraVisibility(id)),
+    setMeshPolyhedraActiveColoring(id, activeColoringType, deps),
+  ]);
+  return result;
+}
+
+type UseMeshPolyhedraStyleReturn = ReturnType<typeof useMeshPolyhedraCommonStyle> & {
+  meshPolyhedraColoring: (id: string) => StyleValues;
+  meshPolyhedraActiveColoring: (id: string) => string | undefined;
+  setMeshPolyhedraActiveColoring: (id: string, type: string | undefined) => Promise<unknown>;
+  applyMeshPolyhedraStyle: (id: string) => Promise<unknown[]>;
+} & ReturnType<typeof useMeshPolyhedraVisibilityStyle> &
+  ReturnType<typeof useMeshPolyhedraColorStyle> &
+  ReturnType<typeof useMeshPolyhedraVertexAttributeStyle> &
+  ReturnType<typeof useMeshPolyhedraPolyhedronAttributeStyle>;
+
+export function useMeshPolyhedraStyle(): UseMeshPolyhedraStyleReturn {
   const meshPolyhedraCommonStyle = useMeshPolyhedraCommonStyle();
   const meshPolyhedraVisibility = useMeshPolyhedraVisibilityStyle();
   const meshPolyhedraColorStyle = useMeshPolyhedraColorStyle();
+  const meshPolyhedraVertexAttributeStyle = useMeshPolyhedraVertexAttributeStyle();
+  const meshPolyhedraPolyhedronAttributeStyle = useMeshPolyhedraPolyhedronAttributeStyle();
+
+  const activeColoringDeps: MeshPolyhedraActiveColoringDeps = {
+    commonStyle: meshPolyhedraCommonStyle,
+    colorStyle: meshPolyhedraColorStyle,
+    vertexAttributeStyle: meshPolyhedraVertexAttributeStyle,
+    polyhedronAttributeStyle: meshPolyhedraPolyhedronAttributeStyle,
+  };
 
-  function meshPolyhedraColoring(id: string) {
+  function meshPolyhedraColoring(id: string): StyleValues {
     return meshPolyhedraCommonStyle.meshPolyhedraColoring(id);
   }
-  const meshPolyhedraVertexAttributeStyle = useMeshPolyhedraVertexAttributeStyle();
-  const meshPolyhedraPolyhedronAttributeStyle = useMeshPolyhedraPolyhedronAttributeStyle();
 
   function meshPolyhedraActiveColoring(id: string): string | undefined {
+    // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.active is defined as string in the data style schema.
     return meshPolyhedraColoring(id).active as string | undefined;
   }
 
-  async function setMeshPolyhedraActiveColoring(id: string, type: string | undefined) {
-    await meshPolyhedraCommonStyle.mutateMeshPolyhedraStyle(id, {
-      coloring: { active: type },
-    });
-    if (type === "constant") {
-      return meshPolyhedraColorStyle.setMeshPolyhedraColor(
-        id,
-        meshPolyhedraColorStyle.meshPolyhedraColor(id),
-      );
-    }
-    if (type === "vertex") {
-      const name = meshPolyhedraVertexAttributeStyle.meshPolyhedraVertexAttributeName(id);
-      const item = meshPolyhedraVertexAttributeStyle.meshPolyhedraVertexAttributeItem(id);
-      const [minimum, maximum] =
-        meshPolyhedraVertexAttributeStyle.meshPolyhedraVertexAttributeRange(id);
-      const colorMap = meshPolyhedraVertexAttributeStyle.meshPolyhedraVertexAttributeColorMap(id);
-      const vertex_attribute = { name, item, minimum, maximum, colorMap };
-      if (!isMeshPolyhedraVertexAttributeValid(vertex_attribute)) {
-        return;
-      }
-      return meshPolyhedraVertexAttributeStyle.setMeshPolyhedraVertexAttribute(
-        id,
-        vertex_attribute,
-      );
-    }
-    if (type === "polyhedron") {
-      const name = meshPolyhedraPolyhedronAttributeStyle.meshPolyhedraPolyhedronAttributeName(id);
-      const item = meshPolyhedraPolyhedronAttributeStyle.meshPolyhedraPolyhedronAttributeItem(id);
-      const [minimum, maximum] =
-        meshPolyhedraPolyhedronAttributeStyle.meshPolyhedraPolyhedronAttributeRange(id);
-      const colorMap =
-        meshPolyhedraPolyhedronAttributeStyle.meshPolyhedraPolyhedronAttributeColorMap(id);
-      const polyhedron_attribute = { name, item, minimum, maximum, colorMap };
-      if (!isMeshPolyhedraPolyhedronAttributeValid(polyhedron_attribute)) {
-        return;
-      }
-      return meshPolyhedraPolyhedronAttributeStyle.setMeshPolyhedraPolyhedronAttribute(
-        id,
-        polyhedron_attribute,
-      );
-    }
-    throw new Error(`Unknown mesh polyhedra coloring type: ${type}`);
+  async function boundSetMeshPolyhedraActiveColoring(
+    id: string,
+    type: string | undefined,
+  ): Promise<unknown> {
+    const result = await setMeshPolyhedraActiveColoring(id, type, activeColoringDeps);
+    return result;
   }
 
-  function applyMeshPolyhedraStyle(id: string) {
-    return Promise.all([
-      meshPolyhedraVisibility.setMeshPolyhedraVisibility(
-        id,
-        meshPolyhedraVisibility.meshPolyhedraVisibility(id),
-      ),
-      setMeshPolyhedraActiveColoring(id, meshPolyhedraActiveColoring(id)),
-    ]);
+  async function boundApplyMeshPolyhedraStyle(id: string): Promise<unknown[]> {
+    const result = await applyMeshPolyhedraStyle(
+      id,
+      meshPolyhedraVisibility,
+      meshPolyhedraActiveColoring(id),
+      activeColoringDeps,
+    );
+    return result;
   }
 
   return {
     ...meshPolyhedraCommonStyle,
     meshPolyhedraColoring,
     meshPolyhedraActiveColoring,
-    setMeshPolyhedraActiveColoring,
-    applyMeshPolyhedraStyle,
+    setMeshPolyhedraActiveColoring: boundSetMeshPolyhedraActiveColoring,
+    applyMeshPolyhedraStyle: boundApplyMeshPolyhedraStyle,
     ...meshPolyhedraVisibility,
     ...meshPolyhedraColorStyle,
     ...meshPolyhedraVertexAttributeStyle,

package/internal/stores/data_style/mesh/polyhedra/polyhedron.ts

@@ -3,7 +3,6 @@ import { DEFAULT_NO_DATA_COLOR } from "@ogw_front/utils/default_styles/constants
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json";
 
 // Local imports
-import type { StyleValues } from "@ogw_internal/stores/data_style/types.js";
 import { getRGBPointsFromPreset } from "@ogw_front/utils/colormap";
 import { useMeshPolyhedraCommonStyle } from "./common";
 import { useViewerStore } from "@ogw_front/stores/viewer";
@@ -51,14 +50,39 @@ function isMeshPolyhedraPolyhedronAttributeValid({
 }
 
 // oxlint-disable-next-line max-lines-per-function
-function useMeshPolyhedraPolyhedronAttributeStyle() {
+function useMeshPolyhedraPolyhedronAttributeStyle(): {
+  meshPolyhedraPolyhedronAttributeName: (id: string) => string | undefined;
+  meshPolyhedraPolyhedronAttributeItem: (id: string) => number;
+  meshPolyhedraPolyhedronAttributeRange: (id: string) => [number | undefined, number | undefined];
+  meshPolyhedraPolyhedronAttributeColorMap: (id: string) => string | undefined;
+  meshPolyhedraPolyhedronAttributeStoredConfig: (
+    id: string,
+    name: string | undefined,
+    item: number | undefined,
+  ) => AttributeStoredConfig;
+  setMeshPolyhedraPolyhedronAttribute: (id: string, input: AttributeInput) => Promise<unknown>;
+  setMeshPolyhedraPolyhedronAttributeName: (id: string, name: string) => Promise<unknown>;
+  setMeshPolyhedraPolyhedronAttributeItem: (id: string, item: number) => Promise<unknown>;
+  setMeshPolyhedraPolyhedronAttributeRange: (
+    id: string,
+    minimum: number,
+    maximum: number,
+  ) => Promise<unknown>;
+  setMeshPolyhedraPolyhedronAttributeColorMap: (
+    id: string,
+    colorMap: string | undefined,
+  ) => Promise<unknown>;
+  meshPolyhedraPolyhedronAttributeNoDataColor: (id: string) => unknown;
+  setMeshPolyhedraPolyhedronAttributeNoDataColor: (
+    id: string,
+    no_data_color: unknown,
+  ) => Promise<unknown>;
+} {
   const viewerStore = useViewerStore();
   const meshPolyhedraCommonStyle = useMeshPolyhedraCommonStyle();
-  function meshPolyhedraColoring(id: string): StyleValues {
-    return meshPolyhedraCommonStyle.meshPolyhedraStyle(id).coloring as StyleValues;
-  }
   function meshPolyhedraPolyhedronAttribute(id: string): AttributeState {
-    return meshPolyhedraColoring(id).polyhedron as AttributeState;
+    // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.polyhedron shape is defined by the data style schema.
+    return meshPolyhedraCommonStyle.meshPolyhedraColoring(id).polyhedron as AttributeState;
   }
   function meshPolyhedraPolyhedronAttributeStoredConfig(
     id: string,
@@ -66,14 +90,10 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
     item: number | undefined,
   ): AttributeStoredConfig {
     const { storedConfigs } = meshPolyhedraPolyhedronAttribute(id);
-    if (
-      storedConfigs &&
-      name !== undefined &&
-      name in storedConfigs &&
-      item !== undefined &&
-      item in storedConfigs[name]!
-    ) {
-      return storedConfigs[name]![item]!;
+    const nameConfig = name === undefined ? undefined : storedConfigs?.[name];
+    const itemConfig = item === undefined ? undefined : nameConfig?.[item];
+    if (itemConfig !== undefined) {
+      return itemConfig;
     }
     return {
       minimum: undefined,
@@ -82,35 +102,41 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
       no_data_color: DEFAULT_NO_DATA_COLOR,
     };
   }
-  function mutateMeshPolyhedraPolyhedronStyle(id: string, values: Record<string, unknown>) {
-    return meshPolyhedraCommonStyle.mutateMeshPolyhedraStyle(id, {
+  async function mutateMeshPolyhedraPolyhedronStyle(
+    id: string,
+    values: Record<string, unknown>,
+  ): Promise<string> {
+    const result = await meshPolyhedraCommonStyle.mutateMeshPolyhedraStyle(id, {
       coloring: {
         polyhedron: values,
       },
     });
+    return result;
   }
-  function setMeshPolyhedraPolyhedronAttributeStoredConfig(
+  async function setMeshPolyhedraPolyhedronAttributeStoredConfig(
     id: string,
     name: string | undefined,
     item: number | undefined,
     config: Partial<AttributeStoredConfig>,
-  ) {
-    return mutateMeshPolyhedraPolyhedronStyle(id, {
+  ): Promise<string> {
+    const result = await mutateMeshPolyhedraPolyhedronStyle(id, {
       storedConfigs: {
-        [name as string]: {
+        [name ?? ""]: {
           lastItem: item,
-          [item as number]: config,
+          [item ?? 0]: config,
         },
       },
     });
+    return result;
   }
   function meshPolyhedraPolyhedronAttributeName(id: string): string | undefined {
     return meshPolyhedraPolyhedronAttribute(id).name;
   }
   function meshPolyhedraPolyhedronAttributeLastItem(id: string, name: string | undefined): number {
     const { storedConfigs } = meshPolyhedraPolyhedronAttribute(id);
-    if (storedConfigs && name !== undefined && name in storedConfigs) {
-      return storedConfigs[name]!.lastItem;
+    const nameConfig = name === undefined ? undefined : storedConfigs?.[name];
+    if (nameConfig !== undefined) {
+      return nameConfig.lastItem;
     }
     return 0;
   }
@@ -118,7 +144,7 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
     const { item, name } = meshPolyhedraPolyhedronAttribute(id);
     return item ?? meshPolyhedraPolyhedronAttributeLastItem(id, name);
   }
-  function setMeshPolyhedraPolyhedronAttribute(
+  async function setMeshPolyhedraPolyhedronAttribute(
     id: string,
     {
       name,
@@ -128,18 +154,18 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
       colorMap,
       no_data_color = DEFAULT_NO_DATA_COLOR,
     }: AttributeInput,
-  ) {
-    mutateMeshPolyhedraPolyhedronStyle(id, {
+  ): Promise<unknown> {
+    await mutateMeshPolyhedraPolyhedronStyle(id, {
       name,
       item,
     });
-    setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, item, {
+    await setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, item, {
       minimum,
       maximum,
       colorMap,
       no_data_color,
     });
-    const points = getRGBPointsFromPreset(colorMap as string);
+    const points = getRGBPointsFromPreset(colorMap ?? "");
     const schema = meshPolyhedraPolyhedronAttributeSchemas.attribute;
     const params = {
       id,
@@ -155,7 +181,7 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
       params,
     });
   }
-  function applyPolyhedronAttribute(id: string) {
+  async function applyPolyhedronAttribute(id: string): Promise<unknown> {
     const name = meshPolyhedraPolyhedronAttributeName(id);
     const item = meshPolyhedraPolyhedronAttributeItem(id);
     const storedConfig = meshPolyhedraPolyhedronAttributeStoredConfig(id, name, item);
@@ -168,19 +194,27 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
       no_data_color: storedConfig.no_data_color,
     };
     if (isMeshPolyhedraPolyhedronAttributeValid(attribute)) {
-      return setMeshPolyhedraPolyhedronAttribute(id, attribute);
+      const result = await setMeshPolyhedraPolyhedronAttribute(id, attribute);
+      return result;
     }
+    return undefined;
   }
-  function setMeshPolyhedraPolyhedronAttributeName(id: string, name: string) {
+  async function setMeshPolyhedraPolyhedronAttributeName(
+    id: string,
+    name: string,
+  ): Promise<unknown> {
     const item = meshPolyhedraPolyhedronAttributeLastItem(id, name);
-    mutateMeshPolyhedraPolyhedronStyle(id, {
+    await mutateMeshPolyhedraPolyhedronStyle(id, {
       name,
       item,
     });
     return applyPolyhedronAttribute(id);
   }
-  function setMeshPolyhedraPolyhedronAttributeItem(id: string, item: number) {
-    mutateMeshPolyhedraPolyhedronStyle(id, {
+  async function setMeshPolyhedraPolyhedronAttributeItem(
+    id: string,
+    item: number,
+  ): Promise<unknown> {
+    await mutateMeshPolyhedraPolyhedronStyle(id, {
       item,
     });
     return applyPolyhedronAttribute(id);
@@ -193,10 +227,14 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
     const storedConfig = meshPolyhedraPolyhedronAttributeStoredConfig(id, name, item);
     return [storedConfig.minimum, storedConfig.maximum];
   }
-  function setMeshPolyhedraPolyhedronAttributeRange(id: string, minimum: number, maximum: number) {
+  async function setMeshPolyhedraPolyhedronAttributeRange(
+    id: string,
+    minimum: number,
+    maximum: number,
+  ): Promise<unknown> {
     const name = meshPolyhedraPolyhedronAttributeName(id);
     const item = meshPolyhedraPolyhedronAttributeItem(id);
-    setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, item, {
+    await setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, item, {
       minimum,
       maximum,
     });
@@ -208,10 +246,13 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
     const storedConfig = meshPolyhedraPolyhedronAttributeStoredConfig(id, name, item);
     return storedConfig.colorMap;
   }
-  function setMeshPolyhedraPolyhedronAttributeColorMap(id: string, colorMap: string | undefined) {
+  async function setMeshPolyhedraPolyhedronAttributeColorMap(
+    id: string,
+    colorMap: string | undefined,
+  ): Promise<unknown> {
     const name = meshPolyhedraPolyhedronAttributeName(id);
     const item = meshPolyhedraPolyhedronAttributeItem(id);
-    setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, item, {
+    await setMeshPolyhedraPolyhedronAttributeStoredConfig(id, name, item, {
       colorMap,
     });
     return applyPolyhedronAttribute(id);
@@ -225,7 +266,7 @@ function useMeshPolyhedraPolyhedronAttributeStyle() {
   async function setMeshPolyhedraPolyhedronAttributeNoDataColor(
     id: string,
     no_data_color: unknown,
-  ) {
+  ): Promise<unknown> {
     const name = meshPolyhedraPolyhedronAttributeName(id);
     const item = meshPolyhedraPolyhedronAttributeItem(id);
     const storedConfig = meshPolyhedraPolyhedronAttributeStoredConfig(id, name, item);

package/internal/stores/data_style/mesh/polyhedra/vertex.ts

@@ -3,7 +3,6 @@ import { DEFAULT_NO_DATA_COLOR } from "@ogw_front/utils/default_styles/constants
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json";
 
 // Local imports
-import type { StyleValues } from "@ogw_internal/stores/data_style/types.js";
 import { getRGBPointsFromPreset } from "@ogw_front/utils/colormap";
 import { useMeshPolyhedraCommonStyle } from "./common";
 import { useViewerStore } from "@ogw_front/stores/viewer";
@@ -50,15 +49,42 @@ function isMeshPolyhedraVertexAttributeValid({
   );
 }
 
+interface UseMeshPolyhedraVertexAttributeStyleReturn {
+  meshPolyhedraVertexAttributeName: (id: string) => string | undefined;
+  meshPolyhedraVertexAttributeItem: (id: string) => number;
+  meshPolyhedraVertexAttributeRange: (id: string) => [number | undefined, number | undefined];
+  meshPolyhedraVertexAttributeColorMap: (id: string) => string | undefined;
+  meshPolyhedraVertexAttributeStoredConfig: (
+    id: string,
+    name: string | undefined,
+    item: number | undefined,
+  ) => AttributeStoredConfig;
+  setMeshPolyhedraVertexAttribute: (id: string, input: AttributeInput) => Promise<unknown>;
+  setMeshPolyhedraVertexAttributeName: (id: string, name: string) => Promise<unknown>;
+  setMeshPolyhedraVertexAttributeItem: (id: string, item: number) => Promise<unknown>;
+  setMeshPolyhedraVertexAttributeRange: (
+    id: string,
+    minimum: number,
+    maximum: number,
+  ) => Promise<unknown>;
+  setMeshPolyhedraVertexAttributeColorMap: (
+    id: string,
+    colorMap: string | undefined,
+  ) => Promise<unknown>;
+  meshPolyhedraVertexAttributeNoDataColor: (id: string) => unknown;
+  setMeshPolyhedraVertexAttributeNoDataColor: (
+    id: string,
+    no_data_color: unknown,
+  ) => Promise<unknown>;
+}
+
 // oxlint-disable-next-line max-lines-per-function
-function useMeshPolyhedraVertexAttributeStyle() {
+function useMeshPolyhedraVertexAttributeStyle(): UseMeshPolyhedraVertexAttributeStyleReturn {
   const viewerStore = useViewerStore();
   const meshPolyhedraCommonStyle = useMeshPolyhedraCommonStyle();
-  function meshPolyhedraColoring(id: string): StyleValues {
-    return meshPolyhedraCommonStyle.meshPolyhedraStyle(id).coloring as StyleValues;
-  }
   function meshPolyhedraVertexAttribute(id: string): AttributeState {
-    return meshPolyhedraColoring(id).vertex as AttributeState;
+    // oxlint-disable-next-line no-unsafe-type-assertion -- coloring.vertex shape is defined by the data style schema.
+    return meshPolyhedraCommonStyle.meshPolyhedraColoring(id).vertex as AttributeState;
   }
   function meshPolyhedraVertexAttributeStoredConfig(
     id: string,
@@ -66,14 +92,10 @@ function useMeshPolyhedraVertexAttributeStyle() {
     item: number | undefined,
   ): AttributeStoredConfig {
     const { storedConfigs } = meshPolyhedraVertexAttribute(id);
-    if (
-      storedConfigs &&
-      name !== undefined &&
-      name in storedConfigs &&
-      item !== undefined &&
-      item in storedConfigs[name]!
-    ) {
-      return storedConfigs[name]![item]!;
+    const nameConfig = name === undefined ? undefined : storedConfigs?.[name];
+    const itemConfig = item === undefined ? undefined : nameConfig?.[item];
+    if (itemConfig !== undefined) {
+      return itemConfig;
     }
     return {
       minimum: undefined,
@@ -82,35 +104,41 @@ function useMeshPolyhedraVertexAttributeStyle() {
       no_data_color: DEFAULT_NO_DATA_COLOR,
     };
   }
-  function mutateMeshPolyhedraVertexStyle(id: string, values: Record<string, unknown>) {
-    return meshPolyhedraCommonStyle.mutateMeshPolyhedraStyle(id, {
+  async function mutateMeshPolyhedraVertexStyle(
+    id: string,
+    values: Record<string, unknown>,
+  ): Promise<string> {
+    const result = await meshPolyhedraCommonStyle.mutateMeshPolyhedraStyle(id, {
       coloring: {
         vertex: values,
       },
     });
+    return result;
   }
-  function setMeshPolyhedraVertexAttributeStoredConfig(
+  async function setMeshPolyhedraVertexAttributeStoredConfig(
     id: string,
     name: string | undefined,
     item: number | undefined,
     config: Partial<AttributeStoredConfig>,
-  ) {
-    return mutateMeshPolyhedraVertexStyle(id, {
+  ): Promise<string> {
+    const result = await mutateMeshPolyhedraVertexStyle(id, {
       storedConfigs: {
-        [name as string]: {
+        [name ?? ""]: {
           lastItem: item,
-          [item as number]: config,
+          [item ?? 0]: config,
         },
       },
     });
+    return result;
   }
   function meshPolyhedraVertexAttributeName(id: string): string | undefined {
     return meshPolyhedraVertexAttribute(id).name;
   }
   function meshPolyhedraVertexAttributeLastItem(id: string, name: string | undefined): number {
     const { storedConfigs } = meshPolyhedraVertexAttribute(id);
-    if (storedConfigs && name !== undefined && name in storedConfigs) {
-      return storedConfigs[name]!.lastItem;
+    const nameConfig = name === undefined ? undefined : storedConfigs?.[name];
+    if (nameConfig !== undefined) {
+      return nameConfig.lastItem;
     }
     return 0;
   }
@@ -118,7 +146,7 @@ function useMeshPolyhedraVertexAttributeStyle() {
     const { item, name } = meshPolyhedraVertexAttribute(id);
     return item ?? meshPolyhedraVertexAttributeLastItem(id, name);
   }
-  function setMeshPolyhedraVertexAttribute(
+  async function setMeshPolyhedraVertexAttribute(
     id: string,
     {
       name,
@@ -128,18 +156,18 @@ function useMeshPolyhedraVertexAttributeStyle() {
       colorMap,
       no_data_color = DEFAULT_NO_DATA_COLOR,
     }: AttributeInput,
-  ) {
-    mutateMeshPolyhedraVertexStyle(id, {
+  ): Promise<unknown> {
+    await mutateMeshPolyhedraVertexStyle(id, {
       name,
       item,
     });
-    setMeshPolyhedraVertexAttributeStoredConfig(id, name, item, {
+    await setMeshPolyhedraVertexAttributeStoredConfig(id, name, item, {
       minimum,
       maximum,
       colorMap,
       no_data_color,
     });
-    const points = getRGBPointsFromPreset(colorMap as string);
+    const points = getRGBPointsFromPreset(colorMap ?? "");
     const schema = meshPolyhedraVertexAttributeSchemas.attribute;
     const params = {
       id,
@@ -155,7 +183,7 @@ function useMeshPolyhedraVertexAttributeStyle() {
       params,
     });
   }
-  function applyVertexAttribute(id: string) {
+  async function applyVertexAttribute(id: string): Promise<unknown> {
     const name = meshPolyhedraVertexAttributeName(id);
     const item = meshPolyhedraVertexAttributeItem(id);
     const storedConfig = meshPolyhedraVertexAttributeStoredConfig(id, name, item);
@@ -168,19 +196,21 @@ function useMeshPolyhedraVertexAttributeStyle() {
       no_data_color: storedConfig.no_data_color,
     };
     if (isMeshPolyhedraVertexAttributeValid(attribute)) {
-      return setMeshPolyhedraVertexAttribute(id, attribute);
+      const result = await setMeshPolyhedraVertexAttribute(id, attribute);
+      return result;
     }
+    return undefined;
   }
-  function setMeshPolyhedraVertexAttributeName(id: string, name: string) {
+  async function setMeshPolyhedraVertexAttributeName(id: string, name: string): Promise<unknown> {
     const item = meshPolyhedraVertexAttributeLastItem(id, name);
-    mutateMeshPolyhedraVertexStyle(id, {
+    await mutateMeshPolyhedraVertexStyle(id, {
       name,
       item,
     });
     return applyVertexAttribute(id);
   }
-  function setMeshPolyhedraVertexAttributeItem(id: string, item: number) {
-    mutateMeshPolyhedraVertexStyle(id, {
+  async function setMeshPolyhedraVertexAttributeItem(id: string, item: number): Promise<unknown> {
+    await mutateMeshPolyhedraVertexStyle(id, {
       item,
     });
     return applyVertexAttribute(id);
@@ -191,10 +221,14 @@ function useMeshPolyhedraVertexAttributeStyle() {
     const storedConfig = meshPolyhedraVertexAttributeStoredConfig(id, name, item);
     return [storedConfig.minimum, storedConfig.maximum];
   }
-  function setMeshPolyhedraVertexAttributeRange(id: string, minimum: number, maximum: number) {
+  async function setMeshPolyhedraVertexAttributeRange(
+    id: string,
+    minimum: number,
+    maximum: number,
+  ): Promise<unknown> {
     const name = meshPolyhedraVertexAttributeName(id);
     const item = meshPolyhedraVertexAttributeItem(id);
-    setMeshPolyhedraVertexAttributeStoredConfig(id, name, item, {
+    await setMeshPolyhedraVertexAttributeStoredConfig(id, name, item, {
       minimum,
       maximum,
     });
@@ -206,10 +240,13 @@ function useMeshPolyhedraVertexAttributeStyle() {
     const storedConfig = meshPolyhedraVertexAttributeStoredConfig(id, name, item);
     return storedConfig.colorMap;
   }
-  function setMeshPolyhedraVertexAttributeColorMap(id: string, colorMap: string | undefined) {
+  async function setMeshPolyhedraVertexAttributeColorMap(
+    id: string,
+    colorMap: string | undefined,
+  ): Promise<unknown> {
     const name = meshPolyhedraVertexAttributeName(id);
     const item = meshPolyhedraVertexAttributeItem(id);
-    setMeshPolyhedraVertexAttributeStoredConfig(id, name, item, {
+    await setMeshPolyhedraVertexAttributeStoredConfig(id, name, item, {
       colorMap,
     });
     return applyVertexAttribute(id);
@@ -220,7 +257,10 @@ function useMeshPolyhedraVertexAttributeStyle() {
     const storedConfig = meshPolyhedraVertexAttributeStoredConfig(id, name, item);
     return storedConfig.no_data_color;
   }
-  async function setMeshPolyhedraVertexAttributeNoDataColor(id: string, no_data_color: unknown) {
+  async function setMeshPolyhedraVertexAttributeNoDataColor(
+    id: string,
+    no_data_color: unknown,
+  ): Promise<unknown> {
     const name = meshPolyhedraVertexAttributeName(id);
     const item = meshPolyhedraVertexAttributeItem(id);
     const storedConfig = meshPolyhedraVertexAttributeStoredConfig(id, name, item);