@lark-apaas/client-toolkit 1.1.35-alpha.0 → 1.1.35-alpha.10

package/lib/components/AppContainer/index.js

@@ -17,8 +17,10 @@ import safety from "./safety.js";
 import { getAppId } from "../../utils/getAppId.js";
 import { ServerLogPoller } from "../../server-log/index.js";
 import QueryProvider from "../QueryProvider/index.js";
+import { initObservable } from "./utils/observable.js";
 registerDayjsPlugins();
 initAxiosConfig();
+initObservable();
 const isMiaodaPreview = window.IS_MIAODA_PREVIEW;
 const readCssVarColor = (varName, fallback)=>{
     try {

package/lib/components/AppContainer/utils/observable.d.ts

@@ -0,0 +1 @@
+export declare const initObservable: () => void;

package/lib/components/AppContainer/utils/observable.js

@@ -0,0 +1,13 @@
+import { AppEnv, observable } from "@lark-apaas/observable-web";
+import { getAppId } from "../../../utils/getAppId.js";
+const initObservable = ()=>{
+    observable.start({
+        serviceName: "app",
+        env: 'development' === process.env.NODE_ENV ? AppEnv.Dev : AppEnv.Prod,
+        collectorUrl: {
+            log: `/spark/app/${getAppId(window.location.pathname)}/runtime/api/v1/observability/logs/collect`,
+            metric: `/spark/app/${getAppId(window.location.pathname)}/runtime/api/v1/observability/metrics/collect`
+        }
+    });
+};
+export { initObservable };

package/lib/hooks/useAppInfo.js

@@ -21,21 +21,21 @@ const useAppInfo = ()=>{
                 if (meta) meta.content = info.avatar;
             }
             if (info.description) {
-                const ogMeta = document.querySelector("meta[property='og:description']");
-                if (ogMeta) ogMeta.content = info.description;
-                const meta = document.querySelector("meta[name='description']");
+                const meta = document.querySelector("meta[property='og:description']");
                 if (meta) meta.content = info.description;
+                const metaDom = document.querySelector("meta[name='description']");
+                if (metaDom) metaDom.content = info.description;
             }
         };
-        const handleMetaInfoChanged = async (info)=>{
-            if (!info) info = await getAppInfo(true);
+        const handleMetaInfoChanged = async (info, refresh = true)=>{
+            if (!info) info = await getAppInfo(refresh);
             updateDomInfo(info);
             setAppInfo((prev)=>({
                     ...prev,
                     ...info
                 }));
         };
-        handleMetaInfoChanged();
+        handleMetaInfoChanged(null, false);
         const onUpdate = (e)=>{
             const info = e.detail;
             handleMetaInfoChanged(info);

package/lib/logger/logger.js

@@ -1,5 +1,7 @@
+import { observable } from "@lark-apaas/observable-web";
 import { interceptors } from "./selected-logs.js";
 import { interceptErrors } from "./intercept-global-error.js";
+import { mapLogLevel, processLogParams } from "../utils/safeStringify.js";
 const LOG_LEVELS = [
     'debug',
     'info',
@@ -45,18 +47,35 @@ let logger = {
     },
     info (message, ...args) {
         if (shouldLog('info')) console.log(...getFormattedPrefix('info'), message, ...args);
+        if ('production' === process.env.NODE_ENV) observable.log('INFO', processLogParams([
+            message,
+            ...args
+        ]));
     },
     warn (message, ...args) {
         if (shouldLog('warn')) console.log(...getFormattedPrefix('warn'), message, ...args);
+        if ('production' === process.env.NODE_ENV) observable.log('WARN', processLogParams([
+            message,
+            ...args
+        ]));
     },
     error (message, ...args) {
         if (shouldLog('error')) console.error(...getFormattedPrefix('error'), message, ...args);
+        if ('production' === process.env.NODE_ENV) observable.log('ERROR', processLogParams([
+            message,
+            ...args
+        ]));
     },
     success (message, ...args) {
         if (shouldLog('success')) console.log(...getFormattedPrefix('success'), message, ...args);
+        if ('production' === process.env.NODE_ENV) observable.log('INFO', processLogParams([
+            message,
+            ...args
+        ]));
     },
     log ({ level, args }) {
         if (shouldLog(level)) console.log(...getFormattedPrefix(level), ...args);
+        if ('production' === process.env.NODE_ENV && "debug" !== level) observable.log(mapLogLevel(level), processLogParams(args));
     }
 };
 if ('production' !== process.env.NODE_ENV) window.__RUNTIME_LOGGER__ = {

package/lib/utils/safeStringify.d.ts

@@ -0,0 +1,4 @@
+import { LogLevel } from "../logger/log-types";
+export declare function safeStringify(obj: unknown): string;
+export declare function processLogParams(args: unknown[]): string;
+export declare function mapLogLevel(level: LogLevel): "INFO" | "WARN" | "ERROR";

package/lib/utils/safeStringify.js

@@ -0,0 +1,42 @@
+function safeStringify(obj) {
+    const seen = new Set();
+    try {
+        return JSON.stringify(obj, (key, value)=>{
+            if ('object' == typeof value && null !== value) {
+                if (seen.has(value)) return '[Circular]';
+                seen.add(value);
+            }
+            if ('bigint' == typeof value) return value.toString();
+            if (value instanceof Date) return value.toISOString();
+            if (value instanceof Map) return Object.fromEntries(value);
+            if (value instanceof Set) return Array.from(value);
+            if (void 0 === value) return 'undefined';
+            if ('symbol' == typeof value) return value.toString();
+            return value;
+        });
+    } catch  {
+        return '';
+    } finally{
+        seen.clear();
+    }
+}
+function processLogParams(args) {
+    if (1 === args.length) return safeStringify(args[0]);
+    const obj = {};
+    for(let i = 0; i < args.length; i++)obj[i.toString()] = args[i];
+    return safeStringify(obj);
+}
+function mapLogLevel(level) {
+    switch(level){
+        case "error":
+            return "ERROR";
+        case "info":
+        case "success":
+            return "INFO";
+        case "warn":
+            return "WARN";
+        default:
+            return "INFO";
+    }
+}
+export { mapLogLevel, processLogParams, safeStringify };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lark-apaas/client-toolkit",
-  "version": "1.1.35-alpha.0",
+  "version": "1.1.35-alpha.10",
   "types": "./lib/index.d.ts",
   "main": "./lib/index.js",
   "files": [
@@ -81,7 +81,8 @@
     "@ant-design/colors": "^7.2.1",
     "@ant-design/cssinjs": "^1.24.0",
     "@data-loom/js": "^0.4.3",
-    "@lark-apaas/miaoda-inspector": "^1.0.7",
+    "@lark-apaas/miaoda-inspector": "^1.0.8",
+    "@lark-apaas/observable-web": "^1.0.0-alpha.10",
     "@radix-ui/react-avatar": "^1.1.10",
     "@radix-ui/react-popover": "^1.1.15",
     "@radix-ui/react-slot": "^1.2.3",
@@ -155,4 +156,4 @@
     "react-router-dom": ">=6.26.2",
     "styled-jsx": ">=5.0.0"
   }
-}
+}