@lark-apaas/client-toolkit 1.2.28-alpha.71 → 1.2.28-alpha.72

package/lib/components/AppContainer/index.js

@@ -1,5 +1,5 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import react, { Suspense, useEffect, useMemo, useState } from "react";
+import { useEffect, useState } from "react";
 import { ConfigProvider } from "antd";
 import { MiaodaInspector } from "@lark-apaas/miaoda-inspector";
 import zh_CN from "antd/locale/zh_CN";
@@ -10,33 +10,20 @@ import { reportTeaEvent } from "./utils/tea.js";
 import { useAppInfo } from "../../hooks/index.js";
 import { TrackKey } from "../../types/tea.js";
 import { slardar } from "@lark-apaas/internal-slardar";
+import safety from "./safety.js";
 import { getAppId } from "../../utils/getAppId.js";
 import { isNewPathEnabled } from "../../utils/apiPath.js";
 import QueryProvider from "../QueryProvider/index.js";
 import { AuthProvider } from "@lark-apaas/auth-sdk";
 import "../../runtime/index.js";
-const Safety = /*#__PURE__*/ react.lazy(()=>import("./safety.js"));
 const isMiaodaPreview = window.IS_MIAODA_PREVIEW;
-const readAllCssVarColors = ()=>{
+const readCssVarColor = (varName, fallback)=>{
     try {
-        if ('undefined' == typeof document) return {};
-        const styles = getComputedStyle(document.documentElement);
-        const read = (name)=>styles.getPropertyValue(name).trim() || void 0;
-        return {
-            background: read('--background'),
-            destructive: read('--destructive'),
-            primary: read('--primary'),
-            foreground: read('--foreground'),
-            warning: read('--warning'),
-            success: read('--success'),
-            muted: read('--muted'),
-            mutedForeground: read('--muted-foreground'),
-            border: read('--border'),
-            popover: read('--popover'),
-            accent: read('--accent')
-        };
+        if ('undefined' == typeof document) return fallback;
+        const value = getComputedStyle(document.documentElement).getPropertyValue(varName).trim();
+        return value || fallback;
     } catch  {
-        return {};
+        return fallback;
     }
 };
 const appFlags = process.env.APP_FLAGS || {};
@@ -82,17 +69,13 @@ const App = (props)=>{
     }, []);
     const appId = getAppId();
     const permissionApiUrl = isNewPathEnabled() ? `/app/${appId}/__runtime__/api/v1/permissions/roles` : `/spark/app/${appId}/runtime/api/v1/permissions/roles`;
-    const authConfig = useMemo(()=>({
+    return /*#__PURE__*/ jsxs(AuthProvider, {
+        config: {
             enable: enableAuth,
             permissionApi: {
                 url: permissionApiUrl
             }
-        }), [
-        enableAuth,
-        permissionApiUrl
-    ]);
-    return /*#__PURE__*/ jsxs(AuthProvider, {
-        config: authConfig,
+        },
         children: [
             !disableToaster && true !== appFlags.customToaster && /*#__PURE__*/ jsx(Toaster, {}),
             'production' !== process.env.NODE_ENV && /*#__PURE__*/ jsx(MiaodaInspector, {}),
@@ -105,7 +88,19 @@ const App = (props)=>{
 };
 const AppContainer_AppContainer = (props)=>{
     const { children } = props;
-    const [cssColors, setCssColors] = useState(readAllCssVarColors);
+    const [cssColors, setCssColors] = useState(()=>({
+            background: readCssVarColor('--background'),
+            destructive: readCssVarColor('--destructive'),
+            primary: readCssVarColor('--primary'),
+            foreground: readCssVarColor('--foreground'),
+            warning: readCssVarColor('--warning'),
+            success: readCssVarColor('--success'),
+            muted: readCssVarColor('--muted'),
+            mutedForeground: readCssVarColor('--muted-foreground'),
+            border: readCssVarColor('--border'),
+            popover: readCssVarColor('--popover'),
+            accent: readCssVarColor('--accent')
+        }));
     useEffect(()=>{
         if ('production' === process.env.NODE_ENV) return ()=>{};
         const observer = new MutationObserver((mutations)=>{
@@ -124,7 +119,19 @@ const AppContainer_AppContainer = (props)=>{
                     const maxRetries = 10;
                     const retryDelay = 400;
                     const updateColors = ()=>{
-                        const newColors = readAllCssVarColors();
+                        const newColors = {
+                            background: readCssVarColor('--background'),
+                            destructive: readCssVarColor('--destructive'),
+                            primary: readCssVarColor('--primary'),
+                            foreground: readCssVarColor('--foreground'),
+                            warning: readCssVarColor('--warning'),
+                            success: readCssVarColor('--success'),
+                            muted: readCssVarColor('--muted'),
+                            mutedForeground: readCssVarColor('--muted-foreground'),
+                            border: readCssVarColor('--border'),
+                            popover: readCssVarColor('--popover'),
+                            accent: readCssVarColor('--accent')
+                        };
                         setCssColors((currentColors)=>{
                             if (JSON.stringify(currentColors) !== JSON.stringify(newColors)) {
                                 retryCount = 0;
@@ -196,10 +203,7 @@ const AppContainer_AppContainer = (props)=>{
     };
     return /*#__PURE__*/ jsxs(Fragment, {
         children: [
-            /*#__PURE__*/ jsx(Suspense, {
-                fallback: null,
-                children: /*#__PURE__*/ jsx(Safety, {})
-            }),
+            /*#__PURE__*/ jsx(safety, {}),
             /*#__PURE__*/ jsx(QueryProvider, {
                 children: /*#__PURE__*/ jsx(ConfigProvider, {
                     locale: zh_CN,

package/lib/components/AppContainer/safety.js

@@ -1,7 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from "react";
 import { Popover, PopoverContent, PopoverTrigger } from "../ui/popover.js";
+import { getCsrfToken } from "../../utils/getCsrfToken.js";
 import { getAppId } from "../../utils/getAppId.js";
+import { isNewPathEnabled } from "../../utils/apiPath.js";
 import { useIsMobile } from "../../hooks/index.js";
 import { X } from "lucide-react";
 import { Sheet, SheetContent, SheetTrigger } from "../ui/drawer.js";
@@ -11,11 +13,35 @@ const Component = ()=>{
     const [visible, setVisible] = useState(!window.localStorage?.getItem(HasClosedKey));
     const [open, setOpen] = useState(false);
     const isMobile = useIsMobile();
+    const [userinfo, setUserinfo] = useState(null);
+    const [isInternetVisible, setIsInternetVisible] = useState(false);
+    const [showBadge, setShowBadge] = useState(true);
+    const [badgeLoaded, setBadgeLoaded] = useState(false);
     const timeoutRef = useRef(null);
-    const platformData = window.__platform__ ?? {};
-    const tenantName = platformData.tenantName ?? '';
-    const isInternetVisible = platformData.isInternetVisible ?? false;
-    const showBadge = false !== platformData.showBadge;
+    useEffect(()=>{
+        const appId = getAppId();
+        const csrfHeaders = {
+            'X-Suda-Csrf-Token': getCsrfToken()
+        };
+        const tenantInfoUrl = isNewPathEnabled() ? `/app/${appId}/__runtime__/api/v1/studio/tenant_info` : `/spark/b/${appId}/tenant_info`;
+        fetch(tenantInfoUrl, {
+            headers: csrfHeaders
+        }).then((res)=>res.json()).then((data)=>{
+            setUserinfo(data?.data?.tenant_info);
+            setIsInternetVisible(data?.data?.is_internet_visible);
+        }).catch(()=>{});
+        const getPublishedUrl = isNewPathEnabled() ? `/app/${appId}/__runtime__/api/v1/studio/get_published` : `/spark/b/${appId}/get_published`;
+        fetch(getPublishedUrl, {
+            headers: csrfHeaders
+        }).then((res)=>res.json()).then((data)=>{
+            const badge = data?.data?.app_info?.show_badge;
+            setShowBadge(false !== badge);
+        }).catch(()=>{
+            setShowBadge(true);
+        }).finally(()=>{
+            setBadgeLoaded(true);
+        });
+    }, []);
     useEffect(()=>{
         if (isMobile) {
             const link = document.createElement('link');
@@ -28,6 +54,7 @@ const Component = ()=>{
         isMobile
     ]);
     if ('production' !== process.env.NODE_ENV) return null;
+    if (!badgeLoaded) return null;
     if (!showBadge) return null;
     if (!visible) return null;
     if (isMobile) return /*#__PURE__*/ jsxs(Sheet, {
@@ -87,7 +114,7 @@ const Component = ()=>{
                                                 /*#__PURE__*/ jsx("p", {
                                                     className: "shrink-0 min-w-[96px] m-0! text-[#646A73] text-sm",
                                                     children: t('safety.tenant.operated', {
-                                                        name: tenantName
+                                                        name: userinfo?.name ?? ''
                                                     })
                                                 })
                                             ]
@@ -206,7 +233,7 @@ const Component = ()=>{
                                                 /*#__PURE__*/ jsx("p", {
                                                     className: "shrink-0 min-w-[96px] m-0! text-[#a6a6a6]",
                                                     children: t('safety.tenant.operated', {
-                                                        name: tenantName
+                                                        name: userinfo?.name ?? ''
                                                     })
                                                 })
                                             ]

package/lib/utils/getInitialInfo.js

@@ -24,24 +24,10 @@ async function getAppPublished() {
         console.error('Error fetching published app info:', error);
     }
 }
-function getPreloadedInfo() {
-    try {
-        const platformData = window.__platform__?.appPublished;
-        if (platformData && 'object' == typeof platformData) return platformData;
-    } catch  {}
-}
 let initialInfo;
 let pendingPromise = null;
 function getInitialInfo(refresh = false) {
     if (initialInfo && !refresh) return Promise.resolve(initialInfo);
-    if (!initialInfo && !refresh) {
-        const preloaded = getPreloadedInfo();
-        if (preloaded) {
-            initialInfo = preloaded;
-            if (initialInfo) window._bucket_id = initialInfo.app_runtime_extra?.bucket?.default_bucket_id;
-            return Promise.resolve(initialInfo);
-        }
-    }
     if (pendingPromise && !refresh) return pendingPromise;
     pendingPromise = getAppPublished().then((info)=>{
         initialInfo = info;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lark-apaas/client-toolkit",
-  "version": "1.2.28-alpha.71",
+  "version": "1.2.28-alpha.72",
   "types": "./lib/index.d.ts",
   "main": "./lib/index.js",
   "files": [