@arcblock/ux 2.12.6 → 2.12.8

package/lib/BlockletContext/index.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useMemoizedFn, useAsyncEffect } from 'ahooks';
 import { createContext, useContext, useState } from 'react';
+import { getBlockletData } from '../Util/federated';
 const BlockletContext = /*#__PURE__*/createContext(null);
 const {
   Provider,
@@ -12,19 +13,16 @@ function BlockletProvider({
   loading = null
 }) {
   const [blockletData, setBlockletData] = useState(null);
-  const getBlockleData = useMemoizedFn(async () => {
+  const getBlockleDataWithCache = useMemoizedFn(async () => {
     if (!baseUrl || window.location.href.startsWith(baseUrl)) {
       throw new Error('no blocklet data');
     }
-    const url = new URL('__blocklet__.js', baseUrl);
-    url.searchParams.set('type', 'json');
-    const res = await fetch(url.href);
-    const jsonData = await res.json();
+    const jsonData = await getBlockletData(baseUrl);
     return jsonData;
   });
   useAsyncEffect(async () => {
     try {
-      const data = await getBlockleData();
+      const data = await getBlockleDataWithCache();
       setBlockletData(data);
     } catch {
       // NOTICE: 如果获取指定 blockletData 失败，则使用 window.blocklet

package/lib/Util/federated.d.ts

@@ -61,4 +61,4 @@ export declare function getApps(blocklet: Blocklet): ({
     appPid?: undefined;
     version?: undefined;
 })[];
-export declare function getBlockletData(appUrl: string): Promise<any>;
+export declare function getBlockletData(appUrl: string, force?: boolean): Promise<Blocklet | null>;

package/lib/Util/federated.js

@@ -1,4 +1,5 @@
 import isEmpty from 'lodash/isEmpty';
+const cacheBlockletData = {};
 export function getMaster(blocklet = window.blocklet) {
   const federated = blocklet?.settings?.federated || {};
   return federated.master;
@@ -83,12 +84,16 @@ export function getApps(blocklet) {
   // NOTICE: masterApp 应该排在前面
   return appList.reverse();
 }
-export async function getBlockletData(appUrl) {
+export async function getBlockletData(appUrl, force = false) {
+  if (!force && cacheBlockletData[appUrl]) {
+    return cacheBlockletData[appUrl];
+  }
   try {
     const url = new URL('__blocklet__.js', appUrl);
     url.searchParams.set('type', 'json');
     const res = await fetch(url.href);
     const jsonData = await res.json();
+    cacheBlockletData[appUrl] = jsonData;
     return jsonData;
   } catch (err) {
     console.error(`Failed to get blocklet data: ${appUrl}`, err);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "2.12.6",
+  "version": "2.12.8",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -68,12 +68,12 @@
     "react": ">=18.2.0",
     "react-router-dom": ">=6.22.3"
   },
-  "gitHead": "7b92b4bc17fc44c8c331c61a4e41da117340329a",
+  "gitHead": "4cfeed31d56495f1368b96adfae11f938e68ef46",
   "dependencies": {
     "@arcblock/did-motif": "^1.1.13",
-    "@arcblock/icons": "^2.12.6",
-    "@arcblock/nft-display": "^2.12.6",
-    "@arcblock/react-hooks": "^2.12.6",
+    "@arcblock/icons": "^2.12.8",
+    "@arcblock/nft-display": "^2.12.8",
+    "@arcblock/react-hooks": "^2.12.8",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@fontsource/inter": "^5.0.16",
     "@fontsource/ubuntu-mono": "^5.0.18",

package/src/BlockletContext/index.tsx

@@ -1,6 +1,7 @@
 import { useMemoizedFn, useAsyncEffect } from 'ahooks';
 import { createContext, useContext, useState } from 'react';
 import type { Blocklet } from '../type';
+import { getBlockletData } from '../Util/federated';
 
 const BlockletContext = createContext<Blocklet | null>(null);
 
@@ -19,21 +20,17 @@ function BlockletProvider({
   loading?: React.ReactNode;
 }) {
   const [blockletData, setBlockletData] = useState<Blocklet | null>(null);
-  const getBlockleData = useMemoizedFn(async () => {
+  const getBlockleDataWithCache = useMemoizedFn(async () => {
     if (!baseUrl || window.location.href.startsWith(baseUrl)) {
       throw new Error('no blocklet data');
     }
-
-    const url = new URL('__blocklet__.js', baseUrl);
-    url.searchParams.set('type', 'json');
-    const res = await fetch(url.href);
-    const jsonData = await res.json();
-    return jsonData as Blocklet;
+    const jsonData = await getBlockletData(baseUrl);
+    return jsonData;
   });
 
   useAsyncEffect(async () => {
     try {
-      const data = await getBlockleData();
+      const data = await getBlockleDataWithCache();
       setBlockletData(data);
     } catch {
       // NOTICE: 如果获取指定 blockletData 失败，则使用 window.blocklet

package/src/Util/federated.ts

@@ -1,5 +1,7 @@
 import isEmpty from 'lodash/isEmpty';
 
+const cacheBlockletData: Record<string, any> = {};
+
 export function getMaster(blocklet = window.blocklet) {
   const federated = blocklet?.settings?.federated || {};
   return federated.master;
@@ -95,12 +97,16 @@ export function getApps(blocklet: Blocklet) {
   return appList.reverse();
 }
 
-export async function getBlockletData(appUrl: string) {
+export async function getBlockletData(appUrl: string, force = false): Promise<Blocklet | null> {
+  if (!force && cacheBlockletData[appUrl]) {
+    return cacheBlockletData[appUrl];
+  }
   try {
     const url = new URL('__blocklet__.js', appUrl);
     url.searchParams.set('type', 'json');
     const res = await fetch(url.href);
     const jsonData = await res.json();
+    cacheBlockletData[appUrl] = jsonData;
     return jsonData;
   } catch (err) {
     console.error(`Failed to get blocklet data: ${appUrl}`, err);