@abtnode/ux 1.16.25-beta-023ec101 → 1.16.25-beta-bc165d9b

package/es/locales/zh-tw.js

@@ -655,12 +655,12 @@ export default {
       resourceTitle: '資源',
       blockletEmptyTip: '這裡沒有任何區塊元件',
       createBlockletTip: '您可以透過現有的資源、元件和設定，在此應用程式中建立新的 blocklet',
-      createBlocklet: '建立新的 blocklet',
+      createBlocklet: '新的區塊',
       deleteBlockletTip: '刪除後無法恢復區塊，請確認',
       componentNotRunning: '{name}元件未運行，請先啟動。',
       releaseEmptyTip: '這裡沒有任何發布',
       createReleaseTip: '您可以創建一個區塊釋出，附帶釋出說明和資源，供其他人使用',
-      createRelease: '建立一個新的發布',
+      createRelease: '新版本發布',
       deleteReleaseTip: '刪除後無法還原發布',
       createBlockletDid: '從DID錢包創建',
       createReleaseSuccess: '發佈成功',
@@ -680,13 +680,18 @@ export default {
         noDescription: '需要提供 Blocklet 描述',
         noNote: '需要提供發佈說明'
       },
-      packTip: '組件和應用程式配置將自動包含在區塊中',
+      packTip: '目前，blocklet可以直接安裝為應用程序。組件和應用程序配置將自動包含在blocklet中',
       resourceChangedWarning: '您已修改資源，請儘速保存',
-      installResourceTip: '請將元件新增到應用程式中，元件URL:',
+      installResourceTip: '安裝網址:',
       installResourceTip2: '如果您想查看更多提示，請訪問 {name}',
       installResourceHelp: '幫助文件',
       componentIncluded: '已包含',
-      componentForceRequired: '強制要求'
+      componentForceRequired: '強制要求',
+      productListTitle: '發布 Blocklets',
+      download: '下載 {name}',
+      delete: '刪除 {name}',
+      copyInstallUrl: '複製安裝連結',
+      install: '安裝{name}'
     },
     titleValidationError: '標題長度必須至少為3到40個字符',
     descriptionValidationError: '描述長度必須介於3到160個字符之間'
@@ -790,7 +795,7 @@ export default {
         switchLabel: '歡迎頁面'
       },
       upgrade: {
-        title: '升級 Blocklet 伺服器 {version}',
+        title: '升級 Blocklet 伺服器',
         description: '在升級期間，您的 Blocklet 伺服器將進入維護模式，更新完成後將持續幾分鐘。',
         dialog: '點擊"確認"安裝更新。Blocklet服務器將進入維護模式，直到更新完成並自動返回生產模式。',
         confirm: '升級',
@@ -803,7 +808,7 @@ export default {
         verifying: '正在驗證Blocklet服務器v{version}',
         rollback: '回滾Blocklet伺服器',
         complete: '升級完成！',
-        progress: '正在升級Blocklet伺服器{version}',
+        progress: '升級 {name}',
         check: '檢查更新',
         latest: '您正在執行最新版本。'
       },
@@ -818,7 +823,7 @@ export default {
         cleanup: '確保一切正常',
         rollback: '清理髒污狀態',
         complete: '維護完成！',
-        progress: '重新啟動 Blocklet 伺服器'
+        progress: '重新啟動 {name}'
       },
       register: {
         titleAdded: '已新增至 Blocklet Launcher',

package/es/locales/zh.js

@@ -655,26 +655,26 @@ export default {
       productTitle: 'Blocklet 详情',
       versionTitle: '版本信息',
       imgTitle: '图片资源',
-      resourceTitle: '组件资源',
-      blockletEmptyTip: '这里没有任何 blocklet',
+      resourceTitle: '资源型 Blocklet',
+      blockletEmptyTip: '这里没有任何 Blocklet',
       createBlockletTip: '你可以使用此应用的资源，组件，配置制作新的 Blocklet',
-      createBlocklet: '创建 Blocklet',
+      createBlocklet: '新的块',
       deleteBlockletTip: '此 Blocklet 删除后不可恢复，是否继续？',
       componentNotRunning: '组件 {name} 未运行',
       releaseEmptyTip: '这里没有任何发布',
-      createReleaseTip: '您可以创建 Blocklet 发布，在发布中包含说明和资源，以供其他人使用',
-      createRelease: '创建新的发布',
+      createReleaseTip: '您可以创建 Blocklet 新版本，在发布中包含说明和资源，以供其他人使用',
+      createRelease: '创建新的版本',
       deleteReleaseTip: '此发布删除后不可恢复，是否继续？',
       createBlockletDid: '通过 DID 钱包创建',
       createReleaseSuccess: '发布成功',
       saveDraftSuccess: '保存成功',
-      packTip: 'Blocklet 中将自动包含组件和应用配置',
+      packTip: '您的 Blocklet 现在可以直接安装为应用程序。应用程序配置将自动包含在内',
       resourceChangedWarning: '您修改了资源，请及时保存',
-      installResourceTip: '请在应用中添加组件，组件 URL：',
+      installResourceTip: '安装网址:',
       installResourceTip2: '如果你需要更多提示，请查看',
       installResourceHelp: '帮助文档',
       componentIncluded: '包含',
-      componentForceRequired: '强制依赖',
+      componentForceRequired: '强依赖',
       connect: {
         title: '创建 Blocklet DID',
         scan: '扫描下面的二维码来生成 Blocklet DID',
@@ -689,7 +689,12 @@ export default {
         noVersion: '请填写 Blocklet 版本号',
         noDescription: '请填写 Blocklet 描述',
         noNote: '请填写 发布说明'
-      }
+      },
+      productListTitle: '发布 Blocklets',
+      download: '下载 {name}',
+      delete: '删除 {name}',
+      copyInstallUrl: '复制安装链接',
+      install: '安装 {name}'
     },
     titleValidationError: '标题长度必须至少为3到40个字符',
     descriptionValidationError: '描述长度必须在3到160个字符之间'
@@ -786,7 +791,7 @@ export default {
       nftDomainUrl: 'NFT Domain 地址',
       nftDomainUrlPlaceholder: '你可以选择其它的 NFT Domain 服务器, 也可以使用官方提供的版本',
       upgrade: {
-        title: '升级节点 {version}',
+        title: '升级 Blocklet 服务器',
         description: '在升级期间，节点将会进入维护模式几分钟。',
         dialog: '点击 “确认” 安装更新。节点将进入维护模式，直到更新完成并自动返回生产模式。',
         confirm: '升级',
@@ -799,7 +804,7 @@ export default {
         verifying: '验证节点新版本 v{version}',
         rollback: '回滚此次升级',
         complete: '升级完成!',
-        progress: '正在升级节点 {version}',
+        progress: '升级 {name}',
         check: '检查更新',
         latest: '太棒了，你的节点已经是最新版！'
       },
@@ -814,7 +819,7 @@ export default {
         cleanup: '验证重启成功',
         rollback: '撤销重启操作',
         complete: '维护完成',
-        progress: '正在重启节点'
+        progress: '重新开始 {name}'
       },
       welcome: {
         switchLabel: 'Welcome 页面'

package/es/subscription/blocklet.js

@@ -0,0 +1,175 @@
+import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
+import dayjs from '@abtnode/util/lib/dayjs';
+import Chip from '@mui/material/Chip';
+import CircularProgress from '@mui/material/CircularProgress';
+import Popover from '@mui/material/Popover';
+import useMediaQuery from '@mui/material/useMediaQuery';
+import PropTypes from 'prop-types';
+import prettyMs from 'pretty-ms-i18n';
+import { useRef } from 'react';
+import useAsyncRetry from 'react-use/lib/useAsyncRetry';
+import useSetState from 'react-use/lib/useSetState';
+import { useNodeContext } from '../contexts/node';
+import { formatPrettyMsLocale, getSubscriptionUrlV2 } from '../util';
+import ChipLabel from './chip-label';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+const DEFAULT_LAUNCHER_URL = 'https://launcher.arcblock.io/'; // 兼容: 旧版本的 blocklet.controller 没有 launcherUrl 字段
+
+const ALERT_THRESHOLD_MS = 30 * 24 * 60 * 60 * 1000;
+function SubscriptionBlocklet({
+  launcherUrl,
+  chainHost,
+  nftId,
+  launcherSessionId,
+  ...props
+}) {
+  const {
+    t,
+    locale
+  } = useLocaleContext();
+  const node = useNodeContext();
+  const [state, setState] = useSetState({
+    safeIframeRef: null,
+    popoverAnchorEl: null
+  });
+  const iframeRef = useRef(null);
+  const isMobile = useMediaQuery(x => x.breakpoints.down('md'));
+  const {
+    sx = {},
+    ...rest
+  } = props;
+  const typoKey = isMobile ? 'mobile' : 'desktop';
+  const asyncState = useAsyncRetry(async () => {
+    const [data, subscriptionURL] = await Promise.all([node.api.getLauncherSession({
+      input: {
+        launcherSessionId,
+        launcherUrl
+      }
+    }), getSubscriptionUrlV2({
+      launcherUrl: launcherUrl || DEFAULT_LAUNCHER_URL,
+      nftDid: nftId,
+      launcherSessionId,
+      locale
+    })]);
+    if (data?.error) {
+      throw new Error(data.error);
+    }
+    return {
+      launcherSession: data.launcherSession,
+      subscriptionURL
+    };
+  }, [locale]);
+  if (asyncState.loading) {
+    return /*#__PURE__*/_jsx(Chip, {
+      label: /*#__PURE__*/_jsxs(ChipLabel, {
+        children: [!isMobile && t('expiration.desktop.loading'), /*#__PURE__*/_jsx(CircularProgress, {
+          size: 16
+        })]
+      }),
+      variant: "success",
+      sx: {
+        cursor: 'pointer',
+        ...sx
+      },
+      ...rest
+    });
+  }
+  if (asyncState.error) {
+    console.error(asyncState.error);
+    return /*#__PURE__*/_jsx(Chip, {
+      label: /*#__PURE__*/_jsx(ChipLabel, {
+        children: t(`expiration.${typoKey}.loadFailed`)
+      }),
+      color: "error",
+      variant: "success",
+      sx: {
+        cursor: 'pointer',
+        ...sx
+      },
+      ...rest,
+      onClick: () => asyncState.retry()
+    });
+  }
+  const handlePopoverClick = event => {
+    setState({
+      popoverAnchorEl: event.currentTarget
+    });
+  };
+  const handlePopoverClose = () => {
+    setState({
+      popoverAnchorEl: null
+    });
+  };
+  const launcherSession = asyncState.value?.launcherSession;
+  let status = 'success';
+  if (['expired', 'terminated'].includes(asyncState.value?.launcherSession?.statusText)) {
+    status = 'error';
+  }
+  let validity = null;
+  if (launcherSession.expirationDate && !launcherSession.subscription) {
+    const validityMs = dayjs(launcherSession.expirationDate).diff(dayjs(), 'ms');
+    validity = t(`expiration.${typoKey}.tips.${status}`, {
+      validity: prettyMs(validityMs, {
+        locale: formatPrettyMsLocale(locale),
+        compact: true,
+        verbose: true
+      })
+    });
+    if (validityMs > 0 && validityMs <= ALERT_THRESHOLD_MS) {
+      status = 'warning';
+    }
+  }
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(Chip, {
+      label: /*#__PURE__*/_jsx(ChipLabel, {
+        children: validity || launcherSession?.subscription?.product?.name || t('common.subscription')
+      }),
+      color: status,
+      variant: status !== 'success' ? 'contained' : 'outlined',
+      sx: {
+        cursor: 'pointer',
+        ...sx
+      },
+      ...rest,
+      onClick: handlePopoverClick
+    }), /*#__PURE__*/_jsx(Popover, {
+      id: "popover-info",
+      open: Boolean(state.popoverAnchorEl),
+      anchorEl: state.popoverAnchorEl,
+      onClose: handlePopoverClose,
+      anchorOrigin: {
+        vertical: 'bottom',
+        horizontal: 'right'
+      },
+      transformOrigin: {
+        vertical: 'top',
+        horizontal: 'right'
+      },
+      children: /*#__PURE__*/_jsx("iframe", {
+        ref: iframeRef,
+        title: t('common.subscription'),
+        width: "360px",
+        height: "600px",
+        style: {
+          border: 0
+        },
+        src: asyncState.value?.subscriptionURL
+      })
+    })]
+  });
+}
+SubscriptionBlocklet.propTypes = {
+  chainHost: PropTypes.string.isRequired,
+  nftId: PropTypes.string,
+  launcherSessionId: PropTypes.string,
+  sx: PropTypes.object,
+  retention: PropTypes.number,
+  launcherUrl: PropTypes.string.isRequired
+};
+SubscriptionBlocklet.defaultProps = {
+  sx: {},
+  retention: 0,
+  nftId: '',
+  launcherSessionId: ''
+};
+export default SubscriptionBlocklet;

package/es/subscription/chip-label.js

@@ -0,0 +1,21 @@
+import AccessTimeIcon from '@mui/icons-material/AccessTime';
+import Box from '@mui/material/Box';
+import PropTypes from 'prop-types';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export default function ChipLabel({
+  children
+}) {
+  return /*#__PURE__*/_jsxs(Box, {
+    sx: {
+      display: 'flex',
+      alignItems: 'center',
+      gap: 1
+    },
+    children: [/*#__PURE__*/_jsx(AccessTimeIcon, {
+      fontSize: "small"
+    }), children]
+  });
+}
+ChipLabel.propTypes = {
+  children: PropTypes.node.isRequired
+};

package/es/{subscription.js → subscription/server.js}

@@ -1,41 +1,26 @@
 import dayjs from '@abtnode/util/lib/dayjs';
 import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
-import AccessTimeIcon from '@mui/icons-material/AccessTime';
-import Box from '@mui/material/Box';
 import Chip from '@mui/material/Chip';
 import CircularProgress from '@mui/material/CircularProgress';
 import Popover from '@mui/material/Popover';
+import useMediaQuery from '@mui/material/useMediaQuery';
 import prettyMs from 'pretty-ms-i18n';
 import PropTypes from 'prop-types';
 import { useRef } from 'react';
 import useAsyncRetry from 'react-use/lib/useAsyncRetry';
 import useSetState from 'react-use/lib/useSetState';
-import useMediaQuery from '@mui/material/useMediaQuery';
-import { formatPrettyMsLocale, getAsset, getAssetExpiration, getSubscriptionURL } from './util';
+import { useNodeContext } from '../contexts/node';
+import { formatPrettyMsLocale, getSubscriptionUrlV2 } from '../util';
+import ChipLabel from './chip-label';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const ALERT_THRESHOLD_MS = 30 * 24 * 60 * 60 * 1000;
 const DEFAULT_LAUNCHER_URL = 'https://launcher.arcblock.io/'; // 兼容: 旧版本的 blocklet.controller 没有 launcherUrl 字段
 
-// eslint-disable-next-line react/prop-types
-function ChipLabel({
-  children
-}) {
-  return /*#__PURE__*/_jsxs(Box, {
-    sx: {
-      display: 'flex',
-      alignItems: 'center',
-      gap: 1
-    },
-    children: [/*#__PURE__*/_jsx(AccessTimeIcon, {
-      fontSize: "small"
-    }), children]
-  });
-}
-function Subscription({
+function SubscriptionServer({
   launcherUrl,
   chainHost,
   nftId,
-  retention,
+  launcherSessionId,
   ...props
 }) {
   const {
@@ -48,19 +33,32 @@ function Subscription({
   });
   const iframeRef = useRef(null);
   const isMobile = useMediaQuery(x => x.breakpoints.down('md'));
+  const node = useNodeContext();
   const {
     sx = {},
     ...rest
   } = props;
   const typoKey = isMobile ? 'mobile' : 'desktop';
   const asyncState = useAsyncRetry(async () => {
-    const [asset, subscriptionURL] = await Promise.all([getAsset(chainHost, nftId), getSubscriptionURL({
+    const [data, subscriptionURL] = await Promise.all([
+    // 新 Launch 的 Server 会有 launcherSessionId 信息，旧的 Server 只有 nftId
+    // 这里做兼容处理，优先使用 launcherSessionId, 如果没有则使用 nftId
+    node.api.getLauncherSession({
+      input: {
+        launcherSessionId: launcherSessionId || nftId,
+        launcherUrl
+      }
+    }), getSubscriptionUrlV2({
       launcherUrl: launcherUrl || DEFAULT_LAUNCHER_URL,
-      nftId,
+      nftDid: nftId,
+      launcherSessionId,
       locale
     })]);
+    if (data?.error) {
+      throw new Error(data.error);
+    }
     return {
-      asset,
+      launcherSession: data.launcherSession,
       subscriptionURL
     };
   }, [locale]);
@@ -95,7 +93,7 @@ function Subscription({
       onClick: () => asyncState.retry()
     });
   }
-  const expirationDate = getAssetExpiration(asyncState.value?.asset);
+  const expirationDate = asyncState.value?.launcherSession?.expirationDate;
   const isExpired = dayjs(expirationDate).isBefore(dayjs());
   const validityMs = dayjs(expirationDate).diff(dayjs(), 'ms');
   let status = 'success';
@@ -160,15 +158,18 @@ function Subscription({
     })]
   });
 }
-Subscription.propTypes = {
+SubscriptionServer.propTypes = {
   chainHost: PropTypes.string.isRequired,
-  nftId: PropTypes.string.isRequired,
+  nftId: PropTypes.string,
+  launcherSessionId: PropTypes.string,
   sx: PropTypes.object,
   retention: PropTypes.number,
   launcherUrl: PropTypes.string.isRequired
 };
-Subscription.defaultProps = {
+SubscriptionServer.defaultProps = {
   sx: {},
-  retention: 0
+  retention: 0,
+  nftId: '',
+  launcherSessionId: ''
 };
-export default Subscription;
+export default SubscriptionServer;

package/es/team/members/connections.js

@@ -16,7 +16,8 @@ export default function UserConnections({
       nameWidth: 120,
       name: account.provider,
       children: /*#__PURE__*/_jsx(DidAddress, {
-        did: account.did
+        did: account.did,
+        showQrcode: true
       })
     }, account.did);
   });

package/es/team/members/member.js

@@ -322,7 +322,8 @@ export default function Member({
               className: "did",
               mt: 1,
               children: /*#__PURE__*/_jsx(DidAddress, {
-                did: pageState.user.did
+                did: pageState.user.did,
+                showQrcode: true
               })
             })]
           })]

package/es/util/index.js

@@ -6,7 +6,6 @@ import filesize from 'filesize';
 import humanizeUrl from 'humanize-url';
 import isUrl from 'is-url';
 import get from 'lodash/get';
-import last from 'lodash/last';
 import trimEnd from 'lodash/trimEnd';
 import qs from 'querystring';
 import joinUrl from 'url-join';
@@ -531,9 +530,6 @@ export async function getAsset(chainHost, address) {
   }
   return state;
 }
-export function getAssetExpiration(asset) {
-  return last(get(asset, 'data.value.expirationDate', []));
-}
 
 /**
  * 检查url是否 未添加到 store list 中
@@ -621,11 +617,25 @@ export const sortDomains = domains => {
   });
 };
 export const formatMountPoint = value => normalizePathPrefix(urlPathFriendly(value));
-export const getRenewBlockletURL = ({
-  launcherUrl = '',
-  nftId = '',
-  locale = 'en'
-}) => joinUrl(launcherUrl, `/instances/${nftId}/renewal?locale=${locale}&return-url=${encodeURIComponent(window.location.href)}`);
+const getLauncherBaseURL = async launcherUrl => {
+  if (!launcherUrl) {
+    return '';
+  }
+  let baseUrl = launcherUrl;
+  try {
+    const {
+      data: appMeta
+    } = await axios.get(joinUrl(launcherUrl, '__blocklet__.js?type=json'), {
+      timeout: 5000
+    });
+    const mountPoint = appMeta.componentMountPoints?.find(item => item.did === 'z8iZkFBbrVQxZHvcWWB3Sa2TrfGmSeFz9MSU7');
+    const launcherUrlObj = new URL(launcherUrl);
+    baseUrl = joinUrl(launcherUrlObj.origin, mountPoint?.mountPoint);
+  } catch (error) {
+    console.error(error);
+  }
+  return baseUrl;
+};
 export const getSubscriptionURL = async ({
   launcherUrl = '',
   nftId = '',
@@ -649,6 +659,29 @@ export const getSubscriptionURL = async ({
   }
   return joinUrl(baseUrl, `/${nftId}/subscription?locale=${locale}&return-url=${encodeURIComponent(window.location.href)}`);
 };
+export const getSubscriptionUrlV2 = async ({
+  launcherUrl = '',
+  launcherSessionId = '',
+  nftDid,
+  locale = 'en'
+}) => {
+  if (!launcherUrl) {
+    return '';
+  }
+  const baseUrl = await getLauncherBaseURL(launcherUrl);
+  return joinUrl(baseUrl, `/embed/subscription?launcherSessionId=${launcherSessionId}&nftDid=${nftDid}&locale=${locale}`); // nftDid 是兼容字段
+};
+export const getManageSubscriptionURL = async ({
+  launcherUrl = '',
+  launcherSessionId = '',
+  locale = 'en'
+}) => {
+  if (!launcherUrl) {
+    return '';
+  }
+  const baseUrl = await getLauncherBaseURL(launcherUrl);
+  return joinUrl(baseUrl, `/embed/manage-subscription?launcherSessionId=${launcherSessionId}&locale=${locale}`);
+};
 export const nanoid = (length = 16) => [...Array(length)].map(() => Math.random().toString(36)[2]).join('');
 export const getSystemDomains = domains => domains.filter(x => x.isProtected);
 export const getLogoHash = logo => encodeURIComponent((logo || '').split('/').slice(-1)[0].slice(0, 7));

package/lib/blocklet/actions.js

@@ -33,10 +33,10 @@ var _util3 = require("./util");
 var _node = require("../contexts/node");
 var _confirm = _interopRequireDefault(require("../confirm"));
 var _icons = _interopRequireDefault(require("./icons"));
-var _blocklet = require("../contexts/blocklet");
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
-const _excluded = ["blocklet", "onStart", "onComplete", "variant", "hasPermission", "useBlockletUrlEvaluation"];
+const _excluded = ["blocklet", "onStart", "onComplete", "variant", "hasPermission", "useBlockletUrlEvaluation"],
+  _excluded2 = ["sx"];
 /* eslint-disable react/no-unstable-nested-components */
 /* eslint-disable operator-linebreak */
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -49,7 +49,7 @@ function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e =
 function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 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; }
 function BlockletActions(_ref) {
-  var _blocklet$controller, _blocklet$controller2;
+  var _blocklet$controller;
   let {
       blocklet,
       onStart,
@@ -73,14 +73,14 @@ function BlockletActions(_ref) {
     loading: recommendedUrlLoading,
     recommendedUrl
   } = useBlockletUrlEvaluation(blocklet);
-  const {
-    nftState
-  } = (0, _blocklet.useBlockletContext)();
   const inProgress = (0, _util.isInProgress)(blocklet.status);
-  let disableStart = (blocklet === null || blocklet === void 0 || (_blocklet$controller = blocklet.controller) === null || _blocklet$controller === void 0 || (_blocklet$controller = _blocklet$controller.status) === null || _blocklet$controller === void 0 ? void 0 : _blocklet$controller.value) === _constant.BLOCKLET_CONTROLLER_STATUS.suspended;
-  if (!(nftState !== null && nftState !== void 0 && nftState.expired) && (blocklet === null || blocklet === void 0 || (_blocklet$controller2 = blocklet.controller) === null || _blocklet$controller2 === void 0 || (_blocklet$controller2 = _blocklet$controller2.status) === null || _blocklet$controller2 === void 0 ? void 0 : _blocklet$controller2.reason) === _constant.SUSPENDED_REASON.expired) {
-    disableStart = false;
-  }
+  const disableStart = (blocklet === null || blocklet === void 0 || (_blocklet$controller = blocklet.controller) === null || _blocklet$controller === void 0 || (_blocklet$controller = _blocklet$controller.status) === null || _blocklet$controller === void 0 ? void 0 : _blocklet$controller.value) === _constant.BLOCKLET_CONTROLLER_STATUS.suspended;
+
+  // TODO: PaymentKitV2 过期恢复后需要能立即启动
+  // if (!nftState?.expired && blocklet?.controller?.status?.reason === SUSPENDED_REASON.expired) {
+  //   disableStart = false;
+  // }
+
   const {
     inService
   } = node;
@@ -319,7 +319,18 @@ function BlockletActions(_ref) {
   } : null;
   const cancelDownloadAction = {
     action: 'remove',
-    icon: _icons.default.Remove,
+    icon: _ref3 => {
+      let {
+          sx
+        } = _ref3,
+        restProps = _objectWithoutProperties(_ref3, _excluded2);
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.default.Cancel, _objectSpread({
+        sx: _objectSpread(_objectSpread({}, sx), {}, {
+          paddingRight: '2px',
+          zoom: 0.95
+        })
+      }, restProps));
+    },
     name: t('common.cancel'),
     handler: createHandler('cancelDownload', node.api.cancelDownloadBlocklet, true)
   };

package/lib/blocklet/component/add-component-core.js

@@ -1179,7 +1179,7 @@ const ContentWrapper = (0, _styled.default)(_Box.default)(_templateObject4 || (_
   if (className === 'mobileStyle') {
     return "\n      & > div{\n        height: 100%;\n      }\n      .root-header {\n        .app-name-content {\n          display: none;\n        }\n      }\n\n\n\n      // content-panel\n      .root-header + div{\n        padding-top: 0;\n        position: relative;\n        & > div {\n          padding-top: 0;\n        }\n      }\n\n      header + div {\n        padding-top: 0;\n      }\n\n      header {\n        .header-title {\n          margin-left: 0;\n        }\n\n        .header-title-name  {\n          max-width: 100% !important;\n        }\n      }\n      ";
   }
-  return "\n      position: relative;\n      .root-header {\n        z-index: auto !important;\n        position: fixed !important;\n      }\n      & > div {\n        height: 100%;\n        width: 100%;\n        max-width: 100%;\n        & > div {\n          max-height: unset !important;\n          max-width: 100%;\n          & > div {\n            // left-panel\n            &:first-child {\n              padding: 0;\n              width: 25%;\n              min-width: 240px;\n              & > div:first-child {\n                display: none;\n              }\n              // step\n              & > div:last-child {\n                // margin-top: 32px;\n                margin-top: 0;\n              }\n            }\n            // right-panel\n            &:last-child {\n              padding-top: 0;\n              padding-right: 0px;\n              overflow-y: hidden;\n              .app-content {\n                padding: 0 0 24px 0;\n              }\n              .button-container {\n                padding-right: 0;\n              }\n            }\n          }\n        }\n      }\n\n    ";
+  return "\n      position: relative;\n      .ll-container { // \u901A\u8FC7 Launcher Layout \u7EC4\u4EF6\u7EA6\u5B9A\u7684 .ll-container class \u81EA\u5B9A\u4E49 Layout \u6837\u5F0F\n        width: 100%;\n        height: 100%;\n      }\n\n      .root-header {\n        z-index: auto !important;\n        position: fixed !important;\n      }\n      & > div {\n        height: 100%;\n        width: 100%;\n        max-width: 100%;\n        & > div {\n          max-height: unset !important;\n          max-width: 100%;\n          & > div {\n            // left-panel\n            &:first-child {\n              padding: 0;\n              width: 25%;\n              min-width: 240px;\n              & > div:first-child {\n                display: none;\n              }\n              // step\n              & > div:last-child {\n                // margin-top: 32px;\n                margin-top: 0;\n              }\n            }\n            // right-panel\n            &:last-child {\n              padding-top: 0;\n              padding-right: 0px;\n              overflow-y: hidden;\n              .app-content {\n                padding: 0 0 24px 0;\n              }\n              .button-container {\n                padding-right: 0;\n              }\n            }\n          }\n        }\n      }\n\n    ";
 }, props => isMobileContent(props), props => isMobileContent(props));
 const PageHeaderWrapper = (0, _styled.default)(_pageHeader.default)(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  margin-bottom: 24px;\n"])));
 const StoreBlockletItemWrapper = _styled.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  position: relative;\n\n  .choose-blocklet {\n    background-color: rgb(236, 251, 253);\n    border-color: rgb(236, 251, 253);\n    border-radius: 8px;\n  }\n\n  .check-container {\n    position: absolute;\n    right: 0;\n    bottom: 0;\n    display: flex;\n    justify-content: flex-end;\n    align-items: flex-end;\n    width: 30px;\n    height: 30px;\n    border-radius: 0 0 8px 0;\n    color: ", ";\n    overflow: hidden;\n    transition: all ease 0.3s;\n    &:after {\n      position: absolute;\n      z-index: 0;\n      display: block;\n      width: 0;\n      height: 0;\n      border-top: transparent solid 15px;\n      border-left: transparent solid 15px;\n      border-bottom: ", " solid 15px;\n      border-right: ", " solid 15px;\n      transition: all ease 0.1s;\n      content: '';\n    }\n\n    .check-icon {\n      position: relative;\n      z-index: 2;\n      margin: 0 1px 1px 0;\n      font-size: 16px;\n      transition: all ease 0.2s;\n    }\n  }\n"])), props => props.theme.palette.common.white, props => props.theme.palette.primary.main, props => props.theme.palette.primary.main);

package/lib/blocklet/component/component-cell.js

@@ -211,7 +211,8 @@ function ComponentCell(_ref) {
   }, {
     name: t('common.did'),
     value: /*#__PURE__*/(0, _jsxRuntime.jsx)(_didAddress.default, {
-      did: componentInfo.meta.did
+      did: componentInfo.meta.did,
+      showQrcode: true
     })
   }, {
     name: t('common.author'),

package/lib/blocklet/icons.js

@@ -12,6 +12,7 @@ var _Autorenew = _interopRequireDefault(require("@mui/icons-material/Autorenew")
 var _Settings = _interopRequireDefault(require("@mui/icons-material/Settings"));
 var _Receipt = _interopRequireDefault(require("@mui/icons-material/Receipt"));
 var _Group = _interopRequireDefault(require("@mui/icons-material/Group"));
+var _NotInterested = _interopRequireDefault(require("@mui/icons-material/NotInterested"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var _default = exports.default = {
   Start: _PlayArrow.default,
@@ -21,5 +22,6 @@ var _default = exports.default = {
   Remove: _Delete.default,
   Config: _Settings.default,
   Log: _Receipt.default,
-  Group: _Group.default
+  Group: _Group.default,
+  Cancel: _NotInterested.default
 };