@geode/opengeodeweb-front 10.40.1-rc.1 → 10.41.0-rc.2

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

@@ -0,0 +1,141 @@
+<script setup lang="ts">
+import {
+  type ModelMenuItemProps,
+  useModelMenuContext,
+} from "@ogw_front/composables/model_menu_context";
+import OptionsSection from "@ogw_front/components/Viewer/Options/OptionsSection.vue";
+import ViewerGenericModelComponentPointsOptions from "@ogw_front/components/Viewer/Generic/Model/ComponentPointsOptions.vue";
+import VisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
+import { useBatchStyle } from "@ogw_front/composables/batch_style";
+import { useDataStore } from "@ogw_front/stores/data";
+import { useDataStyleStore } from "@ogw_front/stores/data_style";
+import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
+
+// Corners have no points options: their points are the corners themselves
+const POINTS_TYPE_TITLES = {
+  Surface: "Surfaces Points Options",
+  Line: "Lines Points Options",
+  Block: "Blocks Points Options",
+} as const;
+type PointsComponentType = keyof typeof POINTS_TYPE_TITLES;
+const POINTS_COMPONENT_TYPES: PointsComponentType[] = ["Surface", "Line", "Block"];
+
+function isPointsComponentType(type: string | undefined): type is PointsComponentType {
+  return type !== undefined && type in POINTS_TYPE_TITLES;
+}
+
+interface Props {
+  itemProps: ModelMenuItemProps;
+}
+
+const { itemProps } = defineProps<Props>();
+
+const dataStore = useDataStore();
+const dataStyleStore = useDataStyleStore();
+const hybridViewerStore = useHybridViewerStore();
+const { applyBatchStyle } = useBatchStyle();
+
+const { modelId, componentId, componentType, collections, targetComponentIds } =
+  useModelMenuContext(() => itemProps);
+
+const modelPointsVisibility = computed<boolean>({
+  get: () => dataStyleStore.modelPointsVisibility(modelId.value),
+  set: async (newValue) => {
+    await applyBatchStyle(modelId.value, (targetId: string) =>
+      dataStyleStore.setModelPointsVisibility(targetId, newValue),
+    );
+    hybridViewerStore.remoteRender();
+  },
+});
+
+const pointsComponentType = computed<PointsComponentType | undefined>(() =>
+  isPointsComponentType(componentType.value) ? componentType.value : undefined,
+);
+
+const allComponentsTargets = ref<{ componentType: PointsComponentType; componentIds: string[] }[]>(
+  [],
+);
+watch(
+  modelId,
+  async (currentModelId) => {
+    const targets = await Promise.all(
+      POINTS_COMPONENT_TYPES.map(async (type) => ({
+        componentType: type,
+        componentIds: await dataStore.getMeshComponentGeodeIds(currentModelId, type),
+      })),
+    );
+    if (modelId.value === currentModelId) {
+      allComponentsTargets.value = targets.filter((target) => target.componentIds.length > 0);
+    }
+  },
+  { immediate: true },
+);
+
+const typeTargets = computed(() =>
+  pointsComponentType.value === undefined
+    ? []
+    : [{ componentType: pointsComponentType.value, componentIds: targetComponentIds.value }],
+);
+const typeReferenceId = computed<string | undefined>(() =>
+  collections.value ? targetComponentIds.value[0] : undefined,
+);
+
+const componentTargets = computed(() =>
+  pointsComponentType.value === undefined || componentId.value === undefined
+    ? []
+    : [{ componentType: pointsComponentType.value, componentIds: [componentId.value] }],
+);
+</script>
+
+<template>
+  <v-sheet class="model-points-card" color="transparent">
+    <OptionsSection title="Model Points Options">
+      <VisibilitySwitch data-testid="modelPointsVisibilitySwitch" v-model="modelPointsVisibility" />
+    </OptionsSection>
+
+    <OptionsSection
+      v-if="!componentType && !componentId && allComponentsTargets.length > 0"
+      title="Components Points Options"
+      data-testid="modelPointsComponentsOptions"
+      class="mt-4"
+    >
+      <ViewerGenericModelComponentPointsOptions
+        :modelId="modelId"
+        :targets="allComponentsTargets"
+      />
+    </OptionsSection>
+
+    <OptionsSection
+      v-if="pointsComponentType"
+      :title="POINTS_TYPE_TITLES[pointsComponentType]"
+      data-testid="modelPointsComponentTypeOptions"
+      class="mt-4"
+    >
+      <ViewerGenericModelComponentPointsOptions
+        :modelId="modelId"
+        :targets="typeTargets"
+        :referenceComponentId="typeReferenceId"
+      />
+    </OptionsSection>
+
+    <OptionsSection
+      v-if="pointsComponentType && componentId"
+      title="Component Points Options"
+      data-testid="modelPointsComponentOptions"
+      class="mt-4"
+    >
+      <ViewerGenericModelComponentPointsOptions
+        :modelId="modelId"
+        :targets="componentTargets"
+        :referenceComponentId="componentId"
+      />
+    </OptionsSection>
+  </v-sheet>
+</template>
+
+<style scoped>
+.model-points-card {
+  padding-top: 12px;
+  overflow-x: hidden;
+}
+</style>

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

@@ -1,95 +1,35 @@
 <script setup lang="ts">
+import {
+  type ModelMenuItemProps,
+  useModelMenuContext,
+} from "@ogw_front/composables/model_menu_context";
 import BlocksOptions from "./BlocksOptions.vue";
-import type { CollectionComponent } from "@ogw_front/stores/data_helpers/collections";
 import CornersOptions from "./CornersOptions.vue";
 import LinesOptions from "./LinesOptions.vue";
-import { MESH_COMPONENT_TYPES } from "@ogw_front/utils/default_styles";
 import OptionsSection from "@ogw_front/components/Viewer/Options/OptionsSection.vue";
 import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import SurfacesOptions from "./SurfacesOptions.vue";
 import ViewerOptionsColoringTypeSelector from "@ogw_front/components/Viewer/Options/ColoringTypeSelector.vue";
 import VisibilitySwitch from "@ogw_front/components/Viewer/Options/VisibilitySwitch.vue";
 import { useBatchStyle } from "@ogw_front/composables/batch_style";
-import { useDataStore } from "@ogw_front/stores/data";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 
 const dataStyleStore = useDataStyleStore();
 const hybridViewerStore = useHybridViewerStore();
-const dataStore = useDataStore();
 const { applyBatchStyle } = useBatchStyle();
 
 interface Props {
-  itemProps: Record<string, unknown>;
+  itemProps: ModelMenuItemProps;
 }
 
 const { itemProps } = defineProps<Props>();
 
-const modelId = computed<string>(() => itemProps.meta_data.modelId || itemProps.id);
-const componentId = computed<string | undefined>(() => itemProps.meta_data.pickedComponentId);
+const { modelId, componentId, componentType, collections, targetComponentIds } =
+  useModelMenuContext(() => itemProps);
 function visibleComponents(targetId: string): string[] {
   return dataStyleStore.visibleMeshComponents(targetId).value || [];
 }
-const componentType = ref<string | undefined>(undefined);
-const collections = ref<CollectionComponent[] | undefined>(undefined);
-
-watch(
-  () => [
-    modelId.value,
-    componentId.value,
-    itemProps.meta_data.viewer_type,
-    itemProps.meta_data.modelComponentType,
-  ],
-  async () => {
-    componentType.value = undefined;
-    collections.value = undefined;
-    if (itemProps.meta_data.viewer_type === "model_component_type") {
-      const { modelComponentType, targetComponentIds: ids } = itemProps.meta_data;
-      if (MESH_COMPONENT_TYPES.includes(modelComponentType)) {
-        componentType.value = modelComponentType;
-      } else {
-        const collectionsByType = await dataStore.fetchAllCollectionComponents(modelId.value);
-        collections.value = collectionsByType[modelComponentType].filter((collection) =>
-          collection.children.every((child) => ids.includes(child.id)),
-        );
-        componentType.value = collections.value[0].children[0].category;
-      }
-    } else if (componentId.value && modelId.value) {
-      const currentModelId = modelId.value;
-      const currentCompId = componentId.value;
-      const type = await dataStore.meshComponentType(currentModelId, currentCompId);
-      if (
-        modelId.value === currentModelId &&
-        componentId.value === currentCompId &&
-        itemProps.meta_data.viewer_type !== "model_component_type"
-      ) {
-        componentType.value = type;
-      }
-    }
-  },
-  { immediate: true },
-);
-
-const targetComponentIds = ref<string[]>([]);
-watch(
-  () => [modelId.value, componentType.value, itemProps.meta_data.targetComponentIds],
-  async () => {
-    targetComponentIds.value = [];
-    if (itemProps.meta_data.targetComponentIds) {
-      targetComponentIds.value = itemProps.meta_data.targetComponentIds;
-      return;
-    }
-    if (componentType.value && modelId.value) {
-      const currentModelId = modelId.value;
-      const currentType = componentType.value;
-      const ids = await dataStore.getMeshComponentGeodeIds(currentModelId, currentType);
-      if (modelId.value === currentModelId && componentType.value === currentType) {
-        targetComponentIds.value = ids;
-      }
-    }
-  },
-  { immediate: true },
-);
 
 const modelVisibility = computed<boolean | undefined>({
   get: () => dataStyleStore.modelVisibility(modelId.value),

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

@@ -2,45 +2,14 @@
 import ViewerContextMenuItem, {
   type ItemProps,
 } from "@ogw_front/components/Viewer/ContextMenu/ContextMenuItem.vue";
+import ModelPointsCard from "./ModelPointsCard.vue";
 import SurfacePoints from "@ogw_front/assets/viewer_svgs/surface_points.svg";
-import ViewerOptionsSizeSlider from "@ogw_front/components/Viewer/Options/Sliders/Size.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";
-import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
-
-const dataStyleStore = useDataStyleStore();
-const hybridViewerStore = useHybridViewerStore();
-const { applyBatchStyle } = useBatchStyle();
 
 interface Props {
   itemProps: ItemProps & { index: number };
 }
 
 const { itemProps } = defineProps<Props>();
-
-const id = computed<string>(
-  () => (itemProps.meta_data.modelId as string | undefined) || itemProps.id,
-);
-
-const visibility = computed<boolean>({
-  get: () => dataStyleStore.modelPointsVisibility(id.value),
-  set: async (newValue) => {
-    await applyBatchStyle(id.value, (targetId: string) =>
-      dataStyleStore.setModelPointsVisibility(targetId, newValue),
-    );
-    hybridViewerStore.remoteRender();
-  },
-});
-const size = computed<number>({
-  get: () => dataStyleStore.modelPointsSize(id.value),
-  set: async (newValue) => {
-    await applyBatchStyle(id.value, (targetId: string) =>
-      dataStyleStore.setModelPointsSize(targetId, newValue),
-    );
-    hybridViewerStore.remoteRender();
-  },
-});
 </script>
 
 <template>
@@ -52,14 +21,7 @@ const size = computed<number>({
     :btnImage="SurfacePoints"
   >
     <template #options>
-      <ViewerOptionsVisibilitySwitch
-        data-testid="modelPointsVisibilitySwitch"
-        v-model="visibility"
-      />
-      <template v-if="visibility">
-        <v-divider class="my-2" />
-        <ViewerOptionsSizeSlider data-testid="modelPointsSizeSlider" v-model="size" />
-      </template>
+      <ModelPointsCard :itemProps="itemProps" />
     </template>
   </ViewerContextMenuItem>
 </template>

package/app/components/csv-preview/CsvSettings.vue

@@ -26,7 +26,7 @@ const emit = defineEmits<Emits>();
 const separators = [
   { title: "Comma (,)", value: "," },
   { title: "Semicolon (;)", value: ";" },
-  { title: "Tab (\\t)", value: "\t" },
+  { title: String.raw`Tab (\t)`, value: "\t" },
   { title: "Space ( )", value: " " },
   { title: "Pipe (|)", value: "|" },
   { title: "Custom", value: "custom" },

package/app/composables/model_menu_context.ts

@@ -0,0 +1,101 @@
+import { type ComputedRef, type Ref, computed, ref, watch } from "vue";
+import type { CollectionComponent } from "@ogw_front/stores/data_helpers/collections";
+import { MESH_COMPONENT_TYPES } from "@ogw_front/utils/default_styles";
+import { useDataStore } from "@ogw_front/stores/data";
+
+interface ModelMenuMetaData {
+  modelId?: string;
+  pickedComponentId?: string;
+  viewer_type?: string;
+  modelComponentType?: string;
+  targetComponentIds?: string[];
+}
+
+interface ModelMenuItemProps {
+  id: string;
+  meta_data: Record<string, unknown>;
+}
+
+interface ModelMenuContext {
+  modelId: ComputedRef<string>;
+  componentId: ComputedRef<string | undefined>;
+  componentType: Ref<string | undefined>;
+  collections: Ref<CollectionComponent[] | undefined>;
+  targetComponentIds: Ref<string[]>;
+}
+
+// Resolves what a model context menu targets: the whole model, a component type, a collection or one component
+// oxlint-disable-next-line max-lines-per-function
+function useModelMenuContext(getItemProps: () => ModelMenuItemProps): ModelMenuContext {
+  const dataStore = useDataStore();
+  // oxlint-disable-next-line no-unsafe-type-assertion -- meta_data is filled by the viewer context menu with these keys.
+  const metaData = computed(() => getItemProps().meta_data as ModelMenuMetaData);
+
+  const modelId = computed<string>(() => metaData.value.modelId ?? getItemProps().id);
+  const componentId = computed<string | undefined>(() => metaData.value.pickedComponentId);
+  const componentType = ref<string | undefined>(undefined);
+  const collections = ref<CollectionComponent[] | undefined>(undefined);
+
+  watch(
+    () => [
+      modelId.value,
+      componentId.value,
+      metaData.value.viewer_type,
+      metaData.value.modelComponentType,
+    ],
+    async () => {
+      componentType.value = undefined;
+      collections.value = undefined;
+      if (metaData.value.viewer_type === "model_component_type") {
+        const { modelComponentType = "", targetComponentIds: ids = [] } = metaData.value;
+        if (MESH_COMPONENT_TYPES.includes(modelComponentType)) {
+          componentType.value = modelComponentType;
+        } else {
+          const collectionsByType = await dataStore.fetchAllCollectionComponents(modelId.value);
+          collections.value = (collectionsByType[modelComponentType] ?? []).filter((collection) =>
+            collection.children.every((child) => ids.includes(child.id)),
+          );
+          componentType.value = collections.value[0]?.children[0]?.category;
+        }
+      } else if (componentId.value !== undefined && modelId.value !== "") {
+        const currentModelId = modelId.value;
+        const currentCompId = componentId.value;
+        const type = await dataStore.meshComponentType(currentModelId, currentCompId);
+        if (
+          modelId.value === currentModelId &&
+          componentId.value === currentCompId &&
+          metaData.value.viewer_type !== "model_component_type"
+        ) {
+          componentType.value = type;
+        }
+      }
+    },
+    { immediate: true },
+  );
+
+  const targetComponentIds = ref<string[]>([]);
+  watch(
+    () => [modelId.value, componentType.value, metaData.value.targetComponentIds],
+    async () => {
+      targetComponentIds.value = [];
+      if (metaData.value.targetComponentIds !== undefined) {
+        targetComponentIds.value = metaData.value.targetComponentIds;
+        return;
+      }
+      if (componentType.value !== undefined && modelId.value !== "") {
+        const currentModelId = modelId.value;
+        const currentType = componentType.value;
+        const ids = await dataStore.getMeshComponentGeodeIds(currentModelId, currentType);
+        if (modelId.value === currentModelId && componentType.value === currentType) {
+          targetComponentIds.value = ids;
+        }
+      }
+    },
+    { immediate: true },
+  );
+
+  return { modelId, componentId, componentType, collections, targetComponentIds };
+}
+
+export { useModelMenuContext };
+export type { ModelMenuItemProps };

package/app/utils/import_workflow.ts

@@ -96,18 +96,26 @@ async function importWorkflow(files: readonly FileToImport[]): Promise<string[]>
   }
 
   const results: string[] = [];
+  const errors: unknown[] = [];
   async function processChunk(chunkIndex: number): Promise<void> {
     if (chunkIndex >= chunks.length) {
       return;
     }
     const chunk = chunks[chunkIndex] ?? [];
-    const chunk_results = await Promise.all(
+    // A failing file does not prevent the other files from being imported
+    const chunk_results = await Promise.allSettled(
       chunk.map(async ({ filename, geode_object_type }) => {
         const id = await importFile(filename, geode_object_type);
         return id;
       }),
     );
-    results.push(...chunk_results);
+    for (const result of chunk_results) {
+      if (result.status === "fulfilled") {
+        results.push(result.value);
+      } else {
+        errors.push(result.reason);
+      }
+    }
     await processChunk(chunkIndex + 1);
   }
   await processChunk(0);
@@ -116,6 +124,9 @@ async function importWorkflow(files: readonly FileToImport[]): Promise<string[]>
     hybridViewerStore.resetCamera();
   }
   await hybridViewerStore.remoteRender();
+  if (errors.length > 0) {
+    throw new AggregateError(errors, `${errors.length} file(s) could not be imported`);
+  }
   return results;
 }
 

package/internal/stores/data_style/model/blocks/index.ts

@@ -7,6 +7,7 @@ import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useModelBlocksColor } from "./color";
 import { useModelBlocksCommonStyle } from "./common";
+import { useModelBlocksPointsStyle } from "./points";
 import { useModelBlocksVisibility } from "./visibility";
 
 interface ColorGroup {
@@ -34,6 +35,7 @@ type UseModelBlocksStyleReturn = {
 } & ReturnType<typeof useModelBlocksCommonStyle> &
   ReturnType<typeof useModelBlocksVisibility> &
   ReturnType<typeof useModelBlocksColor> &
+  ReturnType<typeof useModelBlocksPointsStyle> &
   ReturnType<typeof useModelBlocksVertexAttribute> &
   ReturnType<typeof useModelBlocksPolyhedronAttribute>;
 
@@ -45,6 +47,7 @@ export function useModelBlocksStyle(): UseModelBlocksStyleReturn {
   const modelColorStyle = useModelBlocksColor();
   const modelBlocksVertexAttribute = useModelBlocksVertexAttribute();
   const modelBlocksPolyhedronAttribute = useModelBlocksPolyhedronAttribute();
+  const modelBlocksPointsStyle = useModelBlocksPointsStyle();
 
   async function applyModelBlocksVisibilityStyle(
     modelId: string,
@@ -245,5 +248,6 @@ export function useModelBlocksStyle(): UseModelBlocksStyleReturn {
     ...modelColorStyle,
     ...modelBlocksVertexAttribute,
     ...modelBlocksPolyhedronAttribute,
+    ...modelBlocksPointsStyle,
   };
 }

package/internal/stores/data_style/model/blocks/points.ts

@@ -0,0 +1,51 @@
+import {
+  type ModelComponentPointsStyle,
+  useModelComponentPointsStyle,
+} from "@ogw_internal/stores/data_style/model/points/component";
+
+interface UseModelBlocksPointsStyleReturn {
+  modelBlockPointsVisibility: ModelComponentPointsStyle["visibility"];
+  modelBlockPointsSize: ModelComponentPointsStyle["size"];
+  modelBlockPointsColor: ModelComponentPointsStyle["color"];
+  modelBlockPointsActiveColoring: ModelComponentPointsStyle["activeColoring"];
+  modelBlockPointsVertexAttributeName: ModelComponentPointsStyle["vertexAttributeName"];
+  modelBlockPointsVertexAttributeItem: ModelComponentPointsStyle["vertexAttributeItem"];
+  modelBlockPointsVertexAttributeRange: ModelComponentPointsStyle["vertexAttributeRange"];
+  modelBlockPointsVertexAttributeColorMap: ModelComponentPointsStyle["vertexAttributeColorMap"];
+  modelBlockPointsVertexAttributeNoDataColor: ModelComponentPointsStyle["vertexAttributeNoDataColor"];
+  setModelBlocksPointsVisibility: ModelComponentPointsStyle["setVisibility"];
+  setModelBlocksPointsSize: ModelComponentPointsStyle["setSize"];
+  setModelBlocksPointsColor: ModelComponentPointsStyle["setColor"];
+  setModelBlocksPointsActiveColoring: ModelComponentPointsStyle["setActiveColoring"];
+  setModelBlocksPointsVertexAttributeName: ModelComponentPointsStyle["setVertexAttributeName"];
+  setModelBlocksPointsVertexAttributeItem: ModelComponentPointsStyle["setVertexAttributeItem"];
+  setModelBlocksPointsVertexAttributeRange: ModelComponentPointsStyle["setVertexAttributeRange"];
+  setModelBlocksPointsVertexAttributeColorMap: ModelComponentPointsStyle["setVertexAttributeColorMap"];
+  setModelBlocksPointsVertexAttributeNoDataColor: ModelComponentPointsStyle["setVertexAttributeNoDataColor"];
+  applyModelBlocksPointsStyle: ModelComponentPointsStyle["applyPointsStyle"];
+}
+
+export function useModelBlocksPointsStyle(): UseModelBlocksPointsStyleReturn {
+  const points = useModelComponentPointsStyle("Block");
+  return {
+    modelBlockPointsVisibility: points.visibility,
+    modelBlockPointsSize: points.size,
+    modelBlockPointsColor: points.color,
+    modelBlockPointsActiveColoring: points.activeColoring,
+    modelBlockPointsVertexAttributeName: points.vertexAttributeName,
+    modelBlockPointsVertexAttributeItem: points.vertexAttributeItem,
+    modelBlockPointsVertexAttributeRange: points.vertexAttributeRange,
+    modelBlockPointsVertexAttributeColorMap: points.vertexAttributeColorMap,
+    modelBlockPointsVertexAttributeNoDataColor: points.vertexAttributeNoDataColor,
+    setModelBlocksPointsVisibility: points.setVisibility,
+    setModelBlocksPointsSize: points.setSize,
+    setModelBlocksPointsColor: points.setColor,
+    setModelBlocksPointsActiveColoring: points.setActiveColoring,
+    setModelBlocksPointsVertexAttributeName: points.setVertexAttributeName,
+    setModelBlocksPointsVertexAttributeItem: points.setVertexAttributeItem,
+    setModelBlocksPointsVertexAttributeRange: points.setVertexAttributeRange,
+    setModelBlocksPointsVertexAttributeColorMap: points.setVertexAttributeColorMap,
+    setModelBlocksPointsVertexAttributeNoDataColor: points.setVertexAttributeNoDataColor,
+    applyModelBlocksPointsStyle: points.applyPointsStyle,
+  };
+}

package/internal/stores/data_style/model/index.ts

@@ -61,6 +61,12 @@ function useModelStyle(): UseModelStyleReturn {
       modelPointsStyle.applyModelPointsStyle(modelId),
       modelEdgesStyle.applyModelEdgesStyle(modelId),
     ]);
+    // Components points come after the model points, which override every component
+    await Promise.all([
+      modelSurfacesStyle.applyModelSurfacesPointsStyle(modelId),
+      modelLinesStyle.applyModelLinesPointsStyle(modelId),
+      modelBlocksStyle.applyModelBlocksPointsStyle(modelId),
+    ]);
     return results;
   }
 

package/internal/stores/data_style/model/lines/index.ts

@@ -4,6 +4,7 @@ import type { RGBAColor } from "@ogw_front/utils/default_styles/constants";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useModelLinesColor } from "./color";
 import { useModelLinesCommonStyle } from "./common";
+import { useModelLinesPointsStyle } from "./points";
 import { useModelLinesVisibility } from "./visibility";
 
 interface ColorGroup {
@@ -29,6 +30,7 @@ async function setModelLinesDefaultStyle(_id: string): Promise<void> {
 export function useModelLinesStyle(): ReturnType<typeof useModelLinesCommonStyle> &
   ReturnType<typeof useModelLinesVisibility> &
   ReturnType<typeof useModelLinesColor> &
+  ReturnType<typeof useModelLinesPointsStyle> &
   ReturnType<typeof useModelLinesVertexAttribute> &
   ReturnType<typeof useModelLinesEdgeAttribute> & {
     applyModelLinesStyle: (modelId: string) => Promise<void>;
@@ -40,6 +42,7 @@ export function useModelLinesStyle(): ReturnType<typeof useModelLinesCommonStyle
   const modelColorStyle = useModelLinesColor();
   const modelLinesVertexAttribute = useModelLinesVertexAttribute();
   const modelLinesEdgeAttribute = useModelLinesEdgeAttribute();
+  const modelLinesPointsStyle = useModelLinesPointsStyle();
 
   async function applyModelLinesVisibilityStyle(
     modelId: string,
@@ -232,5 +235,6 @@ export function useModelLinesStyle(): ReturnType<typeof useModelLinesCommonStyle
     ...modelColorStyle,
     ...modelLinesVertexAttribute,
     ...modelLinesEdgeAttribute,
+    ...modelLinesPointsStyle,
   };
 }

package/internal/stores/data_style/model/lines/points.ts

@@ -0,0 +1,51 @@
+import {
+  type ModelComponentPointsStyle,
+  useModelComponentPointsStyle,
+} from "@ogw_internal/stores/data_style/model/points/component";
+
+interface UseModelLinesPointsStyleReturn {
+  modelLinePointsVisibility: ModelComponentPointsStyle["visibility"];
+  modelLinePointsSize: ModelComponentPointsStyle["size"];
+  modelLinePointsColor: ModelComponentPointsStyle["color"];
+  modelLinePointsActiveColoring: ModelComponentPointsStyle["activeColoring"];
+  modelLinePointsVertexAttributeName: ModelComponentPointsStyle["vertexAttributeName"];
+  modelLinePointsVertexAttributeItem: ModelComponentPointsStyle["vertexAttributeItem"];
+  modelLinePointsVertexAttributeRange: ModelComponentPointsStyle["vertexAttributeRange"];
+  modelLinePointsVertexAttributeColorMap: ModelComponentPointsStyle["vertexAttributeColorMap"];
+  modelLinePointsVertexAttributeNoDataColor: ModelComponentPointsStyle["vertexAttributeNoDataColor"];
+  setModelLinesPointsVisibility: ModelComponentPointsStyle["setVisibility"];
+  setModelLinesPointsSize: ModelComponentPointsStyle["setSize"];
+  setModelLinesPointsColor: ModelComponentPointsStyle["setColor"];
+  setModelLinesPointsActiveColoring: ModelComponentPointsStyle["setActiveColoring"];
+  setModelLinesPointsVertexAttributeName: ModelComponentPointsStyle["setVertexAttributeName"];
+  setModelLinesPointsVertexAttributeItem: ModelComponentPointsStyle["setVertexAttributeItem"];
+  setModelLinesPointsVertexAttributeRange: ModelComponentPointsStyle["setVertexAttributeRange"];
+  setModelLinesPointsVertexAttributeColorMap: ModelComponentPointsStyle["setVertexAttributeColorMap"];
+  setModelLinesPointsVertexAttributeNoDataColor: ModelComponentPointsStyle["setVertexAttributeNoDataColor"];
+  applyModelLinesPointsStyle: ModelComponentPointsStyle["applyPointsStyle"];
+}
+
+export function useModelLinesPointsStyle(): UseModelLinesPointsStyleReturn {
+  const points = useModelComponentPointsStyle("Line");
+  return {
+    modelLinePointsVisibility: points.visibility,
+    modelLinePointsSize: points.size,
+    modelLinePointsColor: points.color,
+    modelLinePointsActiveColoring: points.activeColoring,
+    modelLinePointsVertexAttributeName: points.vertexAttributeName,
+    modelLinePointsVertexAttributeItem: points.vertexAttributeItem,
+    modelLinePointsVertexAttributeRange: points.vertexAttributeRange,
+    modelLinePointsVertexAttributeColorMap: points.vertexAttributeColorMap,
+    modelLinePointsVertexAttributeNoDataColor: points.vertexAttributeNoDataColor,
+    setModelLinesPointsVisibility: points.setVisibility,
+    setModelLinesPointsSize: points.setSize,
+    setModelLinesPointsColor: points.setColor,
+    setModelLinesPointsActiveColoring: points.setActiveColoring,
+    setModelLinesPointsVertexAttributeName: points.setVertexAttributeName,
+    setModelLinesPointsVertexAttributeItem: points.setVertexAttributeItem,
+    setModelLinesPointsVertexAttributeRange: points.setVertexAttributeRange,
+    setModelLinesPointsVertexAttributeColorMap: points.setVertexAttributeColorMap,
+    setModelLinesPointsVertexAttributeNoDataColor: points.setVertexAttributeNoDataColor,
+    applyModelLinesPointsStyle: points.applyPointsStyle,
+  };
+}