feat(microservices status): refactor stores

components/Launcher.vue

@@ -11,24 +11,25 @@
         <h4 class="pb-3">Please complete the recaptcha to launch the app</h4>
         <Recaptcha :site_key="site_key" />
       </v-col>
-      <v-col v-else-if="!is_running && is_connexion_launched">
+      <v-col v-else-if="infra_store.status == Status.CREATING">
         <Loading />
       </v-col>
     </v-row>
   </v-container>
 </template>
 
 <script setup>
+  import Status from "@/utils/status.js"
+
   const viewer_store = use_viewer_store()
   const infra_store = use_infra_store()
-  const { is_captcha_validated, is_connexion_launched, is_running } =
-    storeToRefs(infra_store)
+  const { is_captcha_validated } = storeToRefs(infra_store)
 
   const site_key = useRuntimeConfig().public.RECAPTCHA_SITE_KEY
 
   watch(is_captcha_validated, async (value) => {
     if (value === true && process.client) {
-      await infra_store.create_connexion()
+      await infra_store.create_backend()
       await viewer_store.ws_connect()
     }
   })

components/PackagesVersions.vue

@@ -19,22 +19,21 @@
 </template>
 
 <script setup>
-  const infra_store = use_infra_store()
-  const { is_running } = storeToRefs(infra_store)
+  import Status from "@/utils/status.js"
 
   const props = defineProps({
     schema: { type: Object, required: true },
   })
-  const { schema } = props
 
+  const geode_store = use_geode_store()
   const packages_versions = ref([])
 
   async function get_packages_versions() {
     const array_promise = []
 
     const promise = new Promise((resolve, reject) => {
       api_fetch(
-        { schema },
+        { schema: props.schema },
         {
           request_error_function: () => {
             reject()
@@ -53,8 +52,8 @@
     await Promise.all(array_promise)
   }
 
-  watch(is_running, () => {
-    get_packages_versions()
+  watch(geode_store.status, (value) => {
+    if (value == Status.CONNECTED) get_packages_versions()
   })
 
   await get_packages_versions()

components/RemoteRenderingView.vue

@@ -24,17 +24,16 @@
   import vtkRemoteView from "@kitware/vtk.js/Rendering/Misc/RemoteView"
   import { useElementSize, useWindowSize } from "@vueuse/core"
   import viewer_schemas from "@geode/opengeodeweb-viewer/schemas.json"
+  import Status from "@/utils/status.js"
 
   const viewer_store = use_viewer_store()
-  const { client, is_running, picking_mode } = storeToRefs(viewer_store)
-
   const viewer = ref(null)
   const { width, height } = useElementSize(viewer)
 
   const { width: windowWidth, height: windowHeight } = useWindowSize()
 
   function get_x_y(event) {
-    if (picking_mode.value === true) {
+    if (viewer_store.picking_mode.value === true) {
       const { offsetX, offsetY } = event
       viewer_store.set_picked_point(offsetX, offsetY)
       viewer_call({
@@ -70,7 +69,7 @@
     resize()
   })
 
-  watch(picking_mode, (value) => {
+  watch(viewer_store.picking_mode, (value) => {
     const cursor = value ? "crosshair" : "pointer"
     view.getCanvasView().setCursor(cursor)
   })
@@ -79,7 +78,7 @@
     resize()
   })
 
-  watch(client, () => {
+  watch(viewer_store.client, () => {
     connect()
   })
 
@@ -91,10 +90,10 @@
   })
 
   function connect() {
-    if (!is_running.value) {
+    if (!viewer_store.status !== Status.CONNECTED) {
       return
     }
-    const session = client.value.getConnection().getSession()
+    const session = viewer_store.client.value.getConnection().getSession()
     view.setSession(session)
     view.setViewId(viewId.value)
     connected.value = true

components/Wrapper.vue

@@ -1,22 +1,23 @@
 <template>
   <v-container>
     <v-row class="flex-column">
-      <v-col v-if="!is_running">
-        <Launcher />
-      </v-col>
-      <v-col v-if="is_running">
-        <Stepper />
-      </v-col>
-      <v-col v-if="is_running">
-        <PackagesVersions :schema="versions_schema" />
-      </v-col>
+      <template v-if="!infra_store.microservices_connected">
+        <v-col>
+          <Launcher />
+        </v-col>
+      </template>
+      <template v-else>
+        <v-col>
+          <Stepper />
+        </v-col>
+        <v-col> <PackagesVersions :schema="versions_schema" /> </v-col>
+      </template>
     </v-row>
   </v-container>
 </template>
 
 <script setup>
   const infra_store = use_infra_store()
-  const { is_running } = storeToRefs(infra_store)
 
   const props = defineProps({
     versions_schema: { type: Object, required: true },

composables/run_function_when_microservices_connected.js

@@ -0,0 +1,15 @@
+export function run_function_when_microservices_connected(function_to_run) {
+  const infra_store = use_infra_store()
+  const { microservices_connected } = storeToRefs(infra_store)
+  if (microservices_connected.value) {
+    function_to_run()
+  } else {
+    watch(microservices_connected, (value) => {
+      if (value) {
+        function_to_run()
+      }
+    })
+  }
+}
+
+export default run_function_when_microservices_connected

nuxt.config.js

@@ -39,6 +39,7 @@ export default defineNuxtConfig({
         "ajv",
         "fast-deep-equal",
         "globalthis",
+        "h3",
         "is-electron",
         "js-file-download",
         "lodash",

package.json

@@ -10,6 +10,7 @@
     "@nuxt/test-utils": "^3.15.1",
     "@pinia/testing": "^0.1.7",
     "@vitejs/plugin-vue": "^5.2.1",
+    "@vitest/coverage-v8": "^3.0.8",
     "@vue/test-utils": "^2.4.6",
     "eslint": "^8.57.0",
     "eslint-plugin-import": "^2.29.1",
@@ -73,4 +74,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
+}

stores/geode.js

@@ -1,10 +1,11 @@
 import back_schemas from "@geode/opengeodeweb-back/schemas.json"
+import Status from "@/utils/status.js"
 
 export const use_geode_store = defineStore("geode", {
   state: () => ({
     default_local_port: "5000",
     request_counter: 0,
-    is_running: false,
+    status: Status.NOT_CONNECTED,
   }),
   getters: {
     protocol() {
@@ -37,7 +38,7 @@ export const use_geode_store = defineStore("geode", {
   actions: {
     ping_task() {
       setInterval(() => {
-        if (this.is_running) {
+        if (this.status == Status.CONNECTED) {
           this.do_ping()
         }
       }, 10 * 1000)
@@ -48,19 +49,20 @@ export const use_geode_store = defineStore("geode", {
       return useFetch(back_schemas.opengeodeweb_back.ping.$id, {
         baseURL: this.base_url,
         method: back_schemas.opengeodeweb_back.ping.methods[0],
+        body: {},
         onRequestError({ error }) {
           feedback_store.server_error = true
-          geode_store.is_running = false
+          geode_store.status = Status.NOT_CONNECTED
         },
         onResponse({ response }) {
           if (response.ok) {
             feedback_store.server_error = false
-            geode_store.is_running = true
+            geode_store.status = Status.CONNECTED
           }
         },
         onResponseError({ response }) {
           feedback_store.server_error = true
-          geode_store.is_running = false
+          geode_store.status = Status.NOT_CONNECTED
         },
       })
     },
@@ -71,4 +73,7 @@ export const use_geode_store = defineStore("geode", {
       this.request_counter--
     },
   },
+  share: {
+    omit: ["status"],
+  },
 })

stores/infra.js

@@ -1,11 +1,12 @@
 import { useStorage } from "@vueuse/core"
 import isElectron from "is-electron"
+import Status from "@/utils/status.js"
 
 export const use_infra_store = defineStore("infra", {
   state: () => ({
     ID: useStorage("ID", ""),
     is_captcha_validated: false,
-    is_connexion_launched: false,
+    status: Status.NOT_CREATED,
   }),
   getters: {
     is_cloud() {
@@ -34,47 +35,53 @@ export const use_infra_store = defineStore("infra", {
         "/createbackend"
       return url
     },
-    is_running() {
-      return use_geode_store().is_running && use_viewer_store().is_running
+    microservices_connected() {
+      return (
+        use_geode_store().status == Status.CONNECTED &&
+        use_viewer_store().status == Status.CONNECTED
+      )
     },
-    is_busy() {
+    microservices_busy() {
       return use_geode_store().is_busy || use_viewer_store().is_busy
     },
   },
   actions: {
-    async create_connexion() {
-      if (this.is_connexion_launched) {
-        return
-      }
-      this.is_connexion_launched = true
-      return this.create_backend()
-    },
     async create_backend() {
-      const geode_store = use_geode_store()
-      const viewer_store = use_viewer_store()
-      const feedback_store = use_feedback_store()
-
-      if (isElectron()) {
-        const back_port = await window.electronAPI.run_back(geode_store.port)
-        geode_store.$patch({ default_local_port: back_port })
-        const viewer_port = await window.electronAPI.run_viewer(
-          viewer_store.port,
-        )
-        viewer_store.$patch({ default_local_port: viewer_port })
-      } else {
-        const { data, error } = await useFetch(this.lambda_url, {
-          method: "POST",
-        })
-        if (data.value !== null) {
+      if (this.status === Status.CREATED) return
+      navigator.locks.request("infra.create_backend", async (lock) => {
+        this.status = Status.CREATING
+        if (this.status === Status.CREATED) return
+        console.log("LOCK GRANTED !", lock)
+        const geode_store = use_geode_store()
+        const viewer_store = use_viewer_store()
+        const feedback_store = use_feedback_store()
+        if (isElectron()) {
+          const back_port = await window.electronAPI.run_back(geode_store.port)
+          geode_store.$patch({ default_local_port: back_port })
+          const viewer_port = await window.electronAPI.run_viewer(
+            viewer_store.port,
+          )
+          viewer_store.$patch({ default_local_port: viewer_port })
+        } else {
+          const { data, error } = await useFetch(this.lambda_url, {
+            method: "POST",
+          })
+          if (error.value || !data.value) {
+            this.status = Status.NOT_CREATED
+            feedback_store.server_error = true
+            return
+          }
           this.ID = data.value.ID
           localStorage.setItem("ID", data.value.ID)
-        } else {
-          feedback_store.server_error = true
-          return
         }
-      }
-      geode_store.$patch({ is_running: true })
-      return geode_store.ping_task()
+        this.status = Status.CREATED
+        return this.create_connection()
+      })
+    },
+    async create_connection() {
+      await use_viewer_store().ws_connect()
+      await use_geode_store().do_ping()
+      return
     },
   },
 })