@abtnode/ux 1.16.8-beta-ca58a421 → 1.16.8-beta-81db8efa

package/lib/blocklet/audit-logs.js

@@ -82,6 +82,7 @@ function AuditLog(_ref2) {
         }), ' ', "- ", log.action]
       }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
         className: "log-content",
+        maxWidth: "lg",
         color: "textPrimary",
         component: "div",
         "data-color-mode": "light",

package/lib/blocklet/component/add.js

@@ -550,7 +550,7 @@ function AddComponent(_ref2) {
     if (config) {
       doc = _objectSpread(_objectSpread({}, doc), {}, {
         pathPrefix: config.mountPoint,
-        title: config.meta.title,
+        title: title || '',
         componentName: config.meta.name,
         // use history's environments
         hasEnvironmentsStep: false
@@ -824,22 +824,6 @@ function AddComponent(_ref2) {
             value: (0, _util2.formatMountPoint)(pathPrefix)
           }));
         }
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TextField.default, {
-        label: t('common.title'),
-        autoComplete: "off",
-        variant: "outlined",
-        fullWidth: true,
-        style: {
-          marginBottom: 32
-        },
-        margin: "normal",
-        value: params.title,
-        onChange: e => {
-          const title = e.target.value;
-          setParams(_objectSpread(_objectSpread({}, params), {}, {
-            title
-          }));
-        }
       }), !!error && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Alert.default, {
         type: "error",
         style: {

package/lib/blocklet/component/setting.js

@@ -51,24 +51,6 @@ function ComponentSetting(_ref) {
   if (blocklet.status === 'unknown' && (0, _util.isInstalling)(blocklet.status)) {
     return null;
   }
-  const onSubmitTitle = async value => {
-    setLoading(true);
-    try {
-      setLoading(false);
-      await api.updateComponentTitle({
-        input: {
-          rootDid,
-          did: blocklet.meta.did,
-          title: value
-        }
-      });
-    } catch (err) {
-      setLoading(false);
-      err.message = (0, _util.formatError)(err);
-      _toast.default.error(err.message);
-      throw err;
-    }
-  };
   const onSubmitMountPoint = async value => {
     setLoading(true);
     try {
@@ -99,19 +81,9 @@ function ComponentSetting(_ref) {
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(Div, _objectSpread(_objectSpread({
     component: "div"
   }, rest), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
       mt: 3,
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_formTextInput.default, {
-        label: t('common.title'),
-        style: {
-          marginTop: -24
-        },
-        disabled: loading || disabled,
-        loading: loading,
-        required: true,
-        initialValue: blocklet.meta.title,
-        onSubmit: onSubmitTitle
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_formTextInput.default, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_formTextInput.default, {
         label: t('blocklet.component.mountPoint'),
         style: {
           marginTop: -24
@@ -124,7 +96,7 @@ function ComponentSetting(_ref) {
         onChange: handleMountPointChange,
         helperText: mountPointHelperText,
         formatterBeforeSubmit: value => (0, _urlPathFriendly.default)(value)
-      })]
+      })
     })
   }));
 }

package/lib/blocklet/component/switch-control.js

@@ -0,0 +1,64 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var _Switch = _interopRequireDefault(require("@arcblock/ux/lib/Switch"));
+var _jsxRuntime = require("react/jsx-runtime");
+var _templateObject;
+const _excluded = ["labelProps", "className", "style"];
+/**
+ * 该组件的对 UX 中 iOS 风格的 Switch 组件包装, 统一布局
+ * 具体参考: https://github.com/ArcBlock/blocklet-server/issues/4809
+ *
+ * - label 在左, 切换器在右
+ * - 整体宽度控制, 宽屏下 max-width 为 300px 避免 label 与 switch 相隔太远, 窄屏下 100% 宽度
+ */
+/**
+ * @description
+ * @param {{
+ *  labelProps: object,
+ *  className: string;
+ *  style: import('react').CSSProperties
+ * } & import('@mui/material').SwitchProps} { labelProps, className, style, ...rest }
+ * @return {*}
+ */
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+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; }
+function SwitchControl(_ref) {
+  let {
+      labelProps,
+      className,
+      style
+    } = _ref,
+    rest = _objectWithoutProperties(_ref, _excluded);
+  const _labelProps = _objectSpread(_objectSpread({}, labelProps), {}, {
+    labelPlacement: (labelProps === null || labelProps === void 0 ? void 0 : labelProps.labelPlacement) || 'start'
+  });
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Root, {
+    className: className,
+    style: style,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Switch.default, _objectSpread({
+      labelProps: _labelProps
+    }, rest))
+  });
+}
+SwitchControl.propTypes = _Switch.default.propTypes;
+SwitchControl.defaultProps = _Switch.default.defaultProps;
+const Root = _styled.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  max-width: 300px;\n  > label {\n    display: flex;\n    justify-content: space-between;\n    width: 100%;\n    margin-left: 0;\n    margin-right: 0;\n  }\n  ", " {\n    max-width: 100%;\n  }\n"])), _ref2 => {
+  let {
+    theme
+  } = _ref2;
+  return theme.breakpoints.down('sm');
+});
+var _default = SwitchControl;
+exports.default = _default;

package/lib/blocklet/notification/email.js

@@ -0,0 +1,261 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _material = require("@mui/material");
+var _pick = _interopRequireDefault(require("lodash/pick"));
+var _ahooks = require("ahooks");
+var _reactHookForm = require("react-hook-form");
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _isEmail = _interopRequireDefault(require("validator/lib/isEmail"));
+var _isURL = _interopRequireDefault(require("validator/lib/isURL"));
+var _isPort = _interopRequireDefault(require("validator/lib/isPort"));
+var _node = require("../../contexts/node");
+var _blocklet = require("../../contexts/blocklet");
+var _toast = _interopRequireDefault(require("../../toast"));
+var _jsxRuntime = require("react/jsx-runtime");
+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); }
+const defaultFormValues = {
+  enabled: false,
+  from: '',
+  host: '',
+  port: '',
+  user: '',
+  password: ''
+};
+function NotificationEmail() {
+  var _blocklet$meta, _blocklet$settings, _blocklet$settings$no;
+  const {
+    api
+  } = (0, _node.useNodeContext)();
+  const {
+    blocklet
+  } = (0, _blocklet.useBlockletContext)();
+  const {
+    t
+  } = (0, _context.useLocaleContext)();
+  const did = blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$meta = blocklet.meta) === null || _blocklet$meta === void 0 ? void 0 : _blocklet$meta.did;
+  const config = Object.assign(_objectSpread({}, defaultFormValues), (blocklet === null || blocklet === void 0 ? void 0 : (_blocklet$settings = blocklet.settings) === null || _blocklet$settings === void 0 ? void 0 : (_blocklet$settings$no = _blocklet$settings.notification) === null || _blocklet$settings$no === void 0 ? void 0 : _blocklet$settings$no.email) || {});
+  const {
+    handleSubmit,
+    control,
+    formState,
+    watch,
+    reset
+  } = (0, _reactHookForm.useForm)({
+    defaultValues: (0, _pick.default)(config, Object.keys(defaultFormValues))
+  });
+  const enabled = watch('enabled');
+  const onSubmit = (0, _ahooks.useMemoizedFn)(async data => {
+    try {
+      var _blockletChanged$sett, _blockletChanged$sett2;
+      const {
+        blocklet: blockletChanged
+      } = await api.configNotification({
+        input: {
+          did,
+          notification: JSON.stringify({
+            email: data
+          })
+        }
+      });
+      const defaultValues = Object.assign(_objectSpread({}, defaultFormValues), (blockletChanged === null || blockletChanged === void 0 ? void 0 : (_blockletChanged$sett = blockletChanged.settings) === null || _blockletChanged$sett === void 0 ? void 0 : (_blockletChanged$sett2 = _blockletChanged$sett.notification) === null || _blockletChanged$sett2 === void 0 ? void 0 : _blockletChanged$sett2.email) || {});
+      // 将当前表单的默认值重置为新的数据，这样能够修正页面的 isDirty 数据
+      reset(defaultValues);
+      _toast.default.success(t('oauth.saveSuccess'));
+    } catch (err) {
+      _toast.default.error(err.message || t('oauth.saveFailed'));
+    }
+  });
+  const validateFrom = (0, _ahooks.useMemoizedFn)(value => {
+    const val = value === null || value === void 0 ? void 0 : value.trim();
+    if (!val) {
+      return t('notification.email.fromRequired');
+    }
+    if (!(0, _isEmail.default)(val)) {
+      return t('notification.email.fromInvalid');
+    }
+    return true;
+  });
+  const validateHost = (0, _ahooks.useMemoizedFn)(value => {
+    const val = value === null || value === void 0 ? void 0 : value.trim();
+    if (!val) {
+      return t('notification.email.hostRequired');
+    }
+    if (!(0, _isURL.default)(val, {
+      require_host: false,
+      protocols: []
+    })) {
+      return t('notification.email.hostInvalid');
+    }
+    return true;
+  });
+  const validatePort = (0, _ahooks.useMemoizedFn)(val => {
+    if (!val) {
+      return t('notification.email.portRequired');
+    }
+    if (!(0, _isPort.default)(val)) {
+      return t('notification.email.portInvalid');
+    }
+    return true;
+  });
+  const validateUser = (0, _ahooks.useMemoizedFn)(val => {
+    if (!(val !== null && val !== void 0 && val.trim())) {
+      return t('notification.email.userRequired');
+    }
+    return true;
+  });
+  const validatePassword = (0, _ahooks.useMemoizedFn)(val => {
+    if (!(val !== null && val !== void 0 && val.trim())) {
+      return t('notification.email.passportRequired');
+    }
+    return true;
+  });
+  const noop = (0, _ahooks.useMemoizedFn)(() => true);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("form", {
+      onSubmit: handleSubmit(onSubmit),
+      disabled: true,
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "enabled",
+        control: control,
+        render: _ref => {
+          let {
+            field
+          } = _ref;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControlLabel, {
+            control: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Switch, _objectSpread({
+              checked: field.value
+            }, field)),
+            label: t('notification.email.enable'),
+            sx: {
+              marginBottom: '8px'
+            }
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "from",
+        control: control,
+        rules: {
+          validate: enabled ? validateFrom : noop
+        },
+        render: _ref2 => {
+          var _formState$errors$fie;
+          let {
+            field
+          } = _ref2;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              label: t('notification.email.from'),
+              error: !!formState.errors[field.name],
+              helperText: ((_formState$errors$fie = formState.errors[field.name]) === null || _formState$errors$fie === void 0 ? void 0 : _formState$errors$fie.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "host",
+        control: control,
+        rules: {
+          validate: enabled ? validateHost : noop
+        },
+        render: _ref3 => {
+          var _formState$errors$fie2;
+          let {
+            field
+          } = _ref3;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              error: !!formState.errors[field.name],
+              label: t('notification.email.host'),
+              helperText: ((_formState$errors$fie2 = formState.errors[field.name]) === null || _formState$errors$fie2 === void 0 ? void 0 : _formState$errors$fie2.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "port",
+        control: control,
+        rules: {
+          validate: enabled ? validatePort : noop
+        },
+        render: _ref4 => {
+          var _formState$errors$fie3;
+          let {
+            field
+          } = _ref4;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              type: "number",
+              error: !!formState.errors[field.name],
+              label: t('notification.email.port'),
+              helperText: ((_formState$errors$fie3 = formState.errors[field.name]) === null || _formState$errors$fie3 === void 0 ? void 0 : _formState$errors$fie3.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "user",
+        control: control,
+        rules: {
+          validate: enabled ? validateUser : noop
+        },
+        render: _ref5 => {
+          var _formState$errors$fie4;
+          let {
+            field
+          } = _ref5;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              error: !!formState.errors[field.name],
+              label: t('notification.email.user'),
+              helperText: ((_formState$errors$fie4 = formState.errors[field.name]) === null || _formState$errors$fie4 === void 0 ? void 0 : _formState$errors$fie4.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactHookForm.Controller, {
+        name: "password",
+        control: control,
+        rules: {
+          validate: enabled ? validatePassword : noop
+        },
+        render: _ref6 => {
+          var _formState$errors$fie5;
+          let {
+            field
+          } = _ref6;
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.FormControl, {
+            fullWidth: true,
+            children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.TextField, _objectSpread(_objectSpread({}, field), {}, {
+              type: "password",
+              error: !!formState.errors[field.name],
+              label: t('notification.email.password'),
+              helperText: ((_formState$errors$fie5 = formState.errors[field.name]) === null || _formState$errors$fie5 === void 0 ? void 0 : _formState$errors$fie5.message) || '　',
+              disabled: !enabled
+            }))
+          });
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Button, {
+        type: "submit",
+        variant: "contained",
+        onSubmit: handleSubmit(onSubmit),
+        disabled: !formState.isDirty,
+        children: t('oauth.save')
+      })]
+    })
+  });
+}
+var _default = NotificationEmail;
+exports.default = _default;

package/lib/blocklet/notification/index.js

@@ -0,0 +1,49 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _Tabs = _interopRequireDefault(require("@arcblock/ux/lib/Tabs"));
+var _material = require("@mui/material");
+var _ahooks = require("ahooks");
+var _react = require("react");
+var _email = _interopRequireDefault(require("./email"));
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const tabs = [{
+  label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+    textAlign: "center",
+    width: "100%",
+    children: "Email"
+  }),
+  value: 'email'
+}, {
+  label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+    textAlign: "center",
+    width: "100%",
+    children: "More"
+  }),
+  value: 'more'
+}];
+function BlockletNotification() {
+  const [currentTab, setCurrentTab] = (0, _react.useState)(tabs[0].value);
+  const contents = (0, _ahooks.useCreation)(() => ({
+    email: /*#__PURE__*/(0, _jsxRuntime.jsx)(_email.default, {}),
+    more: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+      children: "TBD"
+    })
+  }), []);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Tabs.default, {
+      tabs: tabs,
+      current: currentTab,
+      onChange: setCurrentTab
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+      marginTop: "10px",
+      children: contents[currentTab]
+    })]
+  });
+}
+var _default = BlockletNotification;
+exports.default = _default;

package/lib/blocklet/preferences/index.js

@@ -14,6 +14,7 @@ var _material = require("@mui/material");
 var _TuneRounded = _interopRequireDefault(require("@mui/icons-material/TuneRounded"));
 var _Key = _interopRequireDefault(require("@mui/icons-material/Key"));
 var _Login = _interopRequireDefault(require("@mui/icons-material/Login"));
+var _NotificationsNone = _interopRequireDefault(require("@mui/icons-material/NotificationsNone"));
 var _SettingsOutlined = _interopRequireDefault(require("@mui/icons-material/SettingsOutlined"));
 var _ChevronRight = _interopRequireDefault(require("@mui/icons-material/ChevronRight"));
 var _ExpandMore = _interopRequireDefault(require("@mui/icons-material/ExpandMore"));
@@ -22,6 +23,7 @@ var _Tabs = _interopRequireDefault(require("@arcblock/ux/lib/Tabs"));
 var _util = require("@blocklet/meta/lib/util");
 var _bundleAvatar = _interopRequireDefault(require("../bundle-avatar"));
 var _configuration = _interopRequireDefault(require("../configuration"));
+var _notification = _interopRequireDefault(require("../notification"));
 var _index = _interopRequireDefault(require("../access/index"));
 var _node = require("../../contexts/node");
 var _oauth = _interopRequireDefault(require("../oauth"));
@@ -149,6 +151,26 @@ function BlockletPreferences(_ref) {
       })]
     }, "oauth"),
     value: 'oauth'
+  }, {
+    label: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
+      display: "flex",
+      alignItems: "center",
+      "data-cy": "configuration-tab-notification",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_NotificationsNone.default, {
+        sx: {
+          fontSize: 24
+        }
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+        ml: "16px",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
+          style: {
+            color: '#222'
+          },
+          children: t('common.notification')
+        })
+      })]
+    }, "notification"),
+    value: 'notification'
   }, {
     label: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
       display: "flex",
@@ -200,6 +222,8 @@ function BlockletPreferences(_ref) {
     content = /*#__PURE__*/(0, _jsxRuntime.jsx)(_index.default, {});
   } else if (current === 'oauth') {
     content = /*#__PURE__*/(0, _jsxRuntime.jsx)(_oauth.default, {});
+  } else if (current === 'notification') {
+    content = /*#__PURE__*/(0, _jsxRuntime.jsx)(_notification.default, {});
   } else {
     // eslint-disable-next-line no-nested-ternary
     const pathPrefix = inService ? _constant.WELLKNOWN_SERVICE_PATH_PREFIX : process.env.NODE_ENV === 'production' ? info.routing.adminPath : '';

package/lib/blocklet/storage/add.js

@@ -132,7 +132,8 @@ function AddDIDSpacesGateWay(_ref) {
                   e.preventDefault();
                   await onConfirm();
                 }
-              }
+              },
+              autoFocus: true
             })
           })
         })

package/lib/blocklet/storage/index.js

@@ -23,6 +23,7 @@ var _blocklet = require("../../../lib/contexts/blocklet");
 var _toast = _interopRequireDefault(require("../../toast"));
 var _switchDidSpaces = _interopRequireDefault(require("./switch-did-spaces"));
 var _spaces = require("../../util/spaces");
+var _switchControl = _interopRequireDefault(require("../component/switch-control"));
 var _jsxRuntime = require("react/jsx-runtime");
 var _templateObject;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -315,22 +316,19 @@ function Storage() {
               children: t('storage.spaces.strategy.backupNow')
             })
           })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
-          marginTop: "16px",
-          display: "flex",
-          alignItems: "center",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
-            flex: 1,
-            children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-              children: [t('storage.spaces.strategy.autoBackup'), ": "]
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Tooltip, {
-              title: "coming soon",
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Switch, {
-                size: "small",
-                disabled: true
+        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Divider, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_switchControl.default, {
+          name: "enable-auto-backup",
+          disabled: true,
+          labelProps: {
+            label: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+                children: t('storage.spaces.strategy.autoBackup')
               })
-            })]
-          })
+            })
+          },
+          style: {
+            marginTop: 16
+          }
         }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
           marginTop: "16px",
           display: "flex",

package/lib/blocklet/storage/switch-did-spaces.js

@@ -89,10 +89,15 @@ function SwitchDIDSpaces(_ref) {
   const {
     api: nodeApi
   } = (0, _node.useNodeContext)();
-  const [selectedGateway, setSelectedGateway] = (0, _react.useState)({});
+  const prodSpacesGateway = {
+    name: 'Prod DID Spaces',
+    url: 'https://www.didspaces.com/app',
+    protected: true
+  };
+  const [selectedGateway, setSelectedGateway] = (0, _react.useState)(prodSpacesGateway);
   const [connectedGateway, setConnectedGateway] = (0, _react.useState)(null);
   (0, _ahooks.useAsyncEffect)(async () => {
-    var _spaceGateways$find;
+    var _spaceGateways$find, _spaceGateways$find2;
     const {
       spaceGateways: _spaceGateways
     } = await nodeApi.getBlockletSpaceGateways({
@@ -100,16 +105,9 @@ function SwitchDIDSpaces(_ref) {
         did: blocklet.meta.did
       }
     });
-    setSpaceGateways([{
-      name: 'Prod DID Spaces',
-      url: 'https://www.didspaces.com/app',
-      protected: true
-    }, ...(_spaceGateways !== null && _spaceGateways !== void 0 ? _spaceGateways : [])]);
+    setSpaceGateways([prodSpacesGateway, ...(_spaceGateways !== null && _spaceGateways !== void 0 ? _spaceGateways : [])]);
     setConnectedGateway((_spaceGateways$find = _spaceGateways.find(spaceGateway => spaceBackupEndpoint.includes(spaceGateway === null || spaceGateway === void 0 ? void 0 : spaceGateway.url))) !== null && _spaceGateways$find !== void 0 ? _spaceGateways$find : {});
-    if ((0, _lodash.isEmpty)(selectedGateway)) {
-      var _spaceGateways$find2;
-      setSelectedGateway((_spaceGateways$find2 = _spaceGateways.find(spaceGateway => spaceBackupEndpoint.includes(spaceGateway === null || spaceGateway === void 0 ? void 0 : spaceGateway.url))) !== null && _spaceGateways$find2 !== void 0 ? _spaceGateways$find2 : {});
-    }
+    setSelectedGateway((_spaceGateways$find2 = _spaceGateways.find(spaceGateway => spaceBackupEndpoint.includes(spaceGateway === null || spaceGateway === void 0 ? void 0 : spaceGateway.url))) !== null && _spaceGateways$find2 !== void 0 ? _spaceGateways$find2 : prodSpacesGateway);
   }, [blocklet]);
 
   /**

package/lib/hooks/blocklet.js

@@ -112,8 +112,7 @@ function useBlocklet(_ref) {
         blocklet: data
       } = await client.getBlocklet({
         input: {
-          did,
-          attachRuntimeInfo: false
+          did
         }
       });
       if (data) {

package/lib/locales/en.js

@@ -210,6 +210,7 @@ module.exports = {
     noData: 'No records to display',
     notice: 'Unexpected bad things will happen if you don’t read this!',
     noticeTitle: 'Notice',
+    notification: 'Notification',
     open: 'Open',
     management: 'Management',
     os: 'Operating System',
@@ -295,7 +296,7 @@ module.exports = {
     normal: 'Normal',
     gateway: 'Gateway',
     verifyNFT: 'Verify NFT',
-    errorMessage: 'Error Message:',
+    errorMessage: 'Error Message: ',
     slugifyHint: 'The actual mount point will be: {value}',
     strategy: 'Strategy',
     auto: 'Auto',
@@ -750,7 +751,23 @@ module.exports = {
     viewAll: 'View All',
     showRead: 'Show Read',
     markAllAsRead: 'Mark All as Read',
-    markAsRead: 'Mark As Read'
+    markAsRead: 'Mark As Read',
+    email: {
+      enable: 'Enable email notification',
+      from: 'Email sender',
+      host: 'SMTP server host',
+      port: 'SMTP server port',
+      user: 'SMTP server username',
+      password: 'SMTP server user password',
+      fromRequired: 'Email sender is required',
+      fromInvalid: 'Email sender is invalid',
+      hostRequired: 'SMTP server host is required',
+      hostInvalid: 'SMTP server host is invalid',
+      portRequired: 'SMTP server port is required',
+      portInvalid: 'SMTP server port is invalid, port should be between 1 and 65535',
+      userRequired: 'SMTP server username is required',
+      passwordRequired: 'SMTP server user password is required'
+    }
   },
   router: {
     routerSetting: 'Domains & URLs',
@@ -1210,7 +1227,8 @@ module.exports = {
       launchFailed: 'Failed to launch the Blocklet, please try again',
       installedButStopped: 'The Blocklet is installed successfully, but cannot be started. You can start it manually after resolving blocking issues',
       installedButError: 'The Blocklet is successfully installed, but failed to start',
-      upgradeFailed: 'Upgrade Failed'
+      upgradeFailed: 'Upgrade Failed',
+      restoreFailed: 'Failed to restore blocklet, please try again'
     },
     steps: {
       introduction: 'Introduction',
@@ -1317,7 +1335,7 @@ module.exports = {
       authorize: {
         title: 'Connect {appName} to DID Spaces',
         scan: 'Use your DID Wallet to scan the QR code below to allow the app {appName} to connect to DID Spaces',
-        success: 'Connection successful'
+        success: 'Connected successfully'
       },
       backup: 'Backup',
       backupSuccessfully: 'Backup successfully',
@@ -1358,8 +1376,8 @@ module.exports = {
         title: 'Backup progress'
       },
       record: {
-        title: 'Backup record',
-        emptyData: 'No record'
+        title: 'Backup records',
+        emptyData: 'No records'
       },
       notYet: "You don't have a backup in progress yet..."
     }

package/lib/locales/zh.js

@@ -215,6 +215,7 @@ module.exports = {
     noData: '暂无数据',
     notice: '请确认下面的信息',
     noticeTitle: '提示',
+    notification: '通知',
     open: '打开',
     management: '管理',
     os: '操作系统',
@@ -753,7 +754,23 @@ module.exports = {
     viewAll: '查看所有动态',
     showRead: '显示已读',
     markAllAsRead: '全部标记为已读',
-    markAsRead: '标记为已读'
+    markAsRead: '标记为已读',
+    email: {
+      enable: '是否开启 Email 通知',
+      from: '发件人邮箱',
+      host: 'SMTP 服务地址',
+      port: 'SMTP 服务端口',
+      user: 'SMTP 服务用户名',
+      password: 'SMTP 服务用户密码',
+      fromRequired: '请输入发件人邮箱',
+      fromInvalid: '发件人邮箱格式不正确',
+      hostRequired: '请输入 SMTP 服务地址',
+      hostInvalid: '请输入 SMTP 服务地址格式不正确',
+      portRequired: '请输入 SMTP 服务端口',
+      portInvalid: '请输入 SMTP 服务端口，端口号应该在 0-65535 之间',
+      userRequired: '请输入 SMTP 服务用户名',
+      passwordRequired: '请输入 SMTP 服务用户密码'
+    }
   },
   router: {
     routerSetting: '域名和网址',
@@ -1215,7 +1232,8 @@ module.exports = {
       launchFailed: '启动应用失败，请重试',
       installedButStopped: '应用安装成功，但是无法启动，解决启动问题之后后可手动启动',
       installedButError: '应用已经安装，但是运行出错了',
-      upgradeFailed: '更新失败'
+      upgradeFailed: '更新失败',
+      restoreFailed: '还原应用失败,请重试'
     },
     steps: {
       introduction: '简介',

package/lib/team/members/passports.js

@@ -257,12 +257,12 @@ function Passports(_ref2) {
                   className: "status-icons",
                   children: [!!appIdList.length && !appIdList.includes(x.issuer.id) && /*#__PURE__*/(0, _jsxRuntime.jsx)(_ExternalIssuerIcon.default, {}), x.revoked && /*#__PURE__*/(0, _jsxRuntime.jsx)(_RevokeIcon.default, {})]
                 })]
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
+              }), x.expirationDate && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
                 className: "title",
                 display: "flex",
                 alignItems: "center",
                 children: t('team.passport.validUntil', {
-                  date: x.expirationDate || '-'
+                  date: x.expirationDate
                 })
               }), !!appIdList.length && !appIdList.includes(x.issuer.id) && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
                 className: "tip",

package/lib/util/index.js

@@ -263,6 +263,11 @@ function formatTime(date) {
 function formatDateTime(date) {
   return (0, _dayjs.default)(date).format('YYYY-MM-DD HH:mm');
 }
+/**
+ *
+ * @param { {message: string} | {errors: {message: string}[] }} error
+ * @returns {string}
+ */
 const formatError = error => {
   if (Array.isArray(error.errors)) {
     return error.errors.map(x => x.message).join('\n');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@abtnode/ux",
-  "version": "1.16.8-beta-ca58a421",
+  "version": "1.16.8-beta-81db8efa",
   "description": "UX components shared across abtnode packages",
   "publishConfig": {
     "access": "public"
@@ -13,6 +13,7 @@
     "lint": "eslint src",
     "lint:fix": "eslint src --fix",
     "prepublishOnly": "npm run build",
+    "prebuild": "rm -fr lib/",
     "build": "babel src --out-dir lib --copy-files",
     "watch": "babel src --out-dir lib -w --copy-files",
     "coverage": "npm run test -- --coverage",
@@ -22,22 +23,22 @@
   "author": "linchen <linchen1987@foxmail.com> (http://github.com/linchen1987)",
   "license": "MIT",
   "dependencies": {
-    "@abtnode/auth": "1.16.8-beta-ca58a421",
-    "@abtnode/constant": "1.16.8-beta-ca58a421",
-    "@abtnode/util": "1.16.8-beta-ca58a421",
+    "@abtnode/auth": "1.16.8-beta-81db8efa",
+    "@abtnode/constant": "1.16.8-beta-81db8efa",
+    "@abtnode/util": "1.16.8-beta-81db8efa",
     "@ahooksjs/use-url-state": "^3.5.1",
     "@arcblock/did": "^1.18.78",
-    "@arcblock/did-connect": "^2.5.37",
+    "@arcblock/did-connect": "^2.5.39",
     "@arcblock/did-motif": "^1.1.10",
-    "@arcblock/icons": "^2.5.37",
-    "@arcblock/react-hooks": "^2.5.37",
-    "@arcblock/terminal": "^2.5.37",
-    "@arcblock/ux": "^2.5.37",
-    "@blocklet/constant": "1.16.8-beta-ca58a421",
+    "@arcblock/icons": "^2.5.39",
+    "@arcblock/react-hooks": "^2.5.39",
+    "@arcblock/terminal": "^2.5.39",
+    "@arcblock/ux": "^2.5.39",
+    "@blocklet/constant": "1.16.8-beta-81db8efa",
     "@blocklet/launcher-layout": "2.0.39",
     "@blocklet/list": "^0.11.24",
-    "@blocklet/meta": "1.16.8-beta-ca58a421",
-    "@blocklet/ui-react": "^2.5.37",
+    "@blocklet/meta": "1.16.8-beta-81db8efa",
+    "@blocklet/ui-react": "^2.5.39",
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
     "@iconify/react": "^4.0.0",
@@ -82,7 +83,8 @@
     "react-sortable-tree-theme-material-ui": "^1.0.16",
     "react-use": "^17.4.0",
     "ufo": "^1.0.1",
-    "url-join": "^4.0.1"
+    "url-join": "^4.0.1",
+    "validator": "^13.9.0"
   },
   "devDependencies": {
     "@babel/cli": "^7.19.3",
@@ -92,5 +94,5 @@
     "@babel/preset-react": "^7.18.6",
     "babel-plugin-inline-react-svg": "^1.1.2"
   },
-  "gitHead": "d0f724c8082572a01b6e9287df6c3d0663ec9c57"
+  "gitHead": "8c4e3190de79a1fb2aaa14646255d938324cc5c2"
 }