@geode/opengeodeweb-front 9.7.0-rc.1 → 9.7.0-rc.3

package/components/Launcher.vue

@@ -2,7 +2,7 @@
   <v-container class="justify">
     <v-row align-content="center" align="center">
       <v-col
-        v-if="!is_captcha_validated"
+        v-if="!infra_store.is_captcha_validated"
         class="align"
         cols="12"
         align-self="center"
@@ -21,16 +21,21 @@
 <script setup>
   import Status from "@/utils/status.js"
 
-  const viewer_store = use_viewer_store()
   const infra_store = use_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_backend()
-      await viewer_store.ws_connect()
+  watch(
+    () => infra_store.is_captcha_validated,
+    (value, oldValue) => {
+      if (value && !oldValue && process.client) {
+        infra_store.create_backend()
+      }
+    },
+  )
+
+  onMounted(() => {
+    if (infra_store.is_captcha_validated) {
+      infra_store.create_backend()
     }
   })
 </script>

package/components/Loading.vue

@@ -3,14 +3,14 @@
     <v-col cols="12" class="ma-3">
       <v-card loading>
         <v-card-title class="text-center">
-          Cloud instance is starting...
+          Microservices are starting...
         </v-card-title>
         <v-card-subtitle class="text-center">
           Why do you have to wait?
         </v-card-subtitle>
         <v-card-text class="text-center">
-          We start our server only on demand... and this takes a few minutes
-          before you can use our free app.
+          We start our microservices only on demand... and this takes a few
+          minutes before you can use our free app.
           <br />
           This is aligned with our energy sobriety policy. So be patient
           <v-icon color="primary" size="20">

package/components/PackagesVersions.vue

@@ -52,9 +52,12 @@
     await Promise.all(array_promise)
   }
 
-  watch(geode_store.status, (value) => {
-    if (value == Status.CONNECTED) get_packages_versions()
-  })
+  watch(
+    () => geode_store.status,
+    (value) => {
+      if (value == Status.CONNECTED) get_packages_versions()
+    },
+  )
 
   await get_packages_versions()
 </script>

package/components/Recaptcha.vue

@@ -2,10 +2,10 @@
   <ClientOnly>
     <vue-recaptcha
       ref="recaptcha"
-      :sitekey="site_key"
+      :sitekey="props.site_key"
       :load-recaptcha-script="true"
       align-self="center"
-      @expired="is_captcha_validated = false"
+      @expired="infra_store.is_captcha_validated = false"
       @verify="submit_recaptcha"
     />
   </ClientOnly>
@@ -14,12 +14,10 @@
 <script setup>
   import { VueRecaptcha } from "vue-recaptcha"
   const infra_store = use_infra_store()
-  const { is_captcha_validated } = storeToRefs(infra_store)
 
   const props = defineProps({
     site_key: { type: String, required: true },
   })
-  const { site_key } = props
 
   onMounted(() => {
     if (process.client) {

package/components/RemoteRenderingView.vue

@@ -14,7 +14,7 @@
         "
         class="pa-0"
         @click="get_x_y"
-        @keydown.esc="app_store.toggle_picking_mode(false)"
+        @keydown.esc="viewer_store.toggle_picking_mode(false)"
       />
     </div>
   </ClientOnly>
@@ -26,8 +26,12 @@
   import viewer_schemas from "@geode/opengeodeweb-viewer/schemas.json"
   import Status from "@/utils/status.js"
 
+  const props = defineProps({
+    viewId: { type: String, default: "-1" },
+  })
+
   const viewer_store = use_viewer_store()
-  const viewer = ref(null)
+  const viewer = useTemplateRef("viewer")
   const { width, height } = useElementSize(viewer)
 
   const { width: windowWidth, height: windowHeight } = useWindowSize()
@@ -43,13 +47,7 @@
     }
   }
 
-  const props = defineProps({
-    viewId: { type: String, default: "-1" },
-  })
-
-  const { viewId } = toRefs(props)
   const connected = ref(false)
-
   const view = vtkRemoteView.newInstance({
     rpcWheelEvent: "viewport.mouse.zoom.wheel",
   })
@@ -69,33 +67,42 @@
     resize()
   })
 
-  watch(viewer_store.picking_mode, (value) => {
-    const cursor = value ? "crosshair" : "pointer"
-    view.getCanvasView().setCursor(cursor)
-  })
+  watch(
+    () => viewer_store.picking_mode,
+    (value) => {
+      const cursor = value ? "crosshair" : "pointer"
+      view.getCanvasView().setCursor(cursor)
+    },
+  )
 
   watch([width, height], () => {
     resize()
   })
 
-  watch(viewer_store.client, () => {
-    connect()
-  })
-
-  watch(viewId, (id) => {
-    if (connected.value) {
-      view.setViewId(id)
-      view.render()
-    }
-  })
+  watch(
+    () => viewer_store.client,
+    () => {
+      connect()
+    },
+  )
+
+  watch(
+    () => props.viewId,
+    (id) => {
+      if (connected.value) {
+        view.setViewId(id)
+        view.render()
+      }
+    },
+  )
 
   function connect() {
-    if (!viewer_store.status !== Status.CONNECTED) {
+    if (viewer_store.status !== Status.CONNECTED) {
       return
     }
     const session = viewer_store.client.value.getConnection().getSession()
     view.setSession(session)
-    view.setViewId(viewId.value)
+    view.setViewId(props.viewId)
     connected.value = true
     view.render()
   }

package/package.json

@@ -37,7 +37,7 @@
   },
   "description": "OpenSource Vue/Vuetify framework for web applications",
   "type": "module",
-  "version": "9.7.0-rc.1",
+  "version": "9.7.0-rc.3",
   "main": "./nuxt.config.js",
   "dependencies": {
     "@geode/opengeodeweb-back": "5.6.3",

package/stores/viewer.js

@@ -72,12 +72,17 @@ export const use_viewer_store = defineStore("viewer", {
 
         const { client } = this
         console.log("client", client)
+        console.log("status", this.status)
         if (this.status === Status.CONNECTED && client.isConnected()) {
+          console.log("disconnect")
+
           client.disconnect(-1)
           this.status = Status.NOT_CONNECTED
         }
         let clientToConnect = client
         if (_.isEmpty(clientToConnect)) {
+          console.log("isEmpty")
+
           clientToConnect = vtkWSLinkClient.newInstance()
         }
 
@@ -107,24 +112,27 @@ export const use_viewer_store = defineStore("viewer", {
         const { connectImageStream } = await import(
           "@kitware/vtk.js/Rendering/Misc/RemoteView"
         )
+        console.log("before connect")
+        const viewer_store = this
         return new Promise((resolve, reject) => {
           clientToConnect
             .connect(config)
             .then((validClient) => {
+              console.log("validClient", validClient)
               connectImageStream(validClient.getConnection().getSession())
-              this.client = validClient
+              viewer_store.client = validClient
               clientToConnect.endBusy()
 
               // Now that the client is ready let's setup the server for us
               viewer_call({
                 schema: schemas.opengeodeweb_viewer.viewer.reset_visualization,
               })
-              this.status = Status.CONNECTED
+              viewer_store.status = Status.CONNECTED
               resolve()
             })
             .catch((error) => {
               console.error(error)
-              this.status = Status.NOT_CONNECTED
+              viewer_store.status = Status.NOT_CONNECTED
               reject(error)
             })
         })