@arcblock/ux 1.16.19 → 1.16.20

package/lib/NFTDisplay/index.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.getNFTData = getNFTData;
 exports.default = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
@@ -50,6 +51,17 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
 
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
+/**
+ * 从 assetState 中获取 nft data, 兼容新旧两种类型的数据结构, 建议将该方法的返回值传入 NFTDisplay 组件的 data prop
+ * - 旧: assetState.data.value (.credentialSubject.display)
+ * - 新: assetState.display
+ */
+function getNFTData(assetState) {
+  var _assetState$data;
+
+  return (assetState === null || assetState === void 0 ? void 0 : assetState.display) || (assetState === null || assetState === void 0 ? void 0 : (_assetState$data = assetState.data) === null || _assetState$data === void 0 ? void 0 : _assetState$data.value);
+}
+
 function fromBase64(v) {
   if (typeof v !== 'string') {
     throw new Error('fromBase64 requires input to be a string');
@@ -111,8 +123,9 @@ function NFTDisplay(_ref) {
 
     const {
       vcId
-    } = parsed.current;
-    const display = (0, _get.default)(parsed.current, 'credentialSubject.display');
+    } = parsed.current; // 需要兼容新旧两种类型的数据结构, nft data 有 credentialSubject 属性, 说明是旧 nft data, 否则是新 nft data
+
+    const display = parsed.current.credentialSubject ? (0, _get.default)(parsed.current, 'credentialSubject.display') : parsed.current;
     const {
       content,
       type

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@arcblock/ux",
-  "version": "1.16.19",
+  "version": "1.16.20",
   "description": "Common used react components for arcblock products",
   "keywords": [
     "react",
@@ -53,10 +53,10 @@
     "react": ">=16.12.0",
     "react-ga": "^2.7.0"
   },
-  "gitHead": "88965cae9c1b0273e085c8779672cedef3abd633",
+  "gitHead": "d24d15a8cb22c578484e9017b85c0cb2debd1f43",
   "dependencies": {
-    "@arcblock/icons": "^1.16.19",
-    "@arcblock/react-hooks": "^1.16.19",
+    "@arcblock/icons": "^1.16.20",
+    "@arcblock/react-hooks": "^1.16.20",
     "@babel/plugin-syntax-dynamic-import": "^7.8.3",
     "@material-ui/core": "^4.12.3",
     "@material-ui/icons": "4.11.2",

package/src/NFTDisplay/index.js

@@ -12,6 +12,15 @@ import InlineSvgEmbedder from './svg-embedder/inline-svg';
 import DefaultLoading from './loading';
 import DefaultBrokenImage from './broken';
 
+/**
+ * 从 assetState 中获取 nft data, 兼容新旧两种类型的数据结构, 建议将该方法的返回值传入 NFTDisplay 组件的 data prop
+ * - 旧: assetState.data.value (.credentialSubject.display)
+ * - 新: assetState.display
+ */
+export function getNFTData(assetState) {
+  return assetState?.display || assetState?.data?.value;
+}
+
 function fromBase64(v) {
   if (typeof v !== 'string') {
     throw new Error('fromBase64 requires input to be a string');
@@ -66,7 +75,10 @@ function NFTDisplay({
       // console.log('[debug] parse data')
     }
     const { vcId } = parsed.current;
-    const display = get(parsed.current, 'credentialSubject.display');
+    // 需要兼容新旧两种类型的数据结构, nft data 有 credentialSubject 属性, 说明是旧 nft data, 否则是新 nft data
+    const display = parsed.current.credentialSubject
+      ? get(parsed.current, 'credentialSubject.display')
+      : parsed.current;
     const { content, type } = display;
     const isUrlType = type === 'url';