@abtnode/ux 1.15.17 → 1.16.0-beta-8ee536d7

package/lib/blocklet/status.js

@@ -0,0 +1,105 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = BlockletStatus;
+var _react = require("react");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularProgress"));
+var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _dot = _interopRequireDefault(require("../dot"));
+var _tag = _interopRequireDefault(require("../tag"));
+var _util = require("../util");
+var _jsxRuntime = require("react/jsx-runtime");
+const _excluded = ["status", "variant", "source"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+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 _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; }
+const colors = {
+  yellow: '#FFCF71',
+  grey: '#888888'
+};
+function BlockletStatus(_ref) {
+  let {
+      status,
+      variant,
+      source
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const {
+    t
+  } = (0, _react.useContext)(_context.LocaleContext);
+  const map = {
+    added: 'primary',
+    waiting: 'warning',
+    downloading: 'warning',
+    downloaded: 'primary',
+    installing: 'warning',
+    installed: 'primary',
+    starting: 'warning',
+    running: 'success',
+    stopping: 'warning',
+    stopped: 'reverse',
+    error: 'error',
+    upgrading: 'warning',
+    restarting: 'warning',
+    corrupted: 'error',
+    deleting: 'warning'
+  };
+  const colorMap = {
+    added: colors.grey,
+    waiting: colors.yellow,
+    downloading: colors.yellow,
+    downloaded: colors.grey,
+    installing: colors.yellow,
+    installed: colors.grey,
+    starting: colors.yellow,
+    running: 'success',
+    stopping: colors.yellow,
+    stopped: colors.grey,
+    error: 'error',
+    upgrading: colors.yellow,
+    restarting: colors.yellow,
+    corrupted: 'error',
+    deleting: colors.yellow
+  };
+  const inProgress = (0, _util.isInProgress)(status);
+  const statusTxt = t("blocklet.status.".concat(status));
+  if (variant === 'dot') {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
+      title: t('blocklet.statusTip', {
+        status: statusTxt
+      }),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_dot.default, _objectSpread({
+        color: colorMap[status]
+      }, rest))
+    });
+  }
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_tag.default, _objectSpread(_objectSpread({
+    type: map[status]
+  }, rest), {}, {
+    children: [inProgress && /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {
+      size: 12,
+      color: "inherit",
+      style: {
+        marginRight: 5
+      }
+    }), statusTxt]
+  }));
+}
+BlockletStatus.propTypes = {
+  status: _propTypes.default.string.isRequired,
+  variant: _propTypes.default.oneOf(['dot', 'tag']),
+  source: _propTypes.default.string
+};
+BlockletStatus.defaultProps = {
+  variant: 'tag',
+  source: ''
+};

package/lib/blocklet/storage.js

@@ -0,0 +1,322 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = Storage;
+var _react = _interopRequireWildcard(require("react"));
+var _Box = _interopRequireDefault(require("@mui/material/Box"));
+var _Connect = _interopRequireDefault(require("@arcblock/did-connect/lib/Connect"));
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _constant = require("@blocklet/constant");
+var _axios = _interopRequireDefault(require("axios"));
+var _urlJoin = _interopRequireDefault(require("url-join"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _lodash = require("lodash");
+var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
+var _material = require("@mui/material");
+var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
+var _util = require("@blocklet/meta/lib/util");
+var _blocklet = require("../../lib/contexts/blocklet");
+var _node = require("../contexts/node");
+var _toast = _interopRequireDefault(require("../../lib/toast"));
+var _spaceGatewaySelector = _interopRequireDefault(require("./component/space-gateway-selector"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: 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; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+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 _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+const Container = (0, _styled.default)('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  height: 100%;\n  overflow-y: auto;\n"])));
+
+/**
+ * @description 实时显示备份的进度
+ * @param {{appDid: string}} {appDid}
+ * @return {{message: string, progress: number, completed: boolean}}
+ */
+function useBackupProgress(_ref) {
+  let {
+    appDid
+  } = _ref;
+  const [progress, setProgress] = (0, _react.useState)({
+    message: '',
+    progress: 0,
+    completed: false
+  });
+  const node = (0, _node.useNodeContext)();
+  const webSocketClient = node.ws.getWsClient();
+  (0, _react.useEffect)(() => {
+    webSocketClient.on(_constant.BlockletEvents.backupProgress, data => {
+      if (appDid === (data === null || data === void 0 ? void 0 : data.appDid)) {
+        setProgress(preValue => _objectSpread(_objectSpread({}, preValue), data));
+      }
+    });
+    return () => {
+      webSocketClient.off(_constant.BlockletEvents.backupProgress);
+    };
+  }, [appDid, webSocketClient]);
+  return progress;
+}
+
+/**
+ *
+ *
+ * @param {import('@abtnode/client').BlockletState} blocklet
+ * @return {*}
+ */
+function useAppUrl(blocklet) {
+  var _blocklet$site, _blocklet$site$domain, _blocklet$site$domain2;
+  const appUrls = blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$site = blocklet.site) === null || _blocklet$site === void 0 ? void 0 : (_blocklet$site$domain = _blocklet$site.domainAliases) === null || _blocklet$site$domain === void 0 ? void 0 : (_blocklet$site$domain2 = _blocklet$site$domain.sort((a, b) => {
+    if (a.accessibility.accessible && b.accessibility.accessible) {
+      return +a.isProtected - +b.isProtected;
+    }
+    return +b.accessibility.accessible - +a.accessibility.accessible;
+  })) === null || _blocklet$site$domain2 === void 0 ? void 0 : _blocklet$site$domain2.map(domainAlias => {
+    var _domainAlias$domainSt;
+    const protocol = domainAlias !== null && domainAlias !== void 0 && (_domainAlias$domainSt = domainAlias.domainStatus) !== null && _domainAlias$domainSt !== void 0 && _domainAlias$domainSt.isHttps ? 'https://' : 'http://';
+    const value = domainAlias === null || domainAlias === void 0 ? void 0 : domainAlias.value;
+    return "".concat(protocol).concat(value);
+  }).filter(Boolean);
+  const appUrl = appUrls === null || appUrls === void 0 ? void 0 : appUrls[0];
+
+  // 授权的时候提供 appUrl, 因为 appUrl 可能很久都拿不到值，所以加一个 loading 效果过渡一下
+  return {
+    appUrl,
+    isReady: Boolean(appUrl)
+  };
+}
+function Storage() {
+  var _blocklet$environment;
+  /** @type {{ api: import('@abtnode/client').ABTNodeClient, info: import('@abtnode/client').NodeState  }} */
+  const {
+    api,
+    info
+  } = (0, _node.useNodeContext)();
+  const nodeDid = info.did;
+  const {
+    t,
+    locale
+  } = (0, _react.useContext)(_context.LocaleContext);
+  /** @type {{ blocklet: import('@abtnode/client').BlockletState }} */
+  const {
+    blocklet
+  } = (0, _blocklet.useBlockletContext)();
+  const [gatewayUrl, setGatewayUrl] = (0, _react.useState)('');
+  const [endpoint, setEndpoint] = (0, _react.useState)(((_blocklet$environment = blocklet.environments.find(e => e.key === _constant.BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_APP_SPACE_ENDPOINT)) === null || _blocklet$environment === void 0 ? void 0 : _blocklet$environment.value) || '');
+  const progress = useBackupProgress({
+    appDid: blocklet === null || blocklet === void 0 ? void 0 : blocklet.appDid
+  });
+  const [isLoading, setIsLoading] = (0, _react.useState)(false);
+  const appName = (0, _util.getAppName)(blocklet);
+  const appDescription = (0, _util.getAppDescription)(blocklet);
+  const {
+    appUrl,
+    isReady
+  } = useAppUrl(blocklet);
+  async function saveStorageEndpoint(did, storageEndpoint) {
+    await api.configBlocklet({
+      input: {
+        did: [did],
+        configs: [{
+          key: _constant.BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_APP_SPACES_URL,
+          value: gatewayUrl
+        }, {
+          key: _constant.BLOCKLET_CONFIGURABLE_KEY.BLOCKLET_APP_SPACE_ENDPOINT,
+          value: storageEndpoint
+        }]
+      }
+    }).then(() => {
+      _toast.default.success(t('storage.spaces.connected', locale));
+    }).catch(error => {
+      console.error(error);
+      _toast.default.error(error.message);
+    });
+  }
+  const onAuthorizeConnectSuccess = async (response, decrypt) => {
+    setEndpoint(decrypt(response.endpoint));
+    await saveStorageEndpoint(blocklet.meta.did, decrypt(response.endpoint));
+    setTimeout(() => {
+      setAuthorizeConnect(preValue => _objectSpread(_objectSpread({}, preValue), {}, {
+        open: false
+      }));
+    }, 3000);
+  };
+  const [authorizeConnect, setAuthorizeConnect] = (0, _react.useState)({
+    open: false
+  });
+
+  // eslint-disable-next-line no-shadow
+  const handleOnClickAuthorize = async gatewayUrl => {
+    if ((0, _lodash.isEmpty)(gatewayUrl)) {
+      _toast.default.error(t('storage.spaces.addressCannotEmpty', locale));
+      return;
+    }
+    setGatewayUrl(gatewayUrl);
+    setAuthorizeConnect(preValue => _objectSpread(_objectSpread({}, preValue), {}, {
+      action: 'one-click-authorization',
+      checkTimeout: 1000 * 300,
+      prefix: (0, _urlJoin.default)(gatewayUrl, 'space/api/did'),
+      baseUrl: new URL(gatewayUrl).origin,
+      checkFn: _axios.default.create({
+        baseURL: (0, _urlJoin.default)(gatewayUrl, 'space')
+      }).get,
+      extraParams: {
+        appDid: blocklet.appDid,
+        appName,
+        appDescription,
+        scopes: 'list:object read:object write:object',
+        appUrl,
+        referrer: window.location.href,
+        nodeDid
+      },
+      onClose: () => {
+        // eslint-disable-next-line no-shadow
+        setAuthorizeConnect(preValue => _objectSpread(_objectSpread({}, preValue), {}, {
+          open: false
+        }));
+      },
+      open: true
+    }));
+  };
+  const onBackup = async () => {
+    try {
+      if (isLoading) {
+        return;
+      }
+      setIsLoading(true);
+      await api.backupToSpaces({
+        input: {
+          appDid: blocklet.appDid
+        }
+      });
+      _toast.default.success(t('storage.spaces.backupSuccessfully'));
+    } catch (error) {
+      _toast.default.error(error.message);
+      console.error(error);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  (0, _react.useEffect)(() => {
+    setAuthorizeConnect(preValue => _objectSpread(_objectSpread({}, preValue), {}, {
+      messages: {
+        title: t('storage.spaces.authorize.title', {
+          appName
+        }),
+        scan: t('storage.spaces.authorize.scan', {
+          appName
+        }),
+        confirm: '',
+        success: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+          gutterBottom: true,
+          children: t('storage.spaces.authorize.success')
+        })
+      }
+    }));
+  }, [appName, locale, t]);
+  (0, _react.useEffect)(() => {
+    if (progress !== null && progress !== void 0 && progress.completed) {
+      setIsLoading(false);
+      if (progress !== null && progress !== void 0 && progress.progress) {
+        progress.progress = 0;
+      }
+    } else if (progress !== null && progress !== void 0 && progress.message) {
+      setIsLoading(true);
+    }
+  }, [progress]);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
+    style: {
+      maxWidth: '720px'
+    },
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_spaceGatewaySelector.default, {
+      sx: {
+        marginTop: '24px',
+        marginBottom: '40px'
+      },
+      onSelect: handleOnClickAuthorize,
+      endpoint: endpoint,
+      loading: !isReady
+    }), endpoint && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+      mt: 3,
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "space-between",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+        display: "inline",
+        children: [t('storage.spaces.tips'), ": \xA0", ' ', /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          display: "inline",
+          color: "primary.main",
+          fontWeight: "fontWeightBold",
+          children: t('storage.spaces.connected')
+        })]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
+        onClick: onBackup,
+        loading: isLoading,
+        variant: "contained",
+        color: "primary",
+        "data-cy": "add-domain-alias",
+        disabled: !endpoint || isLoading,
+        children: t('storage.spaces.backup')
+      })]
+    }), isLoading && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+      sx: {
+        overflow: 'hidden'
+      },
+      display: "flex",
+      flexDirection: "column",
+      justifyContent: "center",
+      textAlign: "center",
+      marginTop: "16px",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+        color: "primary",
+        children: progress === null || progress === void 0 ? void 0 : progress.message
+      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+        sx: {
+          display: 'flex',
+          alignItems: 'center'
+        },
+        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          sx: {
+            width: '100%',
+            mr: 1
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.LinearProgress, {
+            color: "primary",
+            variant: "indeterminate",
+            value: progress === null || progress === void 0 ? void 0 : progress.progress
+          })
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+          sx: {
+            minWidth: 35
+          },
+          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Typography.default, {
+            variant: "body2",
+            color: "text.secondary",
+            children: [progress === null || progress === void 0 ? void 0 : progress.progress, "%"]
+          })
+        })]
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Connect.default, {
+      forceConnected: false,
+      saveConnect: false,
+      prefix: authorizeConnect.prefix,
+      open: authorizeConnect.open,
+      popup: true,
+      action: authorizeConnect.action,
+      baseUrl: authorizeConnect.baseUrl,
+      checkFn: authorizeConnect.checkFn,
+      onSuccess: onAuthorizeConnectSuccess,
+      onClose: authorizeConnect.onClose,
+      checkTimeout: authorizeConnect.checkTimeout,
+      extraParams: authorizeConnect.extraParams,
+      messages: authorizeConnect.messages,
+      locale: locale
+    })]
+  });
+}
+Storage.propTypes = {};

package/lib/blocklet/types.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DomainType = void 0;
+var _propTypes = _interopRequireDefault(require("prop-types"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+// eslint-disable-next-line import/prefer-default-export
+const DomainType = _propTypes.default.shape({
+  href: _propTypes.default.string,
+  accessibility: _propTypes.default.shape({
+    loading: _propTypes.default.bool,
+    accessible: _propTypes.default.bool
+  }),
+  domainStatus: _propTypes.default.shape({
+    isHttps: _propTypes.default.bool,
+    matchedCert: _propTypes.default.object
+  }),
+  dns: _propTypes.default.shape({
+    resolved: _propTypes.default.bool,
+    ip: _propTypes.default.string
+  })
+});
+exports.DomainType = DomainType;