@blocklet/ui-react 2.9.13 → 2.9.14

package/lib/UserCenter/components/user-info.js

@@ -0,0 +1,94 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+module.exports = UserInfo;
+var _jsxRuntime = require("react/jsx-runtime");
+var _material = require("@mui/material");
+var _react = require("@iconify/react");
+var _ahooks = require("ahooks");
+var _mailOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/mail-outline-rounded"));
+var _scheduleOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/schedule-outline-rounded"));
+var _moreTimeRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/more-time-rounded"));
+var _captivePortalRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/captive-portal-rounded"));
+var _util = require("@arcblock/ux/lib/Locale/util");
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _RelativeTime = _interopRequireDefault(require("@arcblock/ux/lib/RelativeTime"));
+var _userInfoItem = _interopRequireDefault(require("./user-info-item"));
+var _locales = require("../libs/locales");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function UserInfo({
+  user,
+  ...rest
+}) {
+  const {
+    locale
+  } = (0, _context.useLocaleContext)();
+  const t = (0, _ahooks.useMemoizedFn)((key, data = {}) => {
+    return (0, _util.translate)(_locales.translations, key, locale, "en", data);
+  });
+  const readableProvider = (0, _ahooks.useCreation)(() => {
+    const nameMap = {
+      wallet: "DID Wallet",
+      auth0: "Auth0"
+    };
+    return nameMap[user.sourceProvider] || t("unknown");
+  }, [user?.sourceProvider]);
+  const userInfoListData = [];
+  userInfoListData.push({
+    icon: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+      fontSize: 16,
+      icon: _mailOutlineRounded.default
+    }),
+    title: t("email"),
+    content: user?.email || t("emptyField")
+  });
+  userInfoListData.push({
+    icon: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+      fontSize: 16,
+      icon: _scheduleOutlineRounded.default
+    }),
+    title: t("lastLogin"),
+    content: /* @__PURE__ */(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+      children: user?.lastLoginAt || user?.lastLoginIp ? /* @__PURE__ */(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+        children: [user?.lastLoginAt ? /* @__PURE__ */(0, _jsxRuntime.jsx)(_RelativeTime.default, {
+          locale,
+          value: user?.lastLoginAt
+        }) : null, user?.lastLoginAt && user?.lastLoginIp ? /* @__PURE__ */(0, _jsxRuntime.jsx)("br", {}) : null, user?.lastLoginIp]
+      }) : t("unknown")
+    })
+  });
+  userInfoListData.push({
+    icon: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+      fontSize: 16,
+      icon: _moreTimeRounded.default
+    }),
+    title: t("createdAt"),
+    content: user?.createdAt ? /* @__PURE__ */(0, _jsxRuntime.jsx)(_RelativeTime.default, {
+      locale,
+      value: user?.createdAt
+    }) : t("unknown")
+  });
+  userInfoListData.push({
+    icon: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+      fontSize: 16,
+      icon: _captivePortalRounded.default
+    }),
+    title: t("registerFrom"),
+    content: readableProvider
+  });
+  return /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Paper, {
+    variant: "outlined",
+    ...rest,
+    sx: {
+      display: "flex",
+      flexDirection: "column",
+      gap: 3,
+      ...rest?.sx
+    },
+    children: userInfoListData.map(item => /* @__PURE__ */(0, _jsxRuntime.jsx)(_userInfoItem.default, {
+      data: item
+    }, item.title))
+  });
+}

package/lib/UserCenter/components/webhook-item.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { WebhookItemProps } from '../../@types';
+export default function WebhookItem({ onTest, onDelete, onSave, onCancel, type, url, edit, }: WebhookItemProps): import("react").JSX.Element;

package/lib/UserCenter/components/webhook-item.js

@@ -0,0 +1,236 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+module.exports = WebhookItem;
+var _jsxRuntime = require("react/jsx-runtime");
+var _material = require("@mui/material");
+var _ahooks = require("ahooks");
+var _noop = _interopRequireDefault(require("lodash/noop"));
+var _isUrl = _interopRequireDefault(require("is-url"));
+var _Colors = require("@arcblock/ux/lib/Colors");
+var _react = require("@iconify/react");
+var _closeRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/close-rounded"));
+var _check = _interopRequireDefault(require("@iconify-icons/material-symbols/check"));
+var _sendRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/send-rounded"));
+var _editSquareOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/edit-square-outline-rounded"));
+var _deleteOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/delete-outline-rounded"));
+var _util = require("@arcblock/ux/lib/Locale/util");
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _locales = require("../libs/locales");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function WebhookItem({
+  onTest = _noop.default,
+  onDelete = _noop.default,
+  onSave = _noop.default,
+  onCancel = _noop.default,
+  type = "slack",
+  url = "",
+  edit = false
+}) {
+  const {
+    locale
+  } = (0, _context.useLocaleContext)();
+  const t = (0, _ahooks.useMemoizedFn)((key, data = {}) => {
+    return (0, _util.translate)(_locales.translations, key, locale, "en", data);
+  });
+  const currentState = (0, _ahooks.useReactive)({
+    type: type || "slack",
+    url: url || "",
+    edit: edit ?? false,
+    error: "",
+    loading: false
+  });
+  const checkUrl = (0, _ahooks.useMemoizedFn)(() => {
+    if (!currentState.url) {
+      currentState.error = t("common.required");
+      return false;
+    }
+    if (!(0, _isUrl.default)(currentState.url)) {
+      currentState.error = t("common.invalid");
+      return false;
+    }
+    currentState.error = "";
+    return true;
+  });
+  const handleClose = (0, _ahooks.useMemoizedFn)(() => {
+    currentState.edit = false;
+    currentState.url = url || "";
+    currentState.type = type || "slack";
+    currentState.error = "";
+    currentState.loading = false;
+    onCancel();
+  });
+  const _onTest = (0, _ahooks.useMemoizedFn)(async data => {
+    currentState.loading = true;
+    await onTest(data);
+    currentState.loading = false;
+  });
+  const onSubmit = (0, _ahooks.useMemoizedFn)(fn => {
+    return () => {
+      if (checkUrl()) {
+        fn({
+          type: currentState.type,
+          url: currentState.url
+        });
+      }
+    };
+  });
+  const inputAdornment = (0, _ahooks.useCreation)(() => {
+    if (currentState.error) {
+      return /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
+        component: "span",
+        color: "error",
+        children: currentState.error
+      });
+    }
+    if (currentState.edit) {
+      if (currentState.loading) {
+        return /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.CircularProgress, {
+          size: 16
+        });
+      }
+      return /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.IconButton, {
+        size: "small",
+        onClick: onSubmit(_onTest),
+        sx: {
+          mr: -1
+        },
+        children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+          icon: _sendRounded.default
+        })
+      });
+    }
+    return null;
+  }, [currentState.error, currentState.edit, currentState.loading]);
+  return /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Box, {
+    sx: {
+      display: "flex",
+      gap: 1.5,
+      width: "100%",
+      alignItems: {
+        xs: "flex-start",
+        md: "center"
+      },
+      flexDirection: {
+        xs: "column",
+        md: "row"
+      }
+    },
+    children: [/* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Select, {
+      sx: {
+        borderRadius: 2,
+        "&.Mui-disabled": {
+          backgroundColor: _Colors.temp.backgroundsBgField
+        }
+      },
+      disabled: !currentState.edit || currentState.loading,
+      size: "small",
+      value: currentState.type,
+      onChange: e => {
+        currentState.type = e.target.value;
+      },
+      children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.MenuItem, {
+        value: "api",
+        children: t("webhook.url")
+      }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.MenuItem, {
+        value: "slack",
+        children: t("webhook.slack")
+      })]
+    }), /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Box, {
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        gap: 0.5,
+        width: "100%"
+      },
+      children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.TextField, {
+        sx: {
+          flex: 1,
+          ".MuiInputBase-root": {
+            borderRadius: 2,
+            "&.Mui-disabled": {
+              backgroundColor: _Colors.temp.backgroundsBgField
+            }
+          }
+        },
+        disabled: !currentState.edit || currentState.loading,
+        fullWidth: true,
+        size: "small",
+        required: true,
+        value: currentState.url,
+        onChange: e => {
+          currentState.url = e.target.value;
+          checkUrl();
+        },
+        error: !!currentState.error,
+        InputProps: {
+          endAdornment: /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.InputAdornment, {
+            position: "end",
+            children: inputAdornment
+          })
+        }
+      }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Box, {
+        sx: {
+          display: "flex",
+          gap: 0.5
+        },
+        children: currentState.edit ? /* @__PURE__ */(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+          children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.IconButton, {
+            color: "success",
+            onClick: onSubmit((...args) => {
+              onSave(...args);
+              currentState.edit = false;
+            }),
+            sx: {
+              borderRadius: 2,
+              border: `1px solid ${_Colors.temp.strokeBorderBase}`
+            },
+            children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+              icon: _check.default
+            })
+          }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.IconButton, {
+            color: "error",
+            onClick: handleClose,
+            sx: {
+              borderRadius: 2,
+              border: `1px solid ${_Colors.temp.strokeBorderBase}`
+            },
+            children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+              icon: _closeRounded.default
+            })
+          })]
+        }) : /* @__PURE__ */(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+          children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.IconButton, {
+            onClick: () => {
+              currentState.edit = true;
+            },
+            sx: {
+              borderRadius: 2,
+              border: `1px solid ${_Colors.temp.strokeBorderBase}`
+            },
+            children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+              icon: _editSquareOutlineRounded.default
+            })
+          }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.IconButton, {
+            color: "error",
+            onClick: () => {
+              onDelete({
+                type: currentState.type,
+                url: currentState.url
+              });
+            },
+            sx: {
+              borderRadius: 2,
+              border: `1px solid ${_Colors.temp.strokeBorderBase}`
+            },
+            children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+              icon: _deleteOutlineRounded.default
+            })
+          })]
+        })
+      })]
+    })]
+  });
+}

package/lib/UserCenter/index.d.ts

@@ -0,0 +1 @@
+export { default as UserCenter } from './components/user-center';

package/lib/UserCenter/index.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "UserCenter", {
+  enumerable: true,
+  get: function () {
+    return _userCenter.default;
+  }
+});
+var _userCenter = _interopRequireDefault(require("./components/user-center"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/UserCenter/libs/client.d.ts

@@ -0,0 +1,2 @@
+import { BlockletSDK } from '@blocklet/js-sdk';
+export declare const client: BlockletSDK;

package/lib/UserCenter/libs/client.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.client = void 0;
+var _jsSdk = require("@blocklet/js-sdk");
+const client = exports.client = new _jsSdk.BlockletSDK();

package/lib/UserCenter/libs/locales.d.ts

@@ -0,0 +1,72 @@
+export declare const translations: {
+    zh: {
+        settings: string;
+        noPassport: string;
+        passport: string;
+        notification: string;
+        email: string;
+        lastLogin: string;
+        createdAt: string;
+        registerFrom: string;
+        unknown: string;
+        walletNotification: string;
+        emailNotification: string;
+        phoneNotification: string;
+        addWebhook: string;
+        saveSuccess: string;
+        saveFailed: string;
+        webhookTested: string;
+        done: string;
+        emptyField: string;
+        emptyContent: string;
+        underProtected: string;
+        noUserFound: string;
+        notificationManagement: string;
+        privacyManagement: string;
+        webhook: {
+            url: string;
+            slack: string;
+        };
+        common: {
+            required: string;
+            invalid: string;
+        };
+        toPublic: string;
+        currentPassport: string;
+    };
+    en: {
+        settings: string;
+        noPassport: string;
+        passport: string;
+        notification: string;
+        email: string;
+        lastLogin: string;
+        createdAt: string;
+        registerFrom: string;
+        unknown: string;
+        walletNotification: string;
+        emailNotification: string;
+        phoneNotification: string;
+        addWebhook: string;
+        saveSuccess: string;
+        saveFailed: string;
+        webhookTested: string;
+        done: string;
+        emptyField: string;
+        notificationManagement: string;
+        privacyManagement: string;
+        emptyContent: string;
+        underProtected: string;
+        noUserFound: string;
+        webhook: {
+            url: string;
+            slack: string;
+        };
+        common: {
+            required: string;
+            invalid: string;
+        };
+        toPublic: string;
+        currentPassport: string;
+    };
+};

package/lib/UserCenter/libs/locales.js

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.translations = void 0;
+const translations = exports.translations = {
+  zh: {
+    settings: "\u8BBE\u7F6E",
+    noPassport: "\u6682\u65E0\u901A\u884C\u8BC1",
+    passport: "\u901A\u884C\u8BC1",
+    notification: "\u901A\u77E5",
+    email: "\u90AE\u7BB1\u5730\u5740",
+    lastLogin: "\u4E0A\u6B21\u767B\u5F55",
+    createdAt: "\u521B\u5EFA\u65F6\u95F4",
+    registerFrom: "\u6CE8\u518C\u6765\u6E90",
+    unknown: "\u672A\u77E5",
+    walletNotification: "\u94B1\u5305\u901A\u77E5",
+    emailNotification: "\u90AE\u4EF6\u901A\u77E5",
+    phoneNotification: "\u77ED\u4FE1\u901A\u77E5",
+    addWebhook: "\u65B0\u589E\u5916\u90E8\u901A\u77E5",
+    saveSuccess: "\u4FDD\u5B58\u6210\u529F",
+    saveFailed: "\u4FDD\u5B58\u5931\u8D25",
+    webhookTested: "\u6D4B\u8BD5\u6D88\u606F\u5DF2\u7ECF\u53D1\u9001",
+    done: "\u5B8C\u6210",
+    emptyField: "\u672A\u586B\u5199",
+    emptyContent: "\u6682\u65E0\u5185\u5BB9",
+    underProtected: "\u7528\u6237\u5DF2\u8BBE\u7F6E\u9690\u79C1\u4FDD\u62A4",
+    noUserFound: "\u672A\u627E\u5230\u6307\u5B9A\u7684\u7528\u6237",
+    notificationManagement: "\u901A\u77E5\u7BA1\u7406",
+    privacyManagement: "\u9690\u79C1\u7BA1\u7406",
+    webhook: {
+      url: "\u81EA\u5B9A\u4E49URL",
+      slack: "Slack"
+    },
+    common: {
+      required: "\u5FC5\u586B\u7684",
+      invalid: "\u65E0\u6548"
+    },
+    toPublic: "\u516C\u5F00 \u201C{name}\u201D \u9875\u9762",
+    currentPassport: "\u5F53\u524D\u4F7F\u7528\u7684\u901A\u884C\u8BC1"
+  },
+  en: {
+    settings: "Settings",
+    noPassport: "No passport founded",
+    passport: "Passport",
+    notification: "Notification",
+    email: "Email",
+    lastLogin: "Last Login & IP",
+    createdAt: "Created At",
+    registerFrom: "Register From",
+    unknown: "Unknown",
+    walletNotification: "DID Wallet notification",
+    emailNotification: "Email notification",
+    phoneNotification: "SMS notification",
+    addWebhook: "Add external notification",
+    saveSuccess: "Save succeed",
+    saveFailed: "Save failed",
+    webhookTested: "Test message sent",
+    done: "Done",
+    emptyField: "Empty field",
+    notificationManagement: "Notification",
+    privacyManagement: "Privacy",
+    emptyContent: "Empty",
+    underProtected: "This page has protected privacy",
+    noUserFound: "No user found",
+    webhook: {
+      url: "Custom url",
+      slack: "Slack"
+    },
+    common: {
+      required: "Required",
+      invalid: "Invalid"
+    },
+    toPublic: 'Public "{name}" page',
+    currentPassport: "Passport currently in use"
+  }
+};

package/lib/UserCenter/libs/utils.d.ts

@@ -0,0 +1,4 @@
+import type { AxiosError } from 'axios';
+import { CreatePassportProps } from '../../@types';
+export declare const formatAxiosError: (err: AxiosError) => string;
+export declare const createPassportSvg: (props: CreatePassportProps) => any;

package/lib/UserCenter/libs/utils.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.formatAxiosError = exports.createPassportSvg = void 0;
+var _urlJoin = _interopRequireDefault(require("url-join"));
+var _constant = require("@abtnode/constant");
+var _passport = require("@arcblock/ux/lib/Util/passport");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const formatAxiosError = err => {
+  const {
+    response
+  } = err;
+  if (response) {
+    return `Request failed: ${response.status} ${response.statusText}: ${JSON.stringify(response.data)}`;
+  }
+  return err.message;
+};
+exports.formatAxiosError = formatAxiosError;
+const createPassportSvg = props => (0, _passport.createPassportSvg)({
+  ...props,
+  issuerAvatarUrl: (0, _urlJoin.default)(window.location.origin, _constant.WELLKNOWN_SERVICE_PATH_PREFIX, "/blocklet/logo")
+});
+exports.createPassportSvg = createPassportSvg;

package/lib/blocklets.d.ts

@@ -0,0 +1,16 @@
+export const publicPath: any;
+export function formatTheme(theme: any): any;
+export function getLocalizedNavigation(navigation: any, locale?: string): any;
+export function formatNavigation(navigation: any): any;
+export function parseNavigation(navigation: any): {
+    header: never[];
+    footer: never[];
+    social: never[];
+    bottom: never[];
+    dashboard: never[];
+    sessionManager: never[];
+    userCenter: never[];
+} | null;
+export function formatBlockletInfo(blockletInfo: any): any;
+export function filterValidNavItems(navigation?: any[]): any;
+export function filterNavByRole(nav: object[], userRole: string): any;