Feat/use consola

.oxlintrc.json

@@ -33,7 +33,6 @@
       }
     ],
     "eslint/max-statements": ["warn", 20],
-    "eslint/no-console": "warn", // Disable for debugging. Disable later to not have browser logs
     "eslint/no-magic-numbers": [
       "error",
       {

app/components/InfraConnected.vue

@@ -2,7 +2,6 @@
 import { useInfraStore } from "@ogw_front/stores/infra";
 
 const infraStore = useInfraStore();
-console.log("TEST", { infraStore });
 </script>
 
 <template>

app/components/Viewer/ContextMenu/InfoCard.vue

@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import GlassCard from "@ogw_front/components/GlassCard.vue";
+import { consola } from "consola";
 import { middleTruncate } from "@ogw_front/utils/string";
 import { useCopyToClipboard } from "@ogw_front/composables/copy_to_clipboard";
 import { useDataStore } from "@ogw_front/stores/data";
@@ -110,7 +111,7 @@ async function copyId(targetId: string | undefined): Promise<void> {
     await copy(targetId);
     copiedId.value = targetId;
   } catch (error) {
-    console.error("Failed to copy ID:", error);
+    consola.error("Failed to copy ID:", error);
   }
 }
 

app/components/Viewer/ObjectTree/Views/GlobalObjects.vue

@@ -4,6 +4,7 @@ import type { DisplayItem } from "@ogw_front/composables/virtual_tree";
 import ObjectTreeControls from "@ogw_front/components/Viewer/ObjectTree/Base/Controls.vue";
 import ObjectTreeItemLabel from "@ogw_front/components/Viewer/ObjectTree/Base/ItemLabel.vue";
 import { compareSelections } from "@ogw_front/utils/treeview";
+import { consola } from "consola";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useDataStyleStore } from "@ogw_front/stores/data_style";
 import { useHoverhighlight } from "@ogw_front/composables/hover_highlight";
@@ -105,7 +106,7 @@ watch(
           const hasCollections = await dataStore.hasCollectionComponents(model.id);
           hasCollectionsMap[model.id] = hasCollections;
         } catch (error) {
-          console.error("Failed to check collections", error);
+          consola.error("Failed to check collections", error);
         }
       }
     });

app/composables/hover_highlight.ts

@@ -1,4 +1,5 @@
 import type { JsonRpcSchema } from "@ogw_shared/utils/types";
+import { consola } from "consola";
 import { useDataStore } from "@ogw_front/stores/data";
 import { useViewerStore } from "@ogw_front/stores/viewer";
 import vtk_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json";
@@ -60,7 +61,7 @@ export function useHoverhighlight(): {
       try {
         await viewerStore.request({ schema, params });
       } catch (error) {
-        console.error(`Highlight failed for ${type} ${id}:`, error);
+        consola.error(`Highlight failed for ${type} ${id}:`, error);
       }
     }
 
@@ -95,7 +96,7 @@ export function useHoverhighlight(): {
     try {
       await viewerStore.request(request);
     } catch (error) {
-      console.error(`Unhighlight failed for ${type} ${id}:`, error);
+      consola.error(`Unhighlight failed for ${type} ${id}:`, error);
     }
   }
 

app/composables/project_manager.ts

@@ -46,7 +46,6 @@ function isFileDownloadData(
 }
 
 async function exportProject(): Promise<{ result: unknown }> {
-  console.log("[export triggered]");
   const appStore = useAppStore();
   const backStore = useBackStore();
   const feedbackStore = useFeedbackStore();

app/composables/run_function_when_microservices_connected.ts

@@ -3,15 +3,13 @@ import { useInfraStore } from "@ogw_front/stores/infra";
 export function runFunctionWhenMicroservicesConnected(functionToRun: () => void): void {
   const infraStore = useInfraStore();
   const { microservices_connected } = storeToRefs(infraStore);
-  console.log("inside microservices_connected", microservices_connected.value);
   if (microservices_connected.value) {
     functionToRun();
   }
   watch(
     microservices_connected,
     (value) => {
       if (value) {
-        console.log("watch microservices_connected", value);
         functionToRun();
       }
     },

app/composables/use_adaptive_styles.ts

@@ -1,4 +1,5 @@
 import type { MaybeComputedElementRef } from "@vueuse/core";
+import { consola } from "consola";
 import { useHybridViewerStore } from "@ogw_front/stores/hybrid_viewer";
 import { useTreeviewStore } from "@ogw_front/stores/treeview";
 
@@ -156,7 +157,7 @@ export function useAdaptiveStyles(
       try {
         await forceRefresh();
       } catch (error) {
-        console.error("forceRefresh failed:", error);
+        consola.error("forceRefresh failed:", error);
       }
     });
   }

app/composables/use_quick_colormap.ts

@@ -1,3 +1,4 @@
+import { consola } from "consola";
 import { useViewerStore } from "@ogw_front/stores/viewer";
 import viewer_schemas from "@geode/opengeodeweb-viewer/opengeodeweb_viewer_schemas.json";
 
@@ -46,7 +47,7 @@ export function useQuickColormap(): {
         return true;
       }
     } catch (error) {
-      console.error("Error picking colormap:", error);
+      consola.error("Error picking colormap:", error);
     }
     return false;
   }

app/plugins/consola_plain_logs.client.ts

@@ -0,0 +1,46 @@
+import { type LogObject, consola } from "consola";
+
+const WARN_LEVEL = 1;
+
+function consoleMethod(level: number): "error" | "warn" | "log" {
+  if (level < WARN_LEVEL) {
+    return "error";
+  }
+  if (level === WARN_LEVEL) {
+    return "warn";
+  }
+  return "log";
+}
+
+function formatArgument(argument: unknown): string {
+  if (typeof argument === "string") {
+    return argument;
+  }
+  if (argument instanceof Error) {
+    return argument.stack ?? argument.message;
+  }
+  try {
+    return JSON.stringify(argument) ?? String(argument);
+  } catch {
+    return String(argument);
+  }
+}
+
+function plainLog(logObject: LogObject): void {
+  const line = `[${logObject.type}] ${logObject.args.map(formatArgument).join(" ")}`;
+  // Consola's browser reporter emits %c CSS that Electron and Playwright forward unformatted, so CI logs get this plain line instead.
+  // oxlint-disable-next-line no-console
+  console[consoleMethod(logObject.level)](line);
+}
+
+// Enabled at runtime through NUXT_PUBLIC_PLAIN_LOGS=true (set by the e2e harness on CI) rather than at build time, so release builds keep the styled DevTools output.
+export default defineNuxtPlugin({
+  name: "consola-plain-logs",
+  enforce: "pre",
+  setup() {
+    // Nitro parses NUXT_PUBLIC_* env overrides, so "true" arrives here as the boolean true
+    if (useRuntimeConfig().public.PLAIN_LOGS) {
+      consola.setReporters([{ log: plainLog }]);
+    }
+  },
+});

app/stores/api.ts

@@ -1,5 +1,6 @@
 import type { RequestHandlers } from "@ogw_shared/utils/types";
 import { api_fetch } from "@ogw_internal/utils/api_fetch";
+import { consola } from "consola";
 
 interface ApiSchema {
   $id: string;
@@ -34,7 +35,7 @@ export const useAPIStore = defineStore("api", () => {
     }: { schema: ApiSchema; params?: Record<string, unknown>; headers?: Record<string, string> },
     callbacks: ApiCallbacks = {},
   ): Promise<TResult> {
-    console.log("[API] Request:", schema.$id);
+    consola.info("[API] Request:", schema.$id);
     const start = Date.now();
 
     const result = await api_fetch(
@@ -43,7 +44,7 @@ export const useAPIStore = defineStore("api", () => {
       {
         ...callbacks,
         response_function: async (response: unknown) => {
-          console.log(
+          consola.info(
             "[API] Request completed:",
             schema.$id,
             "in",

app/stores/app.ts

@@ -1,3 +1,5 @@
+import { consola } from "consola";
+
 // Local imports
 import { getRestApiPort, getRestApiProtocol, isCloudMode } from "@ogw_front/utils/stores.js";
 import { Status } from "@ogw_front/utils/status";
@@ -122,7 +124,7 @@ export const useAppStore = defineStore("app", () => {
     );
 
     if (missingStoreIds.length > 0) {
-      console.warn(`Stores not found in snapshot: ${missingStoreIds.join(", ")}`);
+      consola.warn(`Stores not found in snapshot: ${missingStoreIds.join(", ")}`);
     }
   }
 

app/stores/app_helpers/extension.ts

@@ -1,3 +1,4 @@
+import { consola } from "consola";
 import { killExtension } from "@ogw_front/utils/extension.js";
 import { useInfraStore } from "@ogw_front/stores/infra";
 
@@ -89,7 +90,7 @@ export function useAppExtensions(): {
       const extensionId = extensionModule.metadata.id;
 
       if (loadedExtensions.value.has(extensionId)) {
-        console.warn(`[AppStore] Extension "${extensionId}" is already loaded`);
+        consola.warn(`[AppStore] Extension "${extensionId}" is already loaded`);
         throw new Error(`Extension "${extensionId}" is already loaded.`);
       }
 
@@ -114,10 +115,10 @@ export function useAppExtensions(): {
       };
       loadedExtensions.value.set(extensionId, extensionData);
 
-      console.log(`[AppStore] Extension loaded successfully: ${extensionId}`);
+      consola.info(`[AppStore] Extension loaded successfully: ${extensionId}`);
       return extensionModule;
     } catch (error) {
-      console.error(`[AppStore] Failed to load extension from ${path}:`, error);
+      consola.error(`[AppStore] Failed to load extension from ${path}:`, error);
       throw error;
     }
   }
@@ -127,13 +128,13 @@ export function useAppExtensions(): {
   }
 
   async function unloadExtension(extensionId: string): Promise<boolean> {
-    console.log(`[AppStore] Unloading extension: ${extensionId}`);
+    consola.info(`[AppStore] Unloading extension: ${extensionId}`);
     const infraStore = useInfraStore();
     infraStore.unregister_microservice(extensionId);
     await killExtension(extensionId);
 
     loadedExtensions.value.delete(extensionId);
-    console.log(`[AppStore] Extension unloaded: ${extensionId}`);
+    consola.info(`[AppStore] Extension unloaded: ${extensionId}`);
     return true;
   }
 
@@ -143,7 +144,7 @@ export function useAppExtensions(): {
       return false;
     }
     extensionData.enabled = !extensionData.enabled;
-    console.log(
+    consola.info(
       `[AppStore] Extension ${extensionData.enabled ? "enabled" : "disabled"}: ${extensionId}`,
     );
     return extensionData.enabled;
@@ -155,7 +156,7 @@ export function useAppExtensions(): {
       return false;
     }
     extensionData.enabled = enabled;
-    console.log(`[AppStore] Extension ${enabled ? "enabled" : "disabled"}: ${extensionId}`);
+    consola.info(`[AppStore] Extension ${enabled ? "enabled" : "disabled"}: ${extensionId}`);
     return true;
   }
 

app/stores/treeview.ts

@@ -1,3 +1,5 @@
+import { consola } from "consola";
+
 // 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";
@@ -108,8 +110,7 @@ export const useTreeviewStore = defineStore("treeview", () => {
         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);
+      consola.error("Failed to load treeview config:", error);
     }
   }
   // oxlint-disable-next-line typescript/no-floating-promises -- loadConfig catches its own errors internally.

app/utils/cloud.ts

@@ -1,3 +1,5 @@
+import { consola } from "consola";
+
 const CLOUD_URL_PARAM = "cloud_url";
 const CLOUD_RUN_HOST_SUFFIX = ".run.app";
 
@@ -12,11 +14,11 @@ function getCloudUrlParam(): string | undefined {
   try {
     ({ hostname } = new URL(url_string));
   } catch {
-    console.warn(`[Cloud] Invalid ${CLOUD_URL_PARAM}:`, value);
+    consola.warn(`[Cloud] Invalid ${CLOUD_URL_PARAM}:`, value);
     return undefined;
   }
   if (!hostname.endsWith(CLOUD_RUN_HOST_SUFFIX)) {
-    console.warn(`[Cloud] Ignoring ${CLOUD_URL_PARAM}, not a Cloud Run host:`, hostname);
+    consola.warn(`[Cloud] Ignoring ${CLOUD_URL_PARAM}, not a Cloud Run host:`, hostname);
     return undefined;
   }
   return hostname;

app/utils/extension.ts

@@ -5,6 +5,7 @@
 // Local imports
 import type { RegisterableStore, useAppStore } from "@ogw_front/stores/app";
 import type { Microservice } from "@ogw_front/stores/infra";
+import { consola } from "consola";
 import { isCloudMode } from "@ogw_front/utils/stores";
 import opengeodeweb_front_schemas from "@geode/opengeodeweb-front/opengeodeweb_front_schemas.json" with { type: "json" };
 
@@ -92,18 +93,18 @@ async function registerRunningExtensions(): Promise<RegisteredExtension[]> {
       });
       const blobUrl = URL.createObjectURL(blob);
       const extensionModule = await appStore.loadExtension(blobUrl, port);
-      console.log("[ExtensionManager] Extension loaded:", id);
+      consola.info("[ExtensionManager] Extension loaded:", id);
       const storeFactory = extensionModule.metadata.store;
       const store = storeFactory();
       appStore.registerStore(store);
-      console.log("[ExtensionManager] Store registered:", store.$id);
+      consola.info("[ExtensionManager] Store registered:", store.$id);
       // Extension-provided stores are expected to satisfy the fuller
       // Microservice contract (connect, etc.) even though the loader's own
       // RegisterableStore type only models what app.ts itself needs.
       if (isMicroservice(store)) {
         infraStore.register_microservice(store);
       } else {
-        console.warn("[ExtensionManager] Store does not implement Microservice:", store.$id);
+        consola.warn("[ExtensionManager] Store does not implement Microservice:", store.$id);
       }
       return {
         name,
@@ -127,10 +128,10 @@ async function importExtensionURL(url: DownloadExtensionParams): Promise<Registe
 async function unloadExtension(extensionId: string): Promise<boolean> {
   const { useAppStore } = await import("@ogw_front/stores/app");
   const appStore = useAppStore();
-  console.log("[ExtensionManager] Unloading extension:", extensionId);
+  consola.info("[ExtensionManager] Unloading extension:", extensionId);
   const extensionData = appStore.getExtension(extensionId);
   if (!extensionData) {
-    console.warn("[ExtensionManager] Extension not found:", extensionId);
+    consola.warn("[ExtensionManager] Extension not found:", extensionId);
     return false;
   }
 
@@ -146,7 +147,7 @@ async function unloadExtension(extensionId: string): Promise<boolean> {
 
   // Unload from AppStore
   await appStore.unloadExtension(extensionId);
-  console.log("[ExtensionManager] Extension unloaded:", extensionId);
+  consola.info("[ExtensionManager] Extension unloaded:", extensionId);
   return true;
 }
 

app/utils/import_workflow.ts

@@ -1,6 +1,7 @@
 // oxlint-disable promise/prefer-await-to-then
 // Third party imports
 import back_schemas from "@geode/opengeodeweb-back/opengeodeweb_back_schemas.json";
+import { consola } from "consola";
 
 // Local imports
 import { type NewDataItem, useDataStore } from "@ogw_front/stores/data";
@@ -108,7 +109,7 @@ async function importWorkflow(files: readonly FileToImport[]): Promise<string[]>
 
 // NewDataItem has mutable array fields (mesh_components, collection_components), so a readonly array of it can't satisfy prefer-readonly-parameter-types deeply; left unfixed (same pattern as app/plugins/auto_store_register.ts).
 async function importWorkflowFromSnapshot(items: readonly NewDataItem[]): Promise<string[]> {
-  console.log("[importWorkflowFromSnapshot] start", { count: items?.length });
+  consola.debug("[importWorkflowFromSnapshot] start", { count: items?.length });
   const hybridViewerStore = useHybridViewerStore();
   const chunk_size = 5;
   const chunks: NewDataItem[][] = [];
@@ -132,7 +133,7 @@ async function importWorkflowFromSnapshot(items: readonly NewDataItem[]): Promis
   }
   await processChunk(0);
   await hybridViewerStore.remoteRender();
-  console.log("[importWorkflowFromSnapshot] done", {
+  consola.debug("[importWorkflowFromSnapshot] done", {
     ids,
   });
   return ids;