feat(save_and_load): add import/export methods

composables/project_manager.js

@@ -0,0 +1,65 @@
+import { useAppStore } from "@/stores/app.js"
+import { useInfraStore } from "@ogw_f/stores/infra"
+import { viewer_call } from "@/composables/viewer_call.js"
+import { useGeodeStore } from "@/stores/geode.js"
+import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
+import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+
+export function useProjectManager() {
+  const appStore = useAppStore()
+  const geode = useGeodeStore()
+
+  async function exportProject() {
+    geode.start_request()
+    try {
+      await useInfraStore().create_connection()
+      const snapshot = appStore.exportStore()
+
+      const schema = back_schemas.opengeodeweb_back.project.export_project
+      const url = `${geode.base_url}${schema.route}`
+      const method = schema.methods[0]
+
+      const response = await fetch(url, {
+        method,
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ snapshot }),
+      })
+      if (!response.ok) {
+        throw new Error(`Export failed: ${response.statusText}`)
+      }
+      const blob = await response.blob()
+      const filename = response.headers.get("new-file-name")
+      const urlObject = URL.createObjectURL(blob)
+      const a = document.createElement("a")
+      a.href = urlObject
+      a.download = filename
+      a.click()
+      URL.revokeObjectURL(urlObject)
+    } finally {
+      geode.stop_request()
+    }
+  }
+
+  async function importProjectFile(file) {
+    geode.start_request()
+    try {
+      const snapshot = JSON.parse(await file.text())
+      await useInfraStore().create_connection()
+
+      await viewer_call({
+        schema: viewer_schemas.opengeodeweb_viewer.utils.import_project,
+        params: {},
+      })
+      await viewer_call({
+        schema: viewer_schemas.opengeodeweb_viewer.viewer.reset_visualization,
+        params: {},
+      })
+
+      await appStore.importStore(snapshot)
+    } finally {
+      geode.stop_request()
+    }
+  }
+
+  return { exportProject, importProjectFile }
+}

stores/app_store.js → stores/app.js

@@ -5,81 +5,69 @@ export const useAppStore = defineStore("app", () => {
     const isAlreadyRegistered = stores.some(
       (registeredStore) => registeredStore.$id === store.$id,
     )
-
     if (isAlreadyRegistered) {
       console.log(
         `[AppStore] Store "${store.$id}" already registered, skipping`,
       )
       return
     }
-
     console.log("[AppStore] Registering store", store.$id)
     stores.push(store)
   }
 
-  function save() {
+  function exportStore() {
     const snapshot = {}
-    let savedCount = 0
+    let exportCount = 0
 
     for (const store of stores) {
-      if (!store.save) {
+      if (!store.exportStore) {
         continue
       }
       const storeId = store.$id
       try {
-        snapshot[storeId] = store.save()
-        savedCount++
+        snapshot[storeId] = store.exportStore()
+        exportCount++
       } catch (error) {
-        console.error(`[AppStore] Error saving store "${storeId}":`, error)
+        console.error(`[AppStore] Error exporting store "${storeId}":`, error)
       }
     }
-
-    console.log(`[AppStore] Saved ${savedCount} stores`)
+    console.log(`[AppStore] Exported ${exportCount} stores`)
     return snapshot
   }
 
-  function load(snapshot) {
+  async function importStore(snapshot) {
     if (!snapshot) {
-      console.warn("[AppStore] load called with invalid snapshot")
+      console.warn("[AppStore] import called with invalid snapshot")
       return
     }
-
-    let loadedCount = 0
+    let importedCount = 0
     const notFoundStores = []
-
     for (const store of stores) {
-      if (!store.load) {
-        continue
-      }
-
+      if (!store.importStore) continue
       const storeId = store.$id
-
       if (!snapshot[storeId]) {
         notFoundStores.push(storeId)
         continue
       }
-
       try {
-        store.load(snapshot[storeId])
-        loadedCount++
+        await store.importStore(snapshot[storeId])
+        importedCount++
       } catch (error) {
-        console.error(`[AppStore] Error loading store "${storeId}":`, error)
+        console.error(`[AppStore] Error importing store "${storeId}":`, error)
       }
     }
-
     if (notFoundStores.length > 0) {
       console.warn(
         `[AppStore] Stores not found in snapshot: ${notFoundStores.join(", ")}`,
       )
     }
-
-    console.log(`[AppStore] Loaded ${loadedCount} stores`)
+    console.log(`[AppStore] Imported ${importedCount} stores`)
   }
 
   return {
     stores,
     registerStore,
-    save,
-    load,
+    exportStore,
+    importStore,
   }
 })

stores/data_base.js

@@ -1,5 +1,6 @@
 import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json"
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json"
+import { viewer_call } from "@/composables/viewer_call.js"
 
 export const useDataBaseStore = defineStore("dataBase", () => {
   const treeview_store = useTreeviewStore()
@@ -134,6 +135,21 @@ export const useDataBaseStore = defineStore("dataBase", () => {
     return flat_indexes.filter((index) => index !== null)
   }
 
+  function exportStore() {
+    return { db: JSON.parse(JSON.stringify(db)) }
+  }
+
+  async function importStore(snapshot) {
+    const entries = snapshot?.db || {}
+    const hybrid_store = useHybridViewerStore()
+    await hybrid_store.initHybridViewer()
+    hybrid_store.clear()
+    for (const [id, item] of Object.entries(entries)) {
+      await registerObject(id)
+      await addItem(id, item)
+    }
+  }
+
   return {
     db,
     itemMetaDatas,
@@ -148,5 +164,7 @@ export const useDataBaseStore = defineStore("dataBase", () => {
     getSurfacesUuids,
     getBlocksUuids,
     getFlatIndexes,
+    exportStore,
+    importStore,
   }
 })

stores/data_style.js

@@ -46,12 +46,22 @@ export const useDataStyleStore = defineStore("dataStyle", () => {
     return modelStyleStore.modelMeshComponentVisibility(id, "Edge", null)
   }
 
+  function exportStore() {
+    return { styles: dataStyleState.styles }
+  }
+
+  async function importStore(snapshot) {
+    dataStyleState.styles = snapshot?.styles || {}
+  }
+
   return {
     ...dataStyleState,
     addDataStyle,
     setVisibility,
     setModelEdgesVisibility,
     modelEdgesVisibility,
+    exportStore,
+    importStore,
     ...meshStyleStore,
     ...modelStyleStore,
   }

stores/hybrid_viewer.js

@@ -184,6 +184,25 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
     remoteRender()
   }
 
+  function clear() {
+    const renderer = genericRenderWindow.value.getRenderer()
+    const actors = renderer.getActors()
+    actors.forEach((actor) => renderer.removeActor(actor))
+    genericRenderWindow.value.getRenderWindow().render()
+    Object.keys(db).forEach((id) => delete db[id])
+  }
+
+  function exportStore() {
+    return { zScale: zScale.value }
+  }
+
+  async function importStore(snapshot) {
+    const z_scale = snapshot?.zScale
+    if (z_scale != null) {
+      await setZScaling(z_scale)
+    }
+  }
+
   return {
     db,
     genericRenderWindow,
@@ -195,5 +214,8 @@ export const useHybridViewerStore = defineStore("hybridViewer", () => {
     resize,
     setContainer,
     zScale,
+    clear,
+    exportStore,
+    importStore,
   }
 })

stores/treeview.js

@@ -12,18 +12,24 @@ export const useTreeviewStore = defineStore("treeview", () => {
   const selectedTree = ref(null)
 
   /** Functions **/
-  function addItem(geodeObject, displayed_name, id, object_type) {
+  function addItem(
+    geodeObject,
+    displayed_name,
+    id,
+    object_type,
+    autoSelect = true,
+  ) {
     dataStyleStore.addDataStyle(id, geodeObject, object_type)
     const child = { title: displayed_name, id, object_type }
     for (let i = 0; i < items.value.length; i++) {
       if (items.value[i].title === geodeObject) {
         items.value[i].children.push(child)
-        selection.value.push(child)
+        if (autoSelect) selection.value.push(child)
         return
       }
     }
     items.value.push({ title: geodeObject, children: [child] })
-    selection.value.push(child)
+    if (autoSelect) selection.value.push(child)
   }
 
   function displayAdditionalTree(id) {
@@ -47,6 +53,27 @@ export const useTreeviewStore = defineStore("treeview", () => {
     panelWidth.value = width
   }
 
+  function exportStore() {
+    return {
+      isAdditionnalTreeDisplayed: isAdditionnalTreeDisplayed.value,
+      panelWidth: panelWidth.value,
+      model_id: model_id.value,
+      isTreeCollection: isTreeCollection.value,
+      selectedTree: selectedTree.value,
+      selection: selection.value,
+    }
+  }
+
+  async function importStore(snapshot) {
+    selection.value = snapshot?.selection || []
+    isAdditionnalTreeDisplayed.value =
+      snapshot?.isAdditionnalTreeDisplayed || false
+    panelWidth.value = snapshot?.panelWidth || 300
+    model_id.value = snapshot?.model_id || ""
+    isTreeCollection.value = snapshot?.isTreeCollection || false
+    selectedTree.value = snapshot?.selectedTree || null
+  }
+
   return {
     items,
     selection,
@@ -60,5 +87,7 @@ export const useTreeviewStore = defineStore("treeview", () => {
     displayFileTree,
     toggleTreeView,
     setPanelWidth,
+    exportStore,
+    importStore,
   }
 })