@abtnode/ux 1.16.17-beta-d282d63e → 1.16.17-beta-1cab4b42

package/lib/blocklet/publish/create-release.js

@@ -18,17 +18,19 @@ var _Breadcrumbs = _interopRequireDefault(require("@mui/material/Breadcrumbs"));
 var _Box = _interopRequireDefault(require("@mui/material/Box"));
 var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
 var _DeleteOutline = _interopRequireDefault(require("@mui/icons-material/DeleteOutline"));
+var _InputAdornment = _interopRequireDefault(require("@mui/material/InputAdornment"));
 var _context = require("@arcblock/ux/lib/Locale/context");
 var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
 var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
-var _Tabs = _interopRequireDefault(require("@arcblock/ux/lib/Tabs"));
 var _Empty = _interopRequireDefault(require("@arcblock/ux/lib/Empty"));
+var _Tabs = _interopRequireDefault(require("@arcblock/ux/lib/Tabs"));
 var _constant = require("@blocklet/constant");
 var _constant2 = require("@abtnode/constant");
 var _bundleAvatar = _interopRequireDefault(require("../bundle-avatar"));
 var _node = require("../../contexts/node");
 var _blocklet = require("../../contexts/blocklet");
 var _emptySpinner = _interopRequireDefault(require("../../empty-spinner"));
+var _util = require("../../util");
 var _resource = _interopRequireDefault(require("./resource"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
@@ -41,10 +43,49 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typ
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function _objectDestructuringEmpty(obj) { if (obj == null) throw new TypeError("Cannot destructure " + obj); }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } // eslint-disable-next-line import/no-unresolved
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const allowedFileTypes = ['image/*', '.jpg', '.jpeg', '.png', '.gif', '.svg'];
+const maxFileSize = 1024 * 1024 * 10; // 10 MB
+
+// eslint-disable-next-line import/no-unresolved
 const UploaderComponent = /*#__PURE__*/(0, _react.lazy)(() => Promise.resolve().then(() => _interopRequireWildcard(require('@blocklet/uploader/react'))).then(res => ({
   default: res.Uploader
 })));
+const validateParams = (params, status, t) => {
+  const errors = [];
+  if (!params.blockletTitle) {
+    errors.push({
+      param: 'blockletTitle',
+      message: t('blocklet.publish.errorTip.noTitle')
+    });
+  }
+  if (!params.blockletVersion) {
+    errors.push({
+      param: 'blockletVersion',
+      message: t('blocklet.publish.errorTip.noVersion')
+    });
+  } else if (!_semver.default.valid(params.blockletVersion)) {
+    errors.push({
+      param: 'blockletVersion',
+      message: 'Invalid Blocklet Version'
+    });
+  }
+  if (status === _constant.PROJECT.RELEASE_STATUS.published) {
+    if (!params.blockletDescription) {
+      errors.push({
+        param: 'blockletDescription',
+        message: t('blocklet.publish.errorTip.noDescription')
+      });
+    }
+    if (!params.note) {
+      errors.push({
+        param: 'note',
+        message: t('blocklet.publish.errorTip.noNote')
+      });
+    }
+  }
+  return errors.length ? errors : null;
+};
 const addComponentTabs = _ref => {
   let {
     tabs,
@@ -54,7 +95,6 @@ const addComponentTabs = _ref => {
   const key = blocklet.meta.did;
   tabs.push({
     label: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
-      ml: -4,
       display: "flex",
       alignItems: "center",
       justifyContent: "flex-start",
@@ -63,7 +103,7 @@ const addComponentTabs = _ref => {
         blocklet: blocklet,
         ancestors: ancestors
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
-        ml: "16px",
+        ml: "4px",
         className: "text",
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
           children: blocklet.meta.title
@@ -73,9 +113,13 @@ const addComponentTabs = _ref => {
     value: key
   });
 };
-const pickParams = release => (0, _pick.default)(release, ['blockletVersion', 'blockletTitle', 'blockletDescription', 'blockletLogo', 'blockletIntroduction', 'blockletScreenshots', 'note']);
+const pickParams = release => {
+  const params = (0, _pick.default)(release, ['blockletVersion', 'blockletTitle', 'blockletDescription', 'blockletLogo', 'blockletIntroduction', 'blockletScreenshots', 'note']);
+  params.blockletScreenshots || (params.blockletScreenshots = []);
+  return params;
+};
 function CreateRelease(_ref2) {
-  var _tabs$;
+  var _tabs$, _params$blockletIntro, _params$note;
   let rest = Object.assign({}, (_objectDestructuringEmpty(_ref2), _ref2));
   const navigate = (0, _reactRouterDom.useNavigate)();
   const {
@@ -89,6 +133,7 @@ function CreateRelease(_ref2) {
     blocklet
   } = (0, _blocklet.useBlockletContext)();
   const [params, setParams] = (0, _useSetState.default)(null);
+  const [paramsErrTip, setParamsErrTip] = (0, _react.useState)({});
   const [loading, setLoading] = (0, _react.useState)(false);
   const [release, setRelease] = (0, _react.useState)(null);
   const {
@@ -99,7 +144,7 @@ function CreateRelease(_ref2) {
   const releaseId = inputReleaseId === 'create' ? '' : inputReleaseId;
   const mode = inputReleaseId === 'create' ? 'create' : 'edit';
   const tabs = [];
-  const resourceComponents = ((blocklet === null || blocklet === void 0 ? void 0 : blocklet.children) || []).filter(x => x.meta.capabilities.resourceExportPage);
+  const resourceComponents = ((blocklet === null || blocklet === void 0 ? void 0 : blocklet.children) || []).filter(x => x.meta.capabilities.resourceExportApi);
   resourceComponents.forEach(item => {
     addComponentTabs({
       tabs,
@@ -128,7 +173,7 @@ function CreateRelease(_ref2) {
       setParams(pickParams(data));
     }).catch(err => {
       setLoading(false);
-      _Toast.default.error(err.message);
+      _Toast.default.error((0, _util.formatError)(err));
     });
   };
   const getRelease = () => {
@@ -144,7 +189,7 @@ function CreateRelease(_ref2) {
       setRelease(res === null || res === void 0 ? void 0 : res.release);
     }).catch(err => {
       setLoading(false);
-      _Toast.default.error(err.message);
+      _Toast.default.error((0, _util.formatError)(err));
     });
   };
   const getData = () => {
@@ -164,28 +209,21 @@ function CreateRelease(_ref2) {
   }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
   const onRelease = status => {
-    if (!params.blockletTitle) {
-      _Toast.default.error(t('blocklet.publish.errorTip.noTitle'));
+    const errors = validateParams(params, status, t);
+    if (errors) {
+      _Toast.default.error(errors.map(x => x.message).join('; '));
+      setParamsErrTip(errors.reduce((acc, x) => _objectSpread(_objectSpread({}, acc), {}, {
+        [x.param]: x.message
+      }), {}));
       return;
     }
-    if (!params.blockletVersion) {
-      _Toast.default.error(t('blocklet.publish.errorTip.noVersion'));
-      return;
-    }
-    if (status === _constant.PROJECT.RELEASE_STATUS.published) {
-      if (!params.blockletDescription) {
-        _Toast.default.error(t('blocklet.publish.errorTip.noDescription'));
-        return;
-      }
-      if (!params.note) {
-        _Toast.default.error(t('blocklet.publish.errorTip.noNote'));
-        return;
-      }
-    }
     const _params = _objectSpread({}, params);
     _params.blockletVersion = _semver.default.valid(_params.blockletVersion);
     if (!_params.blockletVersion) {
       _Toast.default.error('Invalid Blocklet Version');
+      setParamsErrTip({
+        blockletVersion: 'Invalid Blocklet Version'
+      });
       return;
     }
     _params.blockletTitle = (_params.blockletTitle || '').trim();
@@ -214,7 +252,7 @@ function CreateRelease(_ref2) {
         });
       }
     }).catch(err => {
-      _Toast.default.error(err.message);
+      _Toast.default.error((0, _util.formatError)(err));
     });
   };
   if (!params && loading) {
@@ -304,56 +342,77 @@ function CreateRelease(_ref2) {
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
             label: "Blocklet ".concat(t('common.title')),
             placeholder: "Blocklet ".concat(t('common.title')),
-            inputProps: {
+            InputProps: {
               'data-cy': 'blocklet-title',
               readOnly
             },
             autoComplete: "off",
             variant: "outlined",
             fullWidth: true,
+            required: true,
             value: params.blockletTitle || '',
             onChange: e => {
+              setParamsErrTip({
+                blockletTitle: ''
+              });
               setParams({
                 blockletTitle: e.target.value
               });
-            }
+            },
+            error: !!paramsErrTip.blockletTitle,
+            helperText: paramsErrTip.blockletTitle || ''
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
             label: "Blocklet ".concat(t('common.description')),
             placeholder: "Blocklet ".concat(t('common.description')),
-            inputProps: {
+            InputProps: {
               'data-cy': 'blocklet-description',
               readOnly
             },
+            required: true,
             autoComplete: "off",
             variant: "outlined",
             fullWidth: true,
             value: params.blockletDescription || '',
             onChange: e => {
+              setParamsErrTip({
+                blockletDescription: ''
+              });
               setParams({
                 blockletDescription: e.target.value
               });
             },
+            error: !!paramsErrTip.blockletDescription,
+            helperText: paramsErrTip.blockletDescription || '',
             sx: {
               mt: 3
             }
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
             label: "Blocklet ".concat(t('common.introduction')),
             placeholder: "Blocklet ".concat(t('common.introduction')),
-            inputProps: {
+            InputProps: {
               'data-cy': 'export-blocklet-introduction',
-              readOnly
+              readOnly,
+              endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_InputAdornment.default, {
+                position: "end",
+                children: [(params === null || params === void 0 ? void 0 : (_params$blockletIntro = params.blockletIntroduction) === null || _params$blockletIntro === void 0 ? void 0 : _params$blockletIntro.length) || 0, " / ", _constant.PROJECT.MAX_INTRO_LENGTH]
+              })
             },
             autoComplete: "off",
             variant: "outlined",
             fullWidth: true,
             multiline: true,
-            rows: 4,
+            minRows: 4,
             value: params.blockletIntroduction || '',
             onChange: e => {
+              setParamsErrTip({
+                blockletIntroduction: ''
+              });
               setParams({
-                blockletIntroduction: e.target.value
+                blockletIntroduction: e.target.value.slice(0, _constant.PROJECT.MAX_INTRO_LENGTH)
               });
             },
+            error: !!paramsErrTip.blockletIntroduction,
+            helperText: paramsErrTip.blockletIntroduction || '',
             sx: {
               mt: 3
             }
@@ -372,9 +431,10 @@ function CreateRelease(_ref2) {
             flex: 1
           },
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
+            required: true,
             label: "Blocklet ".concat(t('common.version')),
             placeholder: "Blocklet ".concat(t('common.version')),
-            inputProps: {
+            InputProps: {
               'data-cy': 'blocklet-version',
               readOnly
             },
@@ -383,27 +443,42 @@ function CreateRelease(_ref2) {
             fullWidth: true,
             value: params.blockletVersion,
             onChange: e => {
+              setParamsErrTip({
+                blockletVersion: ''
+              });
               setParams({
                 blockletVersion: e.target.value
               });
-            }
+            },
+            error: !!paramsErrTip.blockletVersion,
+            helperText: paramsErrTip.blockletVersion || ''
           }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
             label: t('blocklet.publish.releaseNote'),
             autoComplete: "off",
             variant: "outlined",
-            inputProps: {
+            InputProps: {
               'data-cy': 'release-note',
-              readOnly
+              readOnly,
+              endAdornment: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_InputAdornment.default, {
+                position: "end",
+                children: [(params === null || params === void 0 ? void 0 : (_params$note = params.note) === null || _params$note === void 0 ? void 0 : _params$note.length) || 0, " / ", _constant.PROJECT.MAX_NOTE_LENGTH]
+              })
             },
             fullWidth: true,
             multiline: true,
-            rows: 4,
+            minRows: 4,
+            required: true,
             value: params.note,
             onChange: e => {
+              setParamsErrTip({
+                note: ''
+              });
               setParams({
-                note: e.target.value
+                note: e.target.value.slice(0, _constant.PROJECT.MAX_NOTE_LENGTH)
               });
             },
+            error: !!paramsErrTip.note,
+            helperText: paramsErrTip.note || '',
             sx: {
               mt: 3
             }
@@ -503,11 +578,19 @@ function CreateRelease(_ref2) {
             setParams({
               blockletLogo: result.data.filename
             });
+            uploaderLogoRef.current.close();
           },
-          plugins: ['ImageEditor', 'Url', 'Webcam'],
+          plugins: [],
           apiPathProps: {
             uploader: uploadLogoPrefix,
             disableMediaKitPrefix: true
+          },
+          coreProps: {
+            restrictions: {
+              allowedFileTypes,
+              maxFileSize,
+              maxNumberOfFiles: 1
+            }
           }
         }, "uploader-screenshot"), /*#__PURE__*/(0, _jsxRuntime.jsx)(UploaderComponent, {
           id: "\u200Buploader-screenshot",
@@ -520,38 +603,46 @@ function CreateRelease(_ref2) {
             setParams({
               blockletScreenshots
             });
+            uploaderScreenshotRef.current.close();
           },
-          plugins: ['ImageEditor', 'Url', 'Webcam'],
+          plugins: [],
           apiPathProps: {
             uploader: uploadScreenshotPrefix,
             disableMediaKitPrefix: true
+          },
+          coreProps: {
+            restrictions: {
+              allowedFileTypes,
+              maxFileSize,
+              maxNumberOfFiles: 5 - screenshotUrls.length
+            }
           }
         }, "uploader-screenshot")]
       }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
         display: "flex",
         mt: 3,
         className: "section full-width",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
           className: "left",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
             variant: "h3",
             children: t('blocklet.publish.resourceTitle')
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+          sx: {
+            flex: 1
+          },
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
             tabs: tabs,
             current: tab,
-            orientation: "vertical",
             onChange: onTabChange,
             sx: {
-              width: '100%'
+              ml: -2,
+              mt: -1.5
             }
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
-          sx: {
-            flex: 1
-          },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
             children: resourceContent
-          })
+          })]
         })]
       })]
     })]
@@ -559,7 +650,7 @@ function CreateRelease(_ref2) {
 }
 CreateRelease.propTypes = {};
 CreateRelease.defaultProps = {};
-const Main = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .sticky-header {\n    margin-top: -12px;\n    padding: 12px 0;\n    position: sticky;\n    top: 0;\n    z-index: 99;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    background-color: #fff;\n    padding-bottom: 12px;\n    border-bottom: ", ";\n  }\n  .screenshot {\n    margin-bottom: 16px;\n    max-width: 200px;\n    max-height: 140px;\n    width: 200px;\n    height: 140px;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: #eee;\n    margin-right: 16px;\n    position: relative;\n    .action {\n      visibility: hidden;\n      position: absolute;\n      top: 0px;\n      right: 0px;\n      background-color: rgba(0, 0, 0, 0.2);\n      color: rgba(255, 255, 255, 0.8);\n    }\n    &:hover .action {\n      visibility: visible;\n    }\n  }\n  .screenshot img {\n    width: 100%; /* \u56FE\u50CF\u5BBD\u5EA6\u586B\u5145\u5BB9\u5668 */\n    height: auto; /* \u56FE\u50CF\u9AD8\u5EA6\u81EA\u9002\u5E94 */\n  }\n  .section {\n    max-width: 800px;\n    &.full-width {\n      max-width: 100%;\n    }\n    .MuiTypography-h3 {\n      font-size: 1.1rem;\n      font-weight: 700;\n    }\n    .left {\n      flex-shrink: 0;\n      width: 140px;\n    }\n    .MuiTabs-root {\n      margin-top: 8px;\n      transform: translateX(-16px);\n      .MuiButtonBase-root .text {\n        color: ", ";\n      }\n      .MuiButtonBase-root.Mui-selected .text {\n        color: ", ";\n      }\n    }\n    .MuiTabs-indicator {\n      display: none;\n    }\n    .MuiTypography-subtitle1 {\n      width: 120px;\n      font-weight: 700;\n      font-size: 1rem;\n      ", " {\n        width: 80px;\n      }\n    }\n  }\n  .MuiButtonBase-root {\n    a {\n      color: inherit;\n    }\n  }\n"])), _ref3 => {
+const Main = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .sticky-header {\n    margin-top: -12px;\n    padding: 12px 0;\n    position: sticky;\n    top: 0;\n    z-index: 99;\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    background-color: #fff;\n    padding-bottom: 12px;\n    border-bottom: ", ";\n  }\n  .screenshot {\n    margin-bottom: 16px;\n    max-width: 200px;\n    max-height: 140px;\n    width: 200px;\n    height: 140px;\n    overflow: hidden;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    background-color: #eee;\n    margin-right: 16px;\n    position: relative;\n    .action {\n      visibility: hidden;\n      position: absolute;\n      top: 0px;\n      right: 0px;\n      background-color: rgba(0, 0, 0, 0.2);\n      color: rgba(255, 255, 255, 0.8);\n    }\n    &:hover .action {\n      visibility: visible;\n    }\n  }\n  .screenshot img {\n    width: 100%; /* \u56FE\u50CF\u5BBD\u5EA6\u586B\u5145\u5BB9\u5668 */\n    height: auto; /* \u56FE\u50CF\u9AD8\u5EA6\u81EA\u9002\u5E94 */\n  }\n  .section {\n    max-width: 800px;\n    &.full-width {\n      max-width: 100%;\n    }\n    .MuiTypography-h3 {\n      font-size: 1.1rem;\n      font-weight: 700;\n    }\n    .left {\n      flex-shrink: 0;\n      width: 140px;\n    }\n    .MuiTabs-indicator {\n      display: none;\n    }\n    .MuiTypography-subtitle1 {\n      width: 120px;\n      font-weight: 700;\n      font-size: 1rem;\n      ", " {\n        width: 80px;\n      }\n    }\n  }\n  .MuiButtonBase-root {\n    a {\n      color: inherit;\n    }\n  }\n  .MuiInputBase-multiline .MuiInputAdornment-positionEnd {\n    align-self: flex-end;\n    .MuiTypography-root {\n      font-size: 0.8rem;\n    }\n    font-size: 0.8rem;\n  }\n"])), _ref3 => {
   let {
     theme
   } = _ref3;
@@ -568,15 +659,5 @@ const Main = _styled.default.div(_templateObject || (_templateObject = _taggedTe
   let {
     theme
   } = _ref4;
-  return theme.palette.text.primary;
-}, _ref5 => {
-  let {
-    theme
-  } = _ref5;
-  return theme.palette.primary.main;
-}, _ref6 => {
-  let {
-    theme
-  } = _ref6;
   return theme.breakpoints.down('sm');
 });

package/lib/blocklet/publish/project-list.js

@@ -14,6 +14,8 @@ var _Delete = _interopRequireDefault(require("@mui/icons-material/Delete"));
 var _Datatable = _interopRequireDefault(require("@arcblock/ux/lib/Datatable"));
 var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
 var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
+var _Tag = _interopRequireDefault(require("@arcblock/ux/lib/Tag"));
+var _RelativeTime = _interopRequireDefault(require("@arcblock/ux/lib/RelativeTime"));
 var _blocklet = require("../../contexts/blocklet");
 var _node = require("../../contexts/node");
 var _emptySpinner = _interopRequireDefault(require("../../empty-spinner"));
@@ -114,7 +116,7 @@ function ProjectList() {
     });
   }
   const columns = [{
-    label: t('common.name'),
+    label: 'Blocklet',
     name: 'blockletTitle',
     options: {
       customBodyRenderLite: rawIndex => {
@@ -126,7 +128,7 @@ function ProjectList() {
       }
     }
   }, {
-    label: t('common.address'),
+    label: 'DID',
     name: 'blockletDid',
     options: {
       customBodyRender: e => {
@@ -137,6 +139,28 @@ function ProjectList() {
         });
       }
     }
+  }, {
+    label: 'Version',
+    name: 'blockletVersion',
+    options: {
+      customBodyRender: value => {
+        return value ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tag.default, {
+          type: "success",
+          children: value
+        }) : '';
+      }
+    }
+  }, {
+    label: t('common.updatedAt'),
+    name: 'updatedAt',
+    options: {
+      customBodyRender: value => {
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RelativeTime.default, {
+          value: Number(value),
+          locale: locale
+        });
+      }
+    }
   }, {
     label: t('common.actions'),
     name: 'actions',

package/lib/blocklet/publish/release-list.js

@@ -21,6 +21,8 @@ var _constant = require("@abtnode/constant");
 var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
 var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
 var _Tag = _interopRequireDefault(require("@arcblock/ux/lib/Tag"));
+var _RelativeTime = _interopRequireDefault(require("@arcblock/ux/lib/RelativeTime"));
+var _constant2 = require("@blocklet/constant");
 var _blocklet = require("../../contexts/blocklet");
 var _node = require("../../contexts/node");
 var _emptySpinner = _interopRequireDefault(require("../../empty-spinner"));
@@ -196,6 +198,21 @@ function ReleaseList() {
         });
       }
     }
+  }, {
+    label: t('common.lastPublishedAt'),
+    name: 'updatedAt',
+    options: {
+      customBodyRenderLite: rawIndex => {
+        const release = releases[rawIndex];
+        if (release.status !== _constant2.PROJECT.RELEASE_STATUS.published) {
+          return '';
+        }
+        return /*#__PURE__*/(0, _jsxRuntime.jsx)(_RelativeTime.default, {
+          value: Number(release.updatedAt),
+          locale: locale
+        });
+      }
+    }
   }, {
     label: t('common.actions'),
     name: 'actions',
@@ -204,11 +221,15 @@ function ReleaseList() {
         const release = releases[rawIndex];
         return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
           display: "flex",
+          alignItems: "center",
           children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_IconButton.default, {
             color: "primary",
             "aria-label": "download",
             disabled: release.status !== 'published',
             children: release.status === 'published' ? /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
+              style: {
+                display: 'flex'
+              },
               href: (0, _urlJoin.default)("".concat(_constant.WELLKNOWN_SERVICE_PATH_PREFIX, "/api/project/").concat(blocklet.meta.did, "/").concat(project.id, "/").concat(release.id, "/download/").concat((release.files || [])[0])),
               children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Download.default, {
                 sx: {