@geode/opengeodeweb-front 10.3.0 → 10.3.1

package/app/stores/data.js

@@ -1,17 +1,17 @@
 // Third party imports
 import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
-import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
 import { database } from "../../internal/database/database.js"
 import { liveQuery } from "dexie"
 import { useObservable } from "@vueuse/rxjs"
+import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+// Local imports
+import { useGeodeStore } from "@ogw_front/stores/geode"
+import { useViewerStore } from "@ogw_front/stores/viewer"
 
-// Local constants
 const back_model_schemas = back_schemas.opengeodeweb_back.models
 const viewer_generic_schemas = viewer_schemas.opengeodeweb_viewer.generic
 
-import { useViewerStore } from "@ogw_front/stores/viewer"
-import { useGeodeStore } from "@ogw_front/stores/geode"
-
 export const useDataStore = defineStore("data", () => {
   const viewerStore = useViewerStore()
 
@@ -19,7 +19,7 @@ export const useDataStore = defineStore("data", () => {
   function getItem(id) {
     if (!id) {
       const emptyRef = ref({})
-      emptyRef.fetch = async () => null
+      emptyRef.fetch = async () => ({})
       return emptyRef
     }
     if (itemCache.has(id)) {
@@ -29,7 +29,7 @@ export const useDataStore = defineStore("data", () => {
       liveQuery(() => database.data.get(id)),
       { initialValue: {} },
     )
-    observable.fetch = async () => await database.data.get(id)
+    observable.fetch = () => database.data.get(id)
     itemCache.set(id, observable)
     return observable
   }
@@ -39,45 +39,48 @@ export const useDataStore = defineStore("data", () => {
       liveQuery(() => database.data.toArray()),
       { initialValue: [] },
     )
-    observable.fetch = async () => await database.data.toArray()
+    observable.fetch = () => database.data.toArray()
     return observable
   }
 
   async function formatedMeshComponents(id) {
     const items = await database.model_components.where({ id }).toArray()
     const distinctTypes = [...new Set(items.map((item) => item.type))]
-    const formated_mesh_components = []
-    for (const type of distinctTypes) {
-      const meshComponents = await database.model_components
-        .where({ id, type })
-        .toArray()
-
-      formated_mesh_components.push({
-        id: type,
-        title: type,
-        children: meshComponents.map((meshComponent) => ({
-          id: meshComponent.geode_id,
-          title: meshComponent.name,
-          category: meshComponent.type,
-        })),
-      })
-    }
+
+    const formated_mesh_components = await Promise.all(
+      distinctTypes.map(async (type) => {
+        const meshComponents = await database.model_components
+          .where({ id, type })
+          .toArray()
+
+        return {
+          id: type,
+          title: type,
+          children: meshComponents.map((meshComponent) => ({
+            id: meshComponent.geode_id,
+            title: meshComponent.name,
+            category: meshComponent.type,
+          })),
+        }
+      }),
+    )
 
     return formated_mesh_components
   }
 
   async function meshComponentType(id, geode_id) {
-    return (
-      await database.model_components.where({ id, geode_id }).toArray()
-    ).map((component) => component.type)[0]
+    const component = await database.model_components
+      .where({ id, geode_id })
+      .first()
+    return component?.type
   }
 
   async function registerObject(id) {
-    return viewerStore.request(viewer_generic_schemas.register, { id })
+    return await viewerStore.request(viewer_generic_schemas.register, { id })
   }
 
   async function deregisterObject(id) {
-    return viewerStore.request(viewer_generic_schemas.deregister, { id })
+    return await viewerStore.request(viewer_generic_schemas.deregister, { id })
   }
 
   async function addItem(id, value) {
@@ -90,7 +93,7 @@ export const useDataStore = defineStore("data", () => {
       created_at: value.created_at || new Date().toISOString(),
     }
 
-    const serializedData = JSON.parse(JSON.stringify(itemData))
+    const serializedData = structuredClone(itemData)
     await database.data.put(serializedData)
   }
   async function deleteItem(id) {
@@ -106,10 +109,10 @@ export const useDataStore = defineStore("data", () => {
       console.debug("[addModelComponents] No mesh components to add")
       return
     }
-    values.map((value) => {
+    for (const value of values) {
       value.created_at = new Date().toISOString()
-    })
-    const serializedData = JSON.parse(JSON.stringify(values))
+    }
+    const serializedData = structuredClone(values)
     await database.model_components.bulkAdd(serializedData)
   }
 
@@ -119,7 +122,7 @@ export const useDataStore = defineStore("data", () => {
 
   async function fetchMeshComponents(id) {
     const geodeStore = useGeodeStore()
-    return geodeStore.request(
+    return await geodeStore.request(
       back_model_schemas.mesh_components,
       { id },
       {
@@ -132,37 +135,35 @@ export const useDataStore = defineStore("data", () => {
   }
 
   async function getMeshComponentGeodeIds(id, meshComponentType) {
-    return (
-      await database.model_components
-        .where({ id, type: meshComponentType })
-        .toArray()
-    ).map((component) => component.geode_id)
+    const components = await database.model_components
+      .where({ id, type: meshComponentType })
+      .toArray()
+    return components.map((component) => component.geode_id)
   }
 
   async function getCornersGeodeIds(id) {
-    return getMeshComponentGeodeIds(id, "Corner")
+    return await getMeshComponentGeodeIds(id, "Corner")
   }
 
   async function getLinesGeodeIds(id) {
-    return getMeshComponentGeodeIds(id, "Line")
+    return await getMeshComponentGeodeIds(id, "Line")
   }
 
   async function getSurfacesGeodeIds(id) {
-    return getMeshComponentGeodeIds(id, "Surface")
+    return await getMeshComponentGeodeIds(id, "Surface")
   }
 
   async function getBlocksGeodeIds(id) {
-    return getMeshComponentGeodeIds(id, "Block")
+    return await getMeshComponentGeodeIds(id, "Block")
   }
 
   async function getMeshComponentsViewerIds(id, meshComponentGeodeIds) {
-    return (
-      await database.model_components
-        .where("id")
-        .equals(id)
-        .and((component) => meshComponentGeodeIds.includes(component.geode_id))
-        .toArray()
-    ).map((component) => component.viewer_id)
+    const components = await database.model_components
+      .where("id")
+      .equals(id)
+      .and((component) => meshComponentGeodeIds.includes(component.geode_id))
+      .toArray()
+    return components.map((component) => component.viewer_id)
   }
 
   async function exportStores() {
@@ -170,7 +171,7 @@ export const useDataStore = defineStore("data", () => {
     return { items }
   }
 
-  async function importStores(snapshot) {
+  async function importStores(_snapshot) {
     await clear()
   }
 

package/app/stores/data_style.js

@@ -18,13 +18,14 @@ export const useDataStyleStore = defineStore("dataStyle", () => {
     const item = await dataStore.getItem(id).fetch()
     const viewer_type = item?.viewer_type
     if (!viewer_type) {
-      throw new Error("Item not found or not loaded: " + id)
+      throw new Error(`Item not found or not loaded: ${id}`)
     }
 
     if (viewer_type === "mesh") {
-      return Promise.all([meshStyleStore.setMeshVisibility(id, visibility)])
-    } else if (viewer_type === "model") {
-      return Promise.all([modelStyleStore.setModelVisibility(id, visibility)])
+      return meshStyleStore.setMeshVisibility(id, visibility)
+    }
+    if (viewer_type === "model") {
+      return modelStyleStore.setModelVisibility(id, visibility)
     }
     throw new Error("Unknown viewer_type")
   }
@@ -33,23 +34,23 @@ export const useDataStyleStore = defineStore("dataStyle", () => {
     const item = await dataStore.getItem(id).fetch()
     const viewer_type = item?.viewer_type
     if (!viewer_type) {
-      throw new Error("Item not found or not loaded: " + id)
+      throw new Error(`Item not found or not loaded: ${id}`)
     }
 
     if (viewer_type === "mesh") {
       return meshStyleStore.applyMeshStyle(id)
-    } else if (viewer_type === "model") {
+    }
+    if (viewer_type === "model") {
       return modelStyleStore.applyModelStyle(id)
-    } else {
-      throw new Error("Unknown viewer_type: " + viewer_type)
     }
+    throw new Error(`Unknown viewer_type: ${viewer_type}`)
   }
 
-  const exportStores = () => {
+  function exportStores() {
     return { styles: dataStyleState.styles }
   }
 
-  const importStores = (snapshot) => {
+  function importStores(snapshot) {
     const stylesSnapshot = snapshot.styles || {}
     for (const id of Object.keys(dataStyleState.styles)) {
       delete dataStyleState.styles[id]
@@ -59,7 +60,7 @@ export const useDataStyleStore = defineStore("dataStyle", () => {
     }
   }
 
-  const applyAllStylesFromState = () => {
+  function applyAllStylesFromState() {
     const ids = Object.keys(dataStyleState.styles || {})
     const promises = []
     for (const id of ids) {

package/app/stores/feedback.js

@@ -1,10 +1,14 @@
 import { v4 as uuidv4 } from "uuid"
 
+const MILLISECONDS_IN_SECOND = 1000
+const DEFAULT_FEEDBACKS_TIMEOUT_SECONDS = 10
+
 export const useFeedbackStore = defineStore("feedback", {
   state: () => ({
     feedbacks: [],
     server_error: false,
-    feedbacks_timeout_miliseconds: 10 * 1000,
+    feedbacks_timeout_miliseconds:
+      DEFAULT_FEEDBACKS_TIMEOUT_SECONDS * MILLISECONDS_IN_SECOND,
   }),
   actions: {
     async add_error(code, route, name, description) {

package/app/stores/geode.js

@@ -1,9 +1,12 @@
-import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
 import Status from "@ogw_front/utils/status"
-import { appMode } from "@ogw_front/utils/app_mode"
 import { api_fetch } from "../../internal/utils/api_fetch"
-import { useInfraStore } from "@ogw_front/stores/infra"
+import { appMode } from "@ogw_front/utils/app_mode"
+import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
 import { useFeedbackStore } from "@ogw_front/stores/feedback"
+import { useInfraStore } from "@ogw_front/stores/infra"
+
+const MILLISECONDS_IN_SECOND = 1000
+const DEFAULT_PING_INTERVAL_SECONDS = 10
 
 export const useGeodeStore = defineStore("geode", {
   state: () => ({
@@ -13,17 +16,17 @@ export const useGeodeStore = defineStore("geode", {
   }),
   getters: {
     protocol() {
-      if (useInfraStore().app_mode == appMode.CLOUD) {
+      if (useInfraStore().app_mode === appMode.CLOUD) {
         return "https"
       }
       return "http"
     },
     port() {
-      if (useInfraStore().app_mode == appMode.CLOUD) {
+      if (useInfraStore().app_mode === appMode.CLOUD) {
         return "443"
       }
-      const GEODE_PORT = useRuntimeConfig().public.GEODE_PORT
-      if (GEODE_PORT != null && GEODE_PORT !== "") {
+      const { GEODE_PORT } = useRuntimeConfig().public
+      if (GEODE_PORT !== null && GEODE_PORT !== "") {
         return GEODE_PORT
       }
       return this.default_local_port
@@ -31,8 +34,8 @@ export const useGeodeStore = defineStore("geode", {
     base_url() {
       const infraStore = useInfraStore()
       let geode_url = `${this.protocol}://${infraStore.domain_name}:${this.port}`
-      if (infraStore.app_mode == appMode.CLOUD) {
-        if (infraStore.ID == "") {
+      if (infraStore.app_mode === appMode.CLOUD) {
+        if (infraStore.ID === "") {
           throw new Error("ID must not be empty in cloud mode")
         }
         geode_url += `/${infraStore.ID}/geode`
@@ -48,7 +51,7 @@ export const useGeodeStore = defineStore("geode", {
       this.ping()
       setInterval(() => {
         this.ping()
-      }, 10 * 1000)
+      }, DEFAULT_PING_INTERVAL_SECONDS * MILLISECONDS_IN_SECOND)
     },
     ping() {
       const geodeStore = this
@@ -73,14 +76,14 @@ export const useGeodeStore = defineStore("geode", {
       )
     },
     start_request() {
-      this.request_counter++
+      this.request_counter += 1
     },
     stop_request() {
-      this.request_counter--
+      this.request_counter -= 1
     },
     launch() {
       console.log("[GEODE] Launching geode microservice...")
-      return window.electronAPI.run_back()
+      return globalThis.electronAPI.run_back()
     },
     connect() {
       console.log("[GEODE] Connecting to geode microservice...")

package/app/stores/hybrid_viewer.js

@@ -1,13 +1,29 @@
+// oxlint-disable-next-line import/no-unassigned-import
 import "@kitware/vtk.js/Rendering/Profiles/Geometry"
-import vtkGenericRenderWindow from "@kitware/vtk.js/Rendering/Misc/GenericRenderWindow"
-import vtkXMLPolyDataReader from "@kitware/vtk.js/IO/XML/XMLPolyDataReader"
-import vtkMapper from "@kitware/vtk.js/Rendering/Core/Mapper"
-import vtkActor from "@kitware/vtk.js/Rendering/Core/Actor"
+import { newInstance as vtkActor } from "@kitware/vtk.js/Rendering/Core/Actor"
+import { newInstance as vtkGenericRenderWindow } from "@kitware/vtk.js/Rendering/Misc/GenericRenderWindow"
+import { newInstance as vtkMapper } from "@kitware/vtk.js/Rendering/Core/Mapper"
+import { newInstance as vtkXMLPolyDataReader } from "@kitware/vtk.js/IO/XML/XMLPolyDataReader"
 
-import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
 import Status from "@ogw_front/utils/status"
-import { useViewerStore } from "@ogw_front/stores/viewer"
 import { useDataStore } from "@ogw_front/stores/data"
+import { useViewerStore } from "@ogw_front/stores/viewer"
+import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+const RGB_MAX = 255
+const BACKGROUND_GREY_VALUE = 180
+const ACTOR_DARK_VALUE = 20
+const BACKGROUND_COLOR = [
+  BACKGROUND_GREY_VALUE / RGB_MAX,
+  BACKGROUND_GREY_VALUE / RGB_MAX,
+  BACKGROUND_GREY_VALUE / RGB_MAX,
+]
+const ACTOR_COLOR = [
+  ACTOR_DARK_VALUE / RGB_MAX,
+  ACTOR_DARK_VALUE / RGB_MAX,
+  ACTOR_DARK_VALUE / RGB_MAX,
+]
+const WHEEL_TIME_OUT_MS = 600
 
 export const useHybridViewerStore = defineStore("hybridViewer", () => {
   const viewerStore = useViewerStore()
@@ -17,15 +33,17 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
   const camera_options = reactive({})
   const genericRenderWindow = reactive({})
   const is_moving = ref(false)
-  const zScale = ref(1.0)
-  let viewStream
-  let gridActor = null
+  const zScale = ref(1)
+  let viewStream = undefined
+  let gridActor = undefined
 
   async function initHybridViewer() {
-    if (status.value !== Status.NOT_CREATED) return
+    if (status.value !== Status.NOT_CREATED) {
+      return
+    }
     status.value = Status.CREATING
-    genericRenderWindow.value = vtkGenericRenderWindow.newInstance({
-      background: [180 / 255, 180 / 255, 180 / 255],
+    genericRenderWindow.value = vtkGenericRenderWindow({
+      background: BACKGROUND_COLOR,
       listenWindowResize: false,
     })
 
@@ -37,12 +55,14 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
 
     await viewerStore.ws_connect()
     viewStream = viewerStore.client.getImageStream().createViewStream("-1")
-    viewStream.onImageReady((e) => {
-      if (is_moving.value) return
+    viewStream.onImageReady((event) => {
+      if (is_moving.value) {
+        return
+      }
       const webGLRenderWindow =
         genericRenderWindow.value.getApiSpecificRenderWindow()
       const imageStyle = webGLRenderWindow.getReferenceByName("bgImage").style
-      webGLRenderWindow.setBackgroundImage(e.image)
+      webGLRenderWindow.setBackgroundImage(event.image)
       imageStyle.opacity = 1
     })
 
@@ -53,18 +73,19 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
     if (!genericRenderWindow.value) {
       return
     }
-    const value = await dataStore.getItem(id).fetch()
+    const item = dataStore.getItem(id)
+    const value = await item.fetch()
     console.log("hybridViewerStore.addItem", { value })
-    const reader = vtkXMLPolyDataReader.newInstance()
+    const reader = vtkXMLPolyDataReader()
     const textEncoder = new TextEncoder()
     await reader.parseAsArrayBuffer(
       textEncoder.encode(value.binary_light_viewable),
     )
     const polydata = reader.getOutputData(0)
-    const mapper = vtkMapper.newInstance()
+    const mapper = vtkMapper()
     mapper.setInputData(polydata)
-    const actor = vtkActor.newInstance()
-    actor.getProperty().setColor(20 / 255, 20 / 255, 20 / 255)
+    const actor = vtkActor()
+    actor.getProperty().setColor(ACTOR_COLOR)
     actor.setMapper(mapper)
     const renderer = genericRenderWindow.value.getRenderer()
     const renderWindow = genericRenderWindow.value.getRenderWindow()
@@ -75,7 +96,9 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
   }
 
   async function removeItem(id) {
-    if (!hybridDb[id]) return
+    if (!hybridDb[id]) {
+      return
+    }
     const renderer = genericRenderWindow.value.getRenderer()
     renderer.removeActor(hybridDb[id].actor)
     genericRenderWindow.value.getRenderWindow().render()
@@ -91,19 +114,21 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
     zScale.value = z_scale
     const renderer = genericRenderWindow.value.getRenderer()
     const actors = renderer.getActors()
-    actors.forEach((actor) => {
+    for (const actor of actors) {
       if (actor !== gridActor) {
         const scale = actor.getScale()
         actor.setScale(scale[0], scale[1], z_scale)
       }
-    })
+    }
     renderer.resetCamera()
     genericRenderWindow.value.getRenderWindow().render()
     const schema = viewer_schemas?.opengeodeweb_viewer?.viewer?.set_z_scaling
-    if (!schema) return
+    if (!schema) {
+      return
+    }
     const viewerStore = useViewerStore()
     await viewerStore.request(schema, {
-      z_scale: z_scale,
+      z_scale,
     })
     remoteRender()
   }
@@ -114,11 +139,11 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
     const camera = renderer.getActiveCamera()
     const params = {
       camera_options: {
-        focal_point: camera.getFocalPoint(),
-        view_up: camera.getViewUp(),
-        position: camera.getPosition(),
+        focal_point: [...camera.getFocalPoint()],
+        view_up: [...camera.getViewUp()],
+        position: [...camera.getPosition()],
         view_angle: camera.getViewAngle(),
-        clipping_range: camera.getClippingRange(),
+        clipping_range: [...camera.getClippingRange()],
         distance: camera.getDistance(),
       },
     }
@@ -130,7 +155,9 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
         response_function: () => {
           remoteRender()
           for (const key in params.camera_options) {
-            camera_options[key] = params.camera_options[key]
+            if (Object.hasOwn(params.camera_options, key)) {
+              camera_options[key] = params.camera_options[key]
+            }
           }
         },
       },
@@ -139,7 +166,7 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
 
   function remoteRender() {
     const viewerStore = useViewerStore()
-    viewerStore.request(viewer_schemas.opengeodeweb_viewer.viewer.render)
+    return viewerStore.request(viewer_schemas.opengeodeweb_viewer.viewer.render)
   }
 
   function setContainer(container) {
@@ -157,7 +184,7 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
       target: container,
       onPressed: (event) => {
         console.log("onPressed")
-        if (event.button == 0) {
+        if (event.button === 0) {
           is_moving.value = true
           event.stopPropagation()
           imageStyle.opacity = 0
@@ -173,7 +200,7 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
       },
     })
 
-    let wheelEventEndTimeout = null
+    let wheelEventEndTimeout = undefined
     useEventListener(container, "wheel", () => {
       is_moving.value = true
       imageStyle.opacity = 0
@@ -181,7 +208,7 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
       wheelEventEndTimeout = setTimeout(() => {
         is_moving.value = false
         syncRemoteCamera()
-      }, 600)
+      }, WHEEL_TIME_OUT_MS)
     })
   }
 
@@ -205,7 +232,7 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
     remoteRender()
   }
 
-  const exportStores = () => {
+  function exportStores() {
     const renderer = genericRenderWindow.value.getRenderer()
     const camera = renderer.getActiveCamera()
     const cameraSnapshot = camera
@@ -221,14 +248,14 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
     return { zScale: zScale.value, camera_options: cameraSnapshot }
   }
 
-  const importStores = (snapshot) => {
+  async function importStores(snapshot) {
     if (!snapshot) {
       console.warn("importStores called with undefined snapshot")
       return
     }
     const z_scale = snapshot.zScale
 
-    const applyCamera = () => {
+    function applyCamera() {
       const { camera_options } = snapshot
       if (!camera_options) {
         return
@@ -247,11 +274,11 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
 
       const payload = {
         camera_options: {
-          focal_point: camera_options.focal_point,
-          view_up: camera_options.view_up,
-          position: camera_options.position,
+          focal_point: [...camera_options.focal_point],
+          view_up: [...camera_options.view_up],
+          position: [...camera_options.position],
           view_angle: camera_options.view_angle,
-          clipping_range: camera_options.clipping_range,
+          clipping_range: [...camera_options.clipping_range],
         },
       }
       const viewerStore = useViewerStore()
@@ -268,12 +295,13 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
     }
 
     if (typeof z_scale === "number") {
-      return setZScaling(z_scale).then(() => applyCamera())
+      await setZScaling(z_scale)
+      return await applyCamera()
     }
-    return applyCamera()
+    return await applyCamera()
   }
 
-  const clear = () => {
+  function clear() {
     const renderer = genericRenderWindow.value.getRenderer()
     const actors = renderer.getActors()
     for (const actor of actors) {