@geode/opengeodeweb-front 10.34.0-rc.2 → 10.34.0-rc.21

package/app/stores/treeview.ts

@@ -0,0 +1,383 @@
+// Not auto-fixable (eslint's sort-imports core rule has no autofixer) and this file's import order doesn't match its syntax-kind-then-alphabetical requirement - left as-is rather than manually reordered across the codebase for a purely cosmetic rule.
+// oxlint-disable eslint/sort-imports, eslint/max-lines
+import { defineStore } from "pinia";
+
+import type { Table } from "dexie";
+import { ref, watch } from "vue";
+import { compareSelections } from "@ogw_front/utils/treeview";
+import { database } from "@ogw_internal/database/database";
+
+const PANEL_WIDTH = 300;
+
+interface OpenedView {
+  type: "object" | "component";
+  id: string;
+  title: string;
+  scrollTop: number;
+  opened: string[];
+  modelId?: string;
+  viewType?: string;
+  geode_object_type?: string;
+}
+
+interface TreeviewChild {
+  title: string;
+  id: string;
+  viewer_type: string;
+  geode_object_type: string;
+}
+
+interface TreeviewGroup {
+  id: string;
+  title: string;
+  children: TreeviewChild[];
+}
+
+interface TreeviewConfigRecord {
+  id: string;
+  opened_views: OpenedView[];
+  panelWidth: number;
+  additionalPanelWidth: number;
+  selectionIds: string[];
+  rowHeights: number[];
+}
+
+interface TreeviewSnapshot {
+  opened_views?: OpenedView[];
+  panelWidth?: number;
+  additionalPanelWidth?: number;
+  rowHeights?: number[];
+  selectionIds?: string[];
+  selection?: (string | { id: string })[];
+}
+
+function defaultOpenedViews(): OpenedView[] {
+  return [{ type: "object", id: "main", title: "Objects", scrollTop: 0, opened: [] }];
+}
+
+type ReadonlyOpenedView = Omit<OpenedView, "opened"> & {
+  readonly opened: readonly string[];
+};
+type ReadonlyTreeviewGroup = Omit<TreeviewGroup, "children"> & {
+  readonly children: readonly TreeviewChild[];
+};
+type ReadonlyTreeviewSnapshot = {
+  opened_views?: readonly ReadonlyOpenedView[];
+  panelWidth?: number;
+  additionalPanelWidth?: number;
+  rowHeights?: readonly number[];
+  selectionIds?: readonly string[];
+  selection?: readonly (string | { id: string })[];
+};
+
+// oxlint-disable-next-line max-lines-per-function, max-statements
+export const useTreeviewStore = defineStore("treeview", () => {
+  const items = ref<TreeviewGroup[]>([]);
+  const selection = ref<string[]>([]);
+  const activeItems = ref<string[]>([]);
+  const opened_views = ref<OpenedView[]>(defaultOpenedViews());
+  const panelWidth = ref(PANEL_WIDTH);
+  const additionalPanelWidth = ref(PANEL_WIDTH);
+  const isImporting = ref(false);
+  const pendingSelectionIds = ref<string[]>([]);
+  const rowHeights = ref<number[]>([]);
+
+  // The database's table map is dynamically assembled at runtime (see internal/database/database.ts), so its exported type is a loose `{}`; cast it to the shape it actually has at runtime rather than widening every call site.
+  type DatabaseTables = Record<string, unknown>;
+  // oxlint-disable-next-line no-unsafe-type-assertion -- database's table map is dynamically typed at runtime; see comment above.
+  const typedDatabase = database as unknown as DatabaseTables;
+  // oxlint-disable-next-line no-unsafe-type-assertion -- database's table map is dynamically typed at runtime; see comment above.
+  const treeview_config_db = typedDatabase.treeview_config as Table<TreeviewConfigRecord, string>;
+
+  async function loadConfig(): Promise<void> {
+    try {
+      const config = await treeview_config_db.get("main");
+      if (config?.opened_views) {
+        opened_views.value = config.opened_views;
+      }
+      if (config?.panelWidth !== undefined && config.panelWidth !== 0) {
+        panelWidth.value = config.panelWidth;
+      }
+      if (config?.additionalPanelWidth !== undefined && config.additionalPanelWidth !== 0) {
+        additionalPanelWidth.value = config.additionalPanelWidth;
+      }
+      if (config?.selectionIds) {
+        selection.value = config.selectionIds;
+      }
+      if (config?.rowHeights) {
+        rowHeights.value = config.rowHeights;
+      }
+    } catch (error) {
+      // oxlint-disable-next-line no-console -- surfaces persistence failures during local development.
+      console.error("Failed to load treeview config:", error);
+    }
+  }
+  // oxlint-disable-next-line typescript/no-floating-promises -- loadConfig catches its own errors internally.
+  loadConfig();
+
+  watch(
+    [opened_views, panelWidth, additionalPanelWidth, selection, rowHeights],
+    () => {
+      // oxlint-disable-next-line unicorn/prefer-structured-clone, no-unsafe-type-assertion -- JSON round-trip of a known-shape ref; result matches the source type.
+      const clean_opened_views = JSON.parse(JSON.stringify(opened_views.value)) as OpenedView[];
+      // oxlint-disable-next-line unicorn/prefer-structured-clone, no-unsafe-type-assertion -- JSON round-trip of a known-shape ref; result matches the source type.
+      const clean_selectionIds = JSON.parse(JSON.stringify(selection.value)) as string[];
+      // oxlint-disable-next-line unicorn/prefer-structured-clone, no-unsafe-type-assertion -- JSON round-trip of a known-shape ref; result matches the source type.
+      const clean_rowHeights = JSON.parse(JSON.stringify(rowHeights.value)) as number[];
+
+      // oxlint-disable-next-line typescript/no-floating-promises -- best-effort persistence; failures aren't actionable here.
+      treeview_config_db.put({
+        id: "main",
+        opened_views: clean_opened_views,
+        panelWidth: panelWidth.value,
+        additionalPanelWidth: additionalPanelWidth.value,
+        selectionIds: clean_selectionIds,
+        rowHeights: clean_rowHeights,
+      });
+    },
+    { deep: true },
+  );
+
+  function closeView(id: string): void {
+    opened_views.value = opened_views.value.filter((view: ReadonlyOpenedView) => view.id !== id);
+  }
+
+  watch(selection, (current: readonly string[], previous: readonly string[]) => {
+    const { removed } = compareSelections(current, previous);
+    for (const id of removed) {
+      const index = opened_views.value.findIndex(
+        (view: ReadonlyOpenedView) => view.type === "component" && view.id === id,
+      );
+      if (index !== -1) {
+        closeView(id);
+      }
+    }
+  });
+
+  function toggleView(id: string): void {
+    const index = opened_views.value.findIndex((view: ReadonlyOpenedView) => view.id === id);
+    if (index !== -1) {
+      closeView(id);
+    } else if (id === "main") {
+      opened_views.value.unshift({
+        type: "object",
+        id: "main",
+        title: "Objects",
+        scrollTop: 0,
+        opened: [],
+      });
+    }
+  }
+
+  function addItem(geodeObjectType: string, name: string, id: string, viewer_type: string): void {
+    const child: TreeviewChild = {
+      title: name,
+      id,
+      viewer_type,
+      geode_object_type: geodeObjectType,
+    };
+    let found = false;
+    for (const item of items.value) {
+      if (item.title === geodeObjectType) {
+        item.children.push(child);
+        const options = { numeric: true, sensitivity: "base" as const };
+        item.children.sort((childA, childB) =>
+          childA.title.localeCompare(childB.title, undefined, options),
+        );
+        found = true;
+        break;
+      }
+    }
+    if (!found) {
+      items.value.push({ id: geodeObjectType, title: geodeObjectType, children: [child] });
+      const sort_options = { numeric: true, sensitivity: "base" as const };
+      items.value.sort((groupA: ReadonlyTreeviewGroup, groupB: ReadonlyTreeviewGroup) =>
+        groupA.title.localeCompare(groupB.title, undefined, sort_options),
+      );
+    }
+    selection.value = [...selection.value, id];
+  }
+
+  function removeItem(id: string): void {
+    for (let index = 0; index < items.value.length; index += 1) {
+      const group = items.value[index];
+      if (!group) {
+        continue;
+      }
+      const childIndex = group.children.findIndex((child) => child.id === id);
+      if (childIndex !== -1) {
+        group.children.splice(childIndex, 1);
+        if (group.children.length === 0) {
+          items.value.splice(index, 1);
+        }
+        selection.value = selection.value.filter((selection_id) => selection_id !== id);
+        return;
+      }
+    }
+  }
+
+  function displayAdditionalTree(
+    id: string,
+    title: string | undefined,
+    geodeObjectType: string,
+    viewType = "model_components",
+  ): void {
+    const viewId = `${id}_${viewType}`;
+    const index = opened_views.value.findIndex((view: ReadonlyOpenedView) => view.id === viewId);
+    if (index !== -1) {
+      closeView(viewId);
+      return;
+    }
+    additionalPanelWidth.value = panelWidth.value;
+    opened_views.value.push({
+      type: "component",
+      id: viewId,
+      modelId: id,
+      viewType,
+      title: title ?? id,
+      geode_object_type: geodeObjectType,
+      scrollTop: 0,
+      opened: [],
+    });
+  }
+
+  function moveView(from_index: number, to_index: number): void {
+    if (from_index !== 0 && to_index !== 0) {
+      const [element] = opened_views.value.splice(from_index, 1);
+      if (element) {
+        opened_views.value.splice(to_index, 0, element);
+      }
+    }
+  }
+
+  function importStores(snapshot: ReadonlyTreeviewSnapshot | undefined): void {
+    opened_views.value = snapshot?.opened_views
+      ? // oxlint-disable-next-line no-unsafe-type-assertion -- narrowing the readonly parameter view back to the mutable working type; these objects aren't actually frozen at runtime.
+        ([...snapshot.opened_views] as OpenedView[])
+      : defaultOpenedViews();
+    panelWidth.value = snapshot?.panelWidth ?? PANEL_WIDTH;
+    additionalPanelWidth.value = snapshot?.additionalPanelWidth ?? PANEL_WIDTH;
+    rowHeights.value = snapshot?.rowHeights ? [...snapshot.rowHeights] : [];
+    pendingSelectionIds.value = snapshot?.selectionIds
+      ? [...snapshot.selectionIds]
+      : (snapshot?.selection ?? []).map((selectionItem: string | { id: string }) =>
+          typeof selectionItem === "string" ? selectionItem : selectionItem.id,
+        );
+  }
+
+  function finalizeImportSelection(): void {
+    const rebuilt: string[] = [];
+    for (const group of items.value) {
+      for (const child of group.children) {
+        if (
+          pendingSelectionIds.value.length === 0 ||
+          pendingSelectionIds.value.includes(child.id)
+        ) {
+          rebuilt.push(child.id);
+        }
+      }
+    }
+    selection.value = rebuilt;
+    pendingSelectionIds.value = [];
+  }
+
+  function clear(): void {
+    items.value = [];
+    selection.value = [];
+    activeItems.value = [];
+    pendingSelectionIds.value = [];
+    opened_views.value = defaultOpenedViews();
+  }
+
+  function displayFileTree(): void {
+    opened_views.value = defaultOpenedViews();
+  }
+
+  function setPanelWidth(width: number): void {
+    panelWidth.value = width;
+  }
+
+  function setAdditionalPanelWidth(width: number): void {
+    additionalPanelWidth.value = width;
+  }
+
+  function setScrollTop(viewId: string, scrollTop: number): void {
+    const view = opened_views.value.find(
+      (openedView: ReadonlyOpenedView) => openedView.id === viewId,
+    );
+    if (view) {
+      view.scrollTop = scrollTop;
+    }
+  }
+
+  function setOpened(viewId: string, opened: readonly string[]): void {
+    const view = opened_views.value.find(
+      (openedView: ReadonlyOpenedView) => openedView.id === viewId,
+    );
+    if (view) {
+      view.opened = [...opened];
+    }
+  }
+
+  function setRowHeights(heights: readonly number[]): void {
+    rowHeights.value = [...heights];
+  }
+
+  function exportStores(): Omit<TreeviewConfigRecord, "id"> {
+    return {
+      opened_views: opened_views.value,
+      panelWidth: panelWidth.value,
+      additionalPanelWidth: additionalPanelWidth.value,
+      selectionIds: selection.value,
+      rowHeights: rowHeights.value,
+    };
+  }
+
+  function renameItem(id: string, newName: string): void {
+    for (const group of items.value) {
+      const child = group.children.find((childItem) => childItem.id === id);
+      if (child) {
+        child.title = newName;
+        const options = { numeric: true, sensitivity: "base" as const };
+        group.children.sort((childA, childB) =>
+          childA.title.localeCompare(childB.title, undefined, options),
+        );
+        break;
+      }
+    }
+    const view = opened_views.value.find((openedView: ReadonlyOpenedView) => openedView.id === id);
+    if (view) {
+      view.title = newName;
+    }
+  }
+
+  return {
+    items,
+    selection,
+    activeItems,
+    opened_views,
+    panelWidth,
+    additionalPanelWidth,
+    isImporting,
+    rowHeights,
+    addItem,
+    removeItem,
+    renameItem,
+    displayAdditionalTree,
+    closeView,
+    toggleView,
+    moveView,
+    importStores,
+    displayFileTree,
+    setPanelWidth,
+    setAdditionalPanelWidth,
+    setScrollTop,
+    setOpened,
+    setRowHeights,
+    exportStores,
+    finalizeImportSelection,
+    clear,
+  };
+});
+
+export type { TreeviewSnapshot };

package/app/stores/{viewer.js → viewer.ts}

@@ -1,5 +1,4 @@
 // Third party imports
-import _ from "lodash";
 // oxlint-disable-next-line no-unassigned-import
 import "@kitware/vtk.js/Rendering/OpenGL/Profiles/Geometry";
 import { connectImageStream } from "@kitware/vtk.js/Rendering/Misc/RemoteView";
@@ -18,6 +17,16 @@ import { useAppStore } from "@ogw_front/stores/app";
 import { useInfraStore } from "@ogw_front/stores/infra";
 import { viewer_call } from "@ogw_internal/utils/viewer_call";
 
+import type { JsonRpcSchema, RequestHandlers } from "@ogw_shared/utils/types.js";
+// oxlint-disable-next-line import/max-dependencies -- all imports above are required by this store.
+import type { RpcClient } from "@ogw_shared/utils/call_raw.js";
+
+interface PickedPoint {
+  x: number | undefined;
+  y: number | undefined;
+  z: number | undefined;
+}
+
 const MS_PER_SECOND = 1000;
 const SECONDS_PER_REQUEST = 10;
 const request_timeout = MS_PER_SECOND * SECONDS_PER_REQUEST;
@@ -27,10 +36,11 @@ export const useViewerStore = defineStore(
   () => {
     const infraStore = useInfraStore();
     const default_local_port = ref("1234");
-    const client = ref({});
-    const config = ref(undefined);
+    // oxlint-disable-next-line no-unsafe-type-assertion -- placeholder before the real client is set by ws_connect.
+    const client = ref<RpcClient>({} as RpcClient);
+    const config = ref<unknown>(undefined);
     const picking_mode = ref(false);
-    const picked_point = ref({
+    const picked_point = ref<PickedPoint>({
       x: undefined,
       y: undefined,
       z: undefined,
@@ -48,14 +58,38 @@ export const useViewerStore = defineStore(
       viewer_url += "/ws";
       return viewer_url;
     });
+    function start_request(): void {
+      request_counter.value += 1;
+    }
+    function stop_request(): void {
+      request_counter.value -= 1;
+    }
     const is_busy = computed(() => request_counter.value > 0);
-    function toggle_picking_mode(value) {
+    function toggle_picking_mode(value: boolean): void {
       picking_mode.value = value;
     }
-    function request({ schema, params = {}, timeout = request_timeout }, callbacks = {}) {
-      const store = useViewerStore();
-      return viewer_call(
-        store,
+    // oxlint-disable-next-line unicorn/consistent-function-scoping
+    async function request(
+      {
+        schema,
+        params = {},
+        timeout = request_timeout,
+      }: {
+        schema: JsonRpcSchema;
+        params?: Record<string, unknown>;
+        timeout?: number;
+      },
+      callbacks: RequestHandlers = {},
+    ): Promise<unknown> {
+      const microservice = {
+        $id: "viewer",
+        client: client.value,
+        base_url: base_url.value,
+        start_request,
+        stop_request,
+      };
+      const result = await viewer_call(
+        microservice,
         {
           schema,
           params,
@@ -63,15 +97,16 @@ export const useViewerStore = defineStore(
         },
         {
           ...callbacks,
-          response_function: async (response) => {
+          response_function: async (response: unknown) => {
             if (callbacks.response_function) {
               await callbacks.response_function(response);
             }
           },
         },
       );
+      return result;
     }
-    async function set_picked_point(x, y) {
+    async function set_picked_point(x: number, y: number): Promise<void> {
       const schema = opengeodeweb_viewer_schemas.opengeodeweb_viewer.viewer.get_point_position;
       const params = {
         x: Math.round(x),
@@ -81,31 +116,37 @@ export const useViewerStore = defineStore(
         schema,
         params,
       });
-      const { x: world_x, y: world_y, z: world_z } = response;
+      const {
+        x: world_x,
+        y: world_y,
+        z: world_z,
+        // oxlint-disable-next-line no-unsafe-type-assertion -- response shape is defined by the get_point_position schema.
+      } = response as { x: number; y: number; z: number };
       picked_point.value = {
         x: world_x,
         y: world_y,
         z: world_z,
       };
     }
-    function ws_connect() {
+    async function ws_connect(): Promise<void> {
       if (status.value === Status.CONNECTED) {
         return;
       }
-      return navigator.locks.request("viewer.ws_connect", async (lock) => {
+      await navigator.locks.request("viewer.ws_connect", async () => {
         if (status.value === Status.CONNECTED) {
           return;
         }
         try {
-          console.log("VIEWER LOCK GRANTED !", lock);
           status.value = Status.CONNECTING;
-          client.value = await initWebSocketClient(base_url.value, client.value, {
+          client.value = (await initWebSocketClient(base_url.value, client.value, {
             onConnectionClose: () => {
               status.value = Status.NOT_CONNECTED;
             },
-          });
+            // oxlint-disable-next-line no-unsafe-type-assertion -- initWebSocketClient's return is not typed as RpcClient.
+          })) as unknown as RpcClient;
           connectImageStream(client.value.getConnection().getSession());
-          client.value.endBusy();
+          // oxlint-disable-next-line no-unsafe-type-assertion -- endBusy is not part of the RpcClient type.
+          (client.value as unknown as { endBusy: () => void }).endBusy();
           const schema = opengeodeweb_viewer_schemas.opengeodeweb_viewer.viewer.reset_visualization;
           const timeout = undefined;
           await request({
@@ -114,22 +155,12 @@ export const useViewerStore = defineStore(
           });
           status.value = Status.CONNECTED;
         } catch (error) {
-          console.error("ws_connect error", error);
           status.value = Status.NOT_CONNECTED;
           throw error;
         }
       });
     }
-    function start_request() {
-      request_counter.value += 1;
-    }
-    function stop_request() {
-      request_counter.value -= 1;
-    }
-    function launch(args = ({ projectFolderPath } = {})) {
-      console.log("[VIEWER] Launching viewer microservice...", {
-        args,
-      });
+    async function launch(args: Readonly<{ projectFolderPath?: string }> = {}): Promise<unknown> {
       const appStore = useAppStore();
       const { COMMAND_VIEWER, NUXT_ROOT_PATH } = useRuntimeConfig().public;
       const schema = opengeodeweb_front_schemas.api.local.app.run_viewer;
@@ -138,39 +169,41 @@ export const useViewerStore = defineStore(
         NUXT_ROOT_PATH,
         args,
       };
-      console.log("[VIEWER] params", params);
-      return appStore.request(
+      const result = await appStore.request(
         {
           schema,
           params,
         },
         {
-          response_function: (response) => {
-            console.log(`[VIEWER] Viewer launched on port ${response.port}`);
-            default_local_port.value = response.port;
+          response_function: (response: unknown) => {
+            // oxlint-disable-next-line no-unsafe-type-assertion -- response shape is defined by the run_viewer schema.
+            const { port: viewerPort } = response as { port: string };
+            default_local_port.value = viewerPort;
           },
         },
       );
+      return result;
     }
-    async function connect() {
-      console.log("[VIEWER] Connecting to viewer microservice...");
+    async function connect(): Promise<void> {
       await ws_connect();
-      console.log("[VIEWER] Viewer connected successfully");
     }
-    function get_version(schema) {
+    async function get_version(schema: JsonRpcSchema | undefined): Promise<unknown> {
       if (!schema) {
-        return;
+        return undefined;
       }
-      return request(
+      const result = await request(
         {
           schema,
         },
         {
-          response_function: (response) => {
-            version.value = response.microservice_version;
+          response_function: (response: unknown) => {
+            // oxlint-disable-next-line no-unsafe-type-assertion -- response shape is defined by the version schema.
+            const { microservice_version } = response as { microservice_version: string };
+            version.value = microservice_version;
           },
         },
       );
+      return result;
     }
     return {
       default_local_port,

package/app/utils/attributes.ts

@@ -0,0 +1,40 @@
+interface AttributeRangeSource {
+  min_values?: readonly number[];
+  max_values?: readonly number[];
+  min_value?: number;
+  max_value?: number;
+}
+
+interface AttributeRange {
+  min: number;
+  max: number;
+}
+
+export function getAttributeRange(
+  currentAttribute: AttributeRangeSource | undefined | null,
+  compIndex = 0,
+): AttributeRange {
+  if (!currentAttribute) {
+    return { min: 0, max: 1 };
+  }
+
+  const { min_values, max_values, min_value, max_value } = currentAttribute;
+  let min = 0;
+  let max = 1;
+
+  const min_at_index = min_values?.[compIndex];
+  if (min_at_index !== undefined) {
+    min = min_at_index;
+  } else if (compIndex === 0 && min_value !== undefined) {
+    min = min_value;
+  }
+
+  const max_at_index = max_values?.[compIndex];
+  if (max_at_index !== undefined) {
+    max = max_at_index;
+  } else if (compIndex === 0 && max_value !== undefined) {
+    max = max_value;
+  }
+
+  return { min, max };
+}