@geode/opengeodeweb-front 10.4.0 → 10.4.1-rc.2

package/.oxlintrc.json

@@ -7,7 +7,7 @@
     "style": "error",
     "restriction": "error"
   },
-  "plugins": ["import", "node", "oxc", "promise", "unicorn", "vitest"],
+  "plugins": ["import", "node", "oxc", "promise", "unicorn", "vitest", "vue"],
   "rules": {
     "unicorn/filename-case": [
       "error",
@@ -15,26 +15,91 @@
         "case": "snakeCase"
       }
     ],
-    "eslint/func-style": [
+    "eslint/func-style": ["error", "declaration"],
+    "eslint/sort-keys": "off",
+    "eslint/no-ternary": "off", // A utiliser pour des opérations simples
+    "oxc/no-async-await": "off",
+    "oxc/no-rest-spread-properties": "off", // Enable if older browser support is needed
+    "eslint/max-statements": ["warn", 20],
+    "eslint/id-length": [
       "error",
       {
-        "style:": "declaration"
+        "exceptions": [
+          "x",
+          "y",
+          "z",
+          "i",
+          "j",
+          "k",
+          "r",
+          "g",
+          "b",
+          "id",
+          "ID",
+          "fs",
+          "os"
+        ],
+        "min": 3
       }
     ],
-    "eslint/sort-keys": "off",
-    "eslint/no-ternary": "off"
+    "eslint/no-console": "warn", // Disable for debugging. Disable later to not have browser logs
+    "sort-imports": ["error", { "allowSeparatedGroups": true }],
+    "eslint/no-undefined": "off", // Conflict with unicorn/no-typeof-undefined which prefers direct undefined comparison
+    "import/prefer-default-export": "off",
+    "import/no-named-export": "off",
+    "import/no-namespace": ["error", { "ignore": ["vuetify/*"] }],
+    "vue/max-props": ["error", { "maxProps": 8 }],
+    "oxc/no-optional-chaining": "off",
+    "node/no-process-env": "off",
+    "no-continue": "off",
+    "import/unambiguous": "off",
+    "max-params": ["warn", { "max": 4 }],
+    "import/no-nodejs-modules": "off",
+    "eslint/no-magic-numbers": [
+      "error",
+      {
+        "ignore": [-1, 0, 1, 2, 3, 4],
+        "ignoreArrayIndexes": true
+      }
+    ]
   },
   "overrides": [
     {
-      "files": ["**/components/*"],
+      "files": ["**/components/**"],
       "rules": {
         "unicorn/filename-case": [
           "error",
           {
-            "case": "PascalCase"
+            "case": "pascalCase"
           }
         ]
       }
+    },
+    {
+      "files": [
+        "app/plugins/**",
+        "node_scripts/**",
+        "server/**",
+        "*.config.js"
+      ],
+      "rules": {
+        "import/no-default-export": "off"
+      }
+    },
+    {
+      "files": ["tests/**"],
+      "rules": {
+        "vitest/require-hook": "off",
+        "vitest/no-hooks": "off",
+        "vitest/no-importing-vitest-globals": "off",
+        "import/no-relative-parent-imports": "warn"
+      }
+    },
+    {
+      "files": ["**/preload.js"],
+      "rules": {
+        "import/no-commonjs": "off"
+      }
     }
   ]
 }

package/app/components/Viewer/BreadCrumb.vue

@@ -13,7 +13,7 @@
 
   const model_id = computed(() => treeviewStore.model_id)
 
-  const metaDatas = computed(() => dataStore.getItem(model_id.value).value)
+  const metaDatas = dataStore.refItem(model_id.value)
 </script>
 
 <template>

package/app/components/Viewer/ContextMenu.vue

@@ -1,5 +1,4 @@
 <script setup>
-  import { useDataStore } from "@ogw_front/stores/data"
   import { useEventListener } from "@vueuse/core"
   import { useMenuStore } from "@ogw_front/stores/menu"
 
@@ -16,7 +15,6 @@
   const CLOSE_DELAY = 100
 
   const menuStore = useMenuStore()
-  const dataStore = useDataStore()
 
   const { id, x, y, containerWidth, containerHeight } = defineProps({
     id: { type: String, required: true },
@@ -26,13 +24,7 @@
     containerHeight: { type: Number, required: true },
   })
 
-  const meta_data = computed(() => {
-    const itemId = id || menuStore.current_id
-    if (!itemId) {
-      return {}
-    }
-    return dataStore.getItem(itemId).value || {}
-  })
+  const meta_data = computed(() => menuStore.current_meta_data || {})
 
   const show_menu = ref(true)
   const isDragging = ref(false)

package/app/stores/data.js

@@ -15,17 +15,18 @@ const viewer_generic_schemas = viewer_schemas.opengeodeweb_viewer.generic
 export const useDataStore = defineStore("data", () => {
   const viewerStore = useViewerStore()
 
-  function getItem(id) {
-    if (!id) {
-      return ref({})
-    }
+  function item(id) {
+    return database.data.get(id)
+  }
+
+  function refItem(id) {
     return useObservable(
       liveQuery(() => database.data.get(id)),
       { initialValue: {} },
     )
   }
 
-  function getAllItems() {
+  function refAllItems() {
     return useObservable(
       liveQuery(() => database.data.toArray()),
       { initialValue: [] },
@@ -181,8 +182,9 @@ export const useDataStore = defineStore("data", () => {
   }
 
   return {
-    getAllItems,
-    getItem,
+    refAllItems,
+    item,
+    refItem,
     meshComponentType,
     formatedMeshComponents,
     registerObject,

package/app/stores/data_style.js

@@ -61,11 +61,11 @@ export const useDataStyleStore = defineStore("dataStyle", () => {
     }
   }
 
-  function applyAllStylesFromState() {
+  async function applyAllStylesFromState() {
     const ids = Object.keys(dataStyleState.styles || {})
     const promises = []
     for (const id of ids) {
-      const meta = dataStore.getItem(id).value
+      const meta = await dataStore.item(id)
       const viewerType = meta?.viewer_type
       const style = dataStyleState.styles[id]
       if (style && viewerType === "mesh") {

package/app/stores/menu.js

@@ -132,6 +132,7 @@ export const useMenuStore = defineStore("menu", () => {
   const containerTop = ref(0)
   const containerLeft = ref(0)
   const active_item_index = ref(undefined)
+  const current_meta_data = ref({})
 
   function getMenuItems(objectType, geodeObject) {
     if (!objectType || !geodeObject || !menus.value[objectType]) {
@@ -143,6 +144,7 @@ export const useMenuStore = defineStore("menu", () => {
   function closeMenu() {
     active_item_index.value = undefined
     current_id.value = undefined
+    current_meta_data.value = {}
     menuX.value = 0
     menuY.value = 0
     display_menu.value = false
@@ -162,6 +164,7 @@ export const useMenuStore = defineStore("menu", () => {
     }
 
     current_id.value = id
+    current_meta_data.value = meta_data || {}
 
     if (x !== undefined && y !== undefined) {
       menuX.value = x
@@ -202,6 +205,7 @@ export const useMenuStore = defineStore("menu", () => {
   return {
     display_menu,
     current_id,
+    current_meta_data,
     menuX,
     menuY,
     containerWidth,

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

@@ -0,0 +1,64 @@
+// Third party imports
+import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+// Local imports
+import { useModelBlocksCommonStyle } from "./common"
+import { useDataStore } from "@ogw_front/stores/data"
+import { useViewerStore } from "@ogw_front/stores/viewer"
+
+// Local constants
+const model_blocks_schemas = viewer_schemas.opengeodeweb_viewer.model.blocks
+
+export function useModelBlocksColorStyle() {
+  const dataStore = useDataStore()
+  const viewerStore = useViewerStore()
+  const modelBlocksCommonStyle = useModelBlocksCommonStyle()
+
+  function modelBlockColor(id, block_id) {
+    return modelBlocksCommonStyle.modelBlockStyle(id, block_id).color
+  }
+
+  function saveModelBlockColor(id, block_id, color) {
+    modelBlocksCommonStyle.modelBlockStyle(id, block_id).color = color
+  }
+
+  async function setModelBlocksColor(id, block_ids, color) {
+    if (!block_ids || block_ids.length === 0) {
+      return
+    }
+    const blocks_viewer_ids = await dataStore.getMeshComponentsViewerIds(
+      id,
+      block_ids,
+    )
+    if (!blocks_viewer_ids || blocks_viewer_ids.length === 0) {
+      console.warn(
+        "[setModelBlocksColor] No viewer IDs found, skipping color request",
+        { id, block_ids },
+      )
+      return
+    }
+    return viewerStore.request(
+      model_blocks_schemas.color,
+      { id, block_ids: blocks_viewer_ids, color },
+      {
+        response_function: () => {
+          for (const block_id of block_ids) {
+            saveModelBlockColor(id, block_id, color)
+          }
+
+          console.log(
+            setModelBlocksColor.name,
+            { id },
+            { block_ids },
+            JSON.stringify(modelBlockColor(id, block_ids[0])),
+          )
+        },
+      },
+    )
+  }
+
+  return {
+    modelBlockColor,
+    setModelBlocksColor,
+  }
+}

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

@@ -0,0 +1,21 @@
+import { useDataStyleStateStore } from "../../state"
+
+export function useModelBlocksCommonStyle() {
+  const dataStyleStateStore = useDataStyleStateStore()
+
+  function modelBlocksStyle(id) {
+    return dataStyleStateStore.getStyle(id).blocks
+  }
+
+  function modelBlockStyle(id, block_id) {
+    if (!modelBlocksStyle(id)[block_id]) {
+      modelBlocksStyle(id)[block_id] = {}
+    }
+    return modelBlocksStyle(id)[block_id]
+  }
+
+  return {
+    modelBlocksStyle,
+    modelBlockStyle,
+  }
+}

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

@@ -0,0 +1,35 @@
+// Local imports
+import { useModelBlocksColorStyle } from "./color"
+import { useModelBlocksCommonStyle } from "./common"
+import { useModelBlocksVisibilityStyle } from "./visibility"
+import { useDataStore } from "@ogw_front/stores/data"
+
+export function useModelBlocksStyle() {
+  const dataStore = useDataStore()
+  const modelBlocksCommonStyle = useModelBlocksCommonStyle()
+  const modelBlocksVisibilityStyle = useModelBlocksVisibilityStyle()
+  const modelBlocksColorStyle = useModelBlocksColorStyle()
+
+  async function applyModelBlocksStyle(id) {
+    const style = modelBlocksCommonStyle.modelBlocksStyle(id)
+    const blocks_ids = await dataStore.getBlocksGeodeIds(id)
+    return Promise.all([
+      modelBlocksVisibilityStyle.setModelBlocksVisibility(
+        id,
+        blocks_ids,
+        style.visibility,
+      ),
+      modelBlocksColorStyle.setModelBlocksColor(id, blocks_ids, style.color),
+    ])
+  }
+
+  async function setModelBlocksDefaultStyle(id) {}
+
+  return {
+    applyModelBlocksStyle,
+    setModelBlocksDefaultStyle,
+    ...modelBlocksCommonStyle,
+    ...modelBlocksVisibilityStyle,
+    ...modelBlocksColorStyle,
+  }
+}

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

@@ -0,0 +1,63 @@
+// Third party imports
+import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+// Local imports
+import { useModelBlocksCommonStyle } from "./common"
+import { useDataStore } from "@ogw_front/stores/data"
+import { useViewerStore } from "@ogw_front/stores/viewer"
+
+// Local constants
+const model_blocks_schemas = viewer_schemas.opengeodeweb_viewer.model.blocks
+
+export function useModelBlocksVisibilityStyle() {
+  const dataStore = useDataStore()
+  const viewerStore = useViewerStore()
+  const modelBlocksCommonStyle = useModelBlocksCommonStyle()
+
+  function modelBlockVisibility(id, block_id) {
+    return modelBlocksCommonStyle.modelBlockStyle(id, block_id).visibility
+  }
+
+  function saveModelBlockVisibility(id, block_id, visibility) {
+    modelBlocksCommonStyle.modelBlockStyle(id, block_id).visibility = visibility
+  }
+
+  async function setModelBlocksVisibility(id, block_ids, visibility) {
+    if (!block_ids || block_ids.length === 0) {
+      return
+    }
+    const blocks_viewer_ids = await dataStore.getMeshComponentsViewerIds(
+      id,
+      block_ids,
+    )
+    if (!blocks_viewer_ids || blocks_viewer_ids.length === 0) {
+      console.warn(
+        "[setModelBlocksVisibility] No viewer IDs found, skipping visibility request",
+        { id, block_ids },
+      )
+      return
+    }
+    return viewerStore.request(
+      model_blocks_schemas.visibility,
+      { id, block_ids: blocks_viewer_ids, visibility },
+      {
+        response_function: () => {
+          for (const block_id of block_ids) {
+            saveModelBlockVisibility(id, block_id, visibility)
+          }
+          console.log(
+            setModelBlocksVisibility.name,
+            { id },
+            { block_ids },
+            modelBlockVisibility(id, block_ids[0]),
+          )
+        },
+      },
+    )
+  }
+
+  return {
+    modelBlockVisibility,
+    setModelBlocksVisibility,
+  }
+}

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

@@ -0,0 +1,63 @@
+// Third party imports
+import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+// Local imports
+import { useModelCornersCommonStyle } from "./common"
+import { useDataStore } from "@ogw_front/stores/data"
+import { useViewerStore } from "@ogw_front/stores/viewer"
+
+// Local constants
+const model_corners_schemas = viewer_schemas.opengeodeweb_viewer.model.corners
+
+export function useModelCornersColorStyle() {
+  const dataStore = useDataStore()
+  const viewerStore = useViewerStore()
+  const modelCornersCommonStyle = useModelCornersCommonStyle()
+
+  function modelCornerColor(id, corner_id) {
+    return modelCornersCommonStyle.modelCornerStyle(id, corner_id).color
+  }
+
+  function saveModelCornerColor(id, corner_id, color) {
+    modelCornersCommonStyle.modelCornerStyle(id, corner_id).color = color
+  }
+
+  async function setModelCornersColor(id, corner_ids, color) {
+    if (!corner_ids || corner_ids.length === 0) {
+      return
+    }
+    const corner_viewer_ids = await dataStore.getMeshComponentsViewerIds(
+      id,
+      corner_ids,
+    )
+    if (!corner_viewer_ids || corner_viewer_ids.length === 0) {
+      console.warn(
+        "[setModelCornersColor] No viewer IDs found, skipping color request",
+        { id, corner_ids },
+      )
+      return
+    }
+    return viewerStore.request(
+      model_corners_schemas.color,
+      { id, block_ids: corner_viewer_ids, color },
+      {
+        response_function: () => {
+          for (const corner_id of corner_ids) {
+            saveModelCornerColor(id, corner_id, color)
+          }
+          console.log(
+            setModelCornersColor.name,
+            { id },
+            { corner_ids },
+            JSON.stringify(modelCornerColor(id, corner_ids[0])),
+          )
+        },
+      },
+    )
+  }
+
+  return {
+    modelCornerColor,
+    setModelCornersColor,
+  }
+}

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

@@ -0,0 +1,21 @@
+import { useDataStyleStateStore } from "../../state"
+
+export function useModelCornersCommonStyle() {
+  const dataStyleStateStore = useDataStyleStateStore()
+
+  function modelCornersStyle(id) {
+    return dataStyleStateStore.getStyle(id).corners
+  }
+
+  function modelCornerStyle(id, corner_id) {
+    if (!modelCornersStyle(id)[corner_id]) {
+      modelCornersStyle(id)[corner_id] = {}
+    }
+    return modelCornersStyle(id)[corner_id]
+  }
+
+  return {
+    modelCornersStyle,
+    modelCornerStyle,
+  }
+}

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

@@ -0,0 +1,36 @@
+// Local imports
+import { useModelCornersColorStyle } from "./color"
+import { useModelCornersCommonStyle } from "./common"
+import { useModelCornersVisibilityStyle } from "./visibility"
+import { useDataStore } from "@ogw_front/stores/data"
+
+export function useModelCornersStyle() {
+  const dataStore = useDataStore()
+  const modelCornersCommonStyle = useModelCornersCommonStyle()
+  const modelCornersVisibilityStyle = useModelCornersVisibilityStyle()
+  const modelCornersColorStyle = useModelCornersColorStyle()
+
+  async function applyModelCornersStyle(id) {
+    const style = modelCornersCommonStyle.modelCornersStyle(id)
+    const corner_ids = await dataStore.getCornersGeodeIds(id)
+    console.log(applyModelCornersStyle.name, { id }, { corner_ids })
+    return Promise.all([
+      modelCornersVisibilityStyle.setModelCornersVisibility(
+        id,
+        corner_ids,
+        style.visibility,
+      ),
+      modelCornersColorStyle.setModelCornersColor(id, corner_ids, style.color),
+    ])
+  }
+
+  async function setModelCornersDefaultStyle(id) {}
+
+  return {
+    applyModelCornersStyle,
+    setModelCornersDefaultStyle,
+    ...modelCornersCommonStyle,
+    ...modelCornersVisibilityStyle,
+    ...modelCornersColorStyle,
+  }
+}

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

@@ -0,0 +1,64 @@
+// Third party imports
+import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+// Local imports
+import { useModelCornersCommonStyle } from "./common"
+import { useDataStore } from "@ogw_front/stores/data"
+import { useViewerStore } from "@ogw_front/stores/viewer"
+
+// Local constants
+const model_corners_schemas = viewer_schemas.opengeodeweb_viewer.model.corners
+
+export function useModelCornersVisibilityStyle() {
+  const dataStore = useDataStore()
+  const viewerStore = useViewerStore()
+  const modelCornersCommonStyle = useModelCornersCommonStyle()
+
+  function modelCornerVisibility(id, corner_id) {
+    return modelCornersCommonStyle.modelCornerStyle(id, corner_id).visibility
+  }
+
+  function saveModelCornerVisibility(id, corner_id, visibility) {
+    modelCornersCommonStyle.modelCornerStyle(id, corner_id).visibility =
+      visibility
+  }
+
+  async function setModelCornersVisibility(id, corner_ids, visibility) {
+    if (!corner_ids || corner_ids.length === 0) {
+      return
+    }
+    const corner_viewer_ids = await dataStore.getMeshComponentsViewerIds(
+      id,
+      corner_ids,
+    )
+    if (!corner_viewer_ids || corner_viewer_ids.length === 0) {
+      console.warn(
+        "[setModelCornersVisibility] No viewer IDs found, skipping visibility request",
+        { id, corner_ids },
+      )
+      return
+    }
+    return viewerStore.request(
+      model_corners_schemas.visibility,
+      { id, block_ids: corner_viewer_ids, visibility },
+      {
+        response_function: () => {
+          for (const corner_id of corner_ids) {
+            saveModelCornerVisibility(id, corner_id, visibility)
+          }
+          console.log(
+            setModelCornersVisibility.name,
+            { id },
+            { corner_ids },
+            modelCornerVisibility(id, corner_ids[0]),
+          )
+        },
+      },
+    )
+  }
+
+  return {
+    modelCornerVisibility,
+    setModelCornersVisibility,
+  }
+}

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

@@ -0,0 +1,13 @@
+import { useDataStyleStateStore } from "../../state"
+
+export function useModelEdgesCommonStyle() {
+  const dataStyleStateStore = useDataStyleStateStore()
+
+  function modelEdgesStyle(id) {
+    return dataStyleStateStore.styles[id].edges
+  }
+
+  return {
+    modelEdgesStyle,
+  }
+}

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

@@ -0,0 +1,21 @@
+// Local imports
+import { useModelEdgesCommonStyle } from "./common"
+import { useModelEdgesVisibilityStyle } from "./visibility"
+
+export function useModelEdgesStyle() {
+  const modelEdgesCommonStyle = useModelEdgesCommonStyle()
+  const modelEdgesVisibilityStyle = useModelEdgesVisibilityStyle()
+
+  function applyModelEdgesStyle(id) {
+    const style = modelEdgesCommonStyle.modelEdgesStyle(id)
+    return Promise.resolve([
+      modelEdgesVisibilityStyle.setModelEdgesVisibility(id, style.visibility),
+    ])
+  }
+
+  return {
+    applyModelEdgesStyle,
+    ...modelEdgesCommonStyle,
+    ...modelEdgesVisibilityStyle,
+  }
+}

package/internal/stores/data_style/model/{edges.js → edges/visibility.js}

@@ -2,21 +2,18 @@
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
 
 // Local imports
-import { useDataStyleStateStore } from "../state"
+import { useModelEdgesCommonStyle } from "./common"
 import { useViewerStore } from "@ogw_front/stores/viewer"
 
 // Local constants
 const model_edges_schemas = viewer_schemas.opengeodeweb_viewer.model.edges
 
-export function useModelEdgesStyle() {
-  const dataStyleStateStore = useDataStyleStateStore()
+export function useModelEdgesVisibilityStyle() {
   const viewerStore = useViewerStore()
+  const modelEdgesCommonStyle = useModelEdgesCommonStyle()
 
-  function modelEdgesStyle(id) {
-    return dataStyleStateStore.styles[id].edges
-  }
   function modelEdgesVisibility(id) {
-    return modelEdgesStyle(id).visibility
+    return modelEdgesCommonStyle.modelEdgesStyle(id).visibility
   }
 
   function setModelEdgesVisibility(id, visibility) {
@@ -25,7 +22,7 @@ export function useModelEdgesStyle() {
       { id, visibility },
       {
         response_function: () => {
-          modelEdgesStyle(id).visibility = visibility
+          modelEdgesCommonStyle.modelEdgesStyle(id).visibility = visibility
           console.log(
             setModelEdgesVisibility.name,
             { id },
@@ -36,14 +33,8 @@ export function useModelEdgesStyle() {
     )
   }
 
-  function applyModelEdgesStyle(id) {
-    const style = modelEdgesStyle(id)
-    return Promise.resolve([setModelEdgesVisibility(id, style.visibility)])
-  }
-
   return {
     modelEdgesVisibility,
     setModelEdgesVisibility,
-    applyModelEdgesStyle,
   }
 }