@blocklet/ui-react 2.9.67 → 2.9.69

package/es/UserCenter/libs/locales.js

@@ -31,6 +31,8 @@ export const translations = {
       slack: "Slack"
     },
     common: {
+      confirm: "\u786E\u8BA4",
+      cancel: "\u53D6\u6D88",
       required: "\u5FC5\u586B\u7684",
       invalid: "\u65E0\u6548"
     },
@@ -67,6 +69,14 @@ export const translations = {
           tag: "\u5DF2\u8FDE\u63A5"
         }
       }
+    },
+    thirdPartyLogin: {
+      title: "\u7B2C\u4E09\u65B9\u767B\u5F55",
+      connect: "\u7ED1\u5B9A",
+      disconnect: "\u89E3\u7ED1",
+      mainProviderCantRemove: "\u4E3B\u8D26\u53F7\u4E0D\u5141\u8BB8\u89E3\u7ED1",
+      confirmUnbind: "\u786E\u5B9A\u8981\u89E3\u7ED1 {name} \u5417?",
+      confirmUnbindDescription: "\u89E3\u7ED1\u540E\u60A8\u5C06\u65E0\u6CD5\u4F7F\u7528 {name} \u767B\u5F55\u81F3\u8BE5\u8D26\u6237\u3002\u5982\u679C\u89E3\u7ED1\u540E\uFF0C\u60A8\u4ECD\u4F7F\u7528 {name} \u767B\u5F55\uFF0C\u4F1A\u81EA\u52A8\u521B\u5EFA\u4E00\u4E2A\u65B0\u8D26\u6237"
     }
   },
   en: {
@@ -101,6 +111,8 @@ export const translations = {
       slack: "Slack"
     },
     common: {
+      confirm: "Confirm",
+      cancel: "Cancel",
       required: "Required",
       invalid: "Invalid"
     },
@@ -137,6 +149,14 @@ export const translations = {
           tag: "Connected"
         }
       }
+    },
+    thirdPartyLogin: {
+      title: "Third Party Login",
+      connect: "Connect",
+      disconnect: "Disconnect",
+      mainProviderCantRemove: "Main account not allowed to remove",
+      confirmUnbind: "Are you sure to unbind {name}?",
+      confirmUnbindDescription: "You will not be able to log in to this account using {name} after unbundling. If you are still logged in with {name} after unbundling, a new account will be created automatically!"
     }
   }
 };

package/es/UserSessions/components/user-sessions.js

@@ -184,10 +184,7 @@ export default function UserSessions({
       options: {
         customBodyRenderLite: (rawIndex) => {
           const x = safeData[rawIndex];
-          return x.createdAt ? (
-            // @ts-ignore FIXME: @zhanghan 新版 js-sdk 会提供这个属性的提示
-            /* @__PURE__ */ jsx(RelativeTime, { value: x.createdAt, relativeRange: 3 * 86400 * 1e3, locale })
-          ) : t("unknown");
+          return x.createdAt ? /* @__PURE__ */ jsx(RelativeTime, { value: x.createdAt, relativeRange: 3 * 86400 * 1e3, locale }) : t("unknown");
         }
       }
     },

package/lib/@types/index.d.ts

@@ -1,19 +1,55 @@
 import type { Axios } from 'axios';
 import type { UserPublicInfo } from '@blocklet/js-sdk';
+import { OAUTH_PROVIDER } from '@arcblock/ux/lib/Util/constant';
 export type SessionContext = {
     session: Session;
     api: Axios;
 };
+export type OAuthAccount = {
+    provider: keyof typeof OAUTH_PROVIDER;
+    id: string;
+    did: string;
+    pk: string;
+    lastLoginAt: string;
+    firstLoginAt: string;
+    order?: number;
+    userInfo?: {
+        email: string;
+        emailVerified: boolean;
+        name: string;
+        picture: string;
+        sub: string;
+        extraData: Object;
+    };
+};
+export type WalletAccount = {
+    provider: 'wallet';
+    did: string;
+    pk: string;
+    lastLoginAt: string;
+    firstLoginAt: string;
+};
+export type NFTAccount = {
+    provider: 'nft';
+    did: string;
+    pk: string;
+    owner: string;
+    lastLoginAt: string;
+    firstLoginAt: string;
+};
+export type ConnectedAccount = OAuthAccount | WalletAccount | NFTAccount;
 export type User = UserPublicInfo & {
     role: string;
     email?: string;
     phone?: string;
     sourceProvider?: string;
+    sourceAppPid?: string;
     lastLoginAt?: string;
     lastLoginIp?: string;
     createdAt?: string;
     passports?: any[];
     didSpace?: Record<string, any>;
+    connectedAccounts?: any[];
 };
 export type UserCenterTab = {
     value: string;
@@ -25,7 +61,7 @@ export type UserCenterTab = {
 export type Session = {
     loading: boolean;
     initialized: boolean;
-    user: User;
+    user?: User;
     login: any;
     logout: any;
     switch: any;
@@ -33,6 +69,7 @@ export type Session = {
     switchProfile: any;
     switchPassport: any;
     refresh: Function;
+    useOAuth: Function;
 };
 export type WebhookType = 'slack' | 'api';
 export type WebhookItemData = {

package/lib/@types/shims.d.ts

@@ -1,5 +1,11 @@
 declare module '@arcblock/ux/*';
+declare module '@arcblock/ux/lib/DID';
+declare module '@arcblock/ux/lib/Tabs';
+declare module '@arcblock/ux/lib/Switch';
+declare module '@arcblock/ux/lib/ErrorBoundary';
+
 declare module '@arcblock/did-connect/*';
+declare module '@arcblock/did-connect/lib/Session';
 
 declare module 'is-url';
 declare module 'url-join';

package/lib/Dashboard/index.js

@@ -82,9 +82,7 @@ function Dashboard({
     if (!!user && !!flattened?.length && matchedIndex === -1) {
       if (invalidPathFallback) {
         invalidPathFallback();
-      } else {
-        window.location.href = flattened[0]?.url || _blocklets.publicPath;
-      }
+      } else {}
     }
   }, [invalidPathFallback, flattened, matchedIndex]);
   if (!formattedBlocklet.appName) {

package/lib/UserCenter/components/settings.js

@@ -16,6 +16,7 @@ var _notification = _interopRequireDefault(require("./notification"));
 var _privacy = _interopRequireDefault(require("./privacy"));
 var _storage = _interopRequireDefault(require("./storage"));
 var _UserSessions = require("../../UserSessions");
+var _thirdPartyLogin = _interopRequireDefault(require("./third-party-login"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function Settings({
   user,
@@ -46,6 +47,12 @@ function Settings({
       content: /* @__PURE__ */(0, _jsxRuntime.jsx)(_notification.default, {
         user
       })
+    }, {
+      label: t("thirdPartyLogin.title"),
+      value: "thirdPartyLogin",
+      content: /* @__PURE__ */(0, _jsxRuntime.jsx)(_thirdPartyLogin.default, {
+        user
+      })
     }, {
       label: t("privacyManagement"),
       value: "privacy",
@@ -72,7 +79,7 @@ function Settings({
   });
   const currentTab = (0, _ahooks.useCreation)(() => {
     return tabs.find(x => x.value === currentState.tab);
-  }, [currentState.tab]);
+  }, [currentState.tab, tabs]);
   const handleChangeTab = (0, _ahooks.useMemoizedFn)(value => {
     currentState.tab = value;
   });

package/lib/UserCenter/components/third-party-login/index.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { User } from '../../../@types';
+export default function ThirdPartyLogin({ user }: {
+    user: User;
+}): import("react").JSX.Element;

package/lib/UserCenter/components/third-party-login/index.js

@@ -0,0 +1,123 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+module.exports = ThirdPartyLogin;
+var _jsxRuntime = require("react/jsx-runtime");
+var _react = require("react");
+var _material = require("@mui/material");
+var _ahooks = require("ahooks");
+var _utils = require("@arcblock/ux/lib/SessionUser/libs/utils");
+var _constant = require("@arcblock/ux/lib/Util/constant");
+var _Session = require("@arcblock/did-connect/lib/Session");
+var _thirdPartyItem = _interopRequireDefault(require("./third-party-item"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ThirdPartyLogin({
+  user
+}) {
+  const {
+    session
+  } = (0, _react.useContext)(_Session.SessionContext);
+  const [oauthConfigs, setOauthConfigs] = (0, _react.useState)({});
+  const {
+    getOAuthConfigs
+  } = session.useOAuth();
+  (0, _ahooks.useAsyncEffect)(async () => {
+    const data = await getOAuthConfigs({
+      sourceAppPid: user?.sourceAppPid
+    });
+    setOauthConfigs(data);
+  }, [user?.sourceAppPid]);
+  const availableProviders = (0, _ahooks.useCreation)(() => {
+    const oauthList = Object.keys(oauthConfigs).map(x => {
+      return {
+        ...oauthConfigs[x],
+        provider: x
+      };
+    }).filter(x => x.enabled);
+    return oauthList;
+  }, [oauthConfigs]);
+  const normalizedAccounts = (0, _ahooks.useCreation)(() => {
+    const connectedAccounts = (0, _utils.getConnectedAccounts)(user);
+    let removeAuth0 = false;
+    let patchProvider = "";
+    let sourceProvider = (0, _utils.getSourceProvider)(user);
+    const auth0ConnectedAccount = connectedAccounts.find(x => x.provider === _constant.LOGIN_PROVIDER.AUTH0);
+    if (auth0ConnectedAccount) {
+      if (auth0ConnectedAccount.id.startsWith("google-oauth2|")) {
+        if (!connectedAccounts.some(x => x.provider === "google")) {
+          removeAuth0 = true;
+          patchProvider = _constant.LOGIN_PROVIDER.GOOGLE;
+          if (sourceProvider === _constant.LOGIN_PROVIDER.AUTH0) {
+            sourceProvider = _constant.LOGIN_PROVIDER.GOOGLE;
+          }
+        }
+      }
+      if (auth0ConnectedAccount.id.startsWith("appleid|")) {
+        if (!connectedAccounts.some(x => x.provider === _constant.LOGIN_PROVIDER.APPLE)) {
+          removeAuth0 = true;
+          patchProvider = _constant.LOGIN_PROVIDER.APPLE;
+          if (sourceProvider === _constant.LOGIN_PROVIDER.AUTH0) {
+            sourceProvider = _constant.LOGIN_PROVIDER.APPLE;
+          }
+        }
+      }
+      if (auth0ConnectedAccount.id.startsWith("github|")) {
+        if (!connectedAccounts.some(x => x.provider === _constant.LOGIN_PROVIDER.GITHUB)) {
+          removeAuth0 = true;
+          patchProvider = _constant.LOGIN_PROVIDER.GITHUB;
+          if (sourceProvider === _constant.LOGIN_PROVIDER.AUTH0) {
+            sourceProvider = _constant.LOGIN_PROVIDER.GITHUB;
+          }
+        }
+      }
+    }
+    const transformedProviders = availableProviders.map(x => {
+      if (x.provider === _constant.LOGIN_PROVIDER.AUTH0 && removeAuth0) {
+        return null;
+      }
+      const findConnectedAccount = removeAuth0 && x.provider === patchProvider ? connectedAccounts.find(i => i.provider === _constant.LOGIN_PROVIDER.AUTH0) : connectedAccounts.find(i => i.provider === x.provider);
+      if (findConnectedAccount) {
+        return {
+          ...x,
+          provider: x.provider,
+          did: findConnectedAccount.did,
+          pk: findConnectedAccount.pk,
+          userInfo: findConnectedAccount.userInfo,
+          _bind: true,
+          _rawProvider: findConnectedAccount.provider,
+          _mainProvider: x.provider === sourceProvider
+        };
+      }
+      return {
+        ...x,
+        provider: x.provider,
+        _rawProvider: x.provider,
+        _mainProvider: x.provider === sourceProvider
+      };
+    }).filter(Boolean).sort((a, b) => {
+      if (a?.order !== void 0 && b?.order !== void 0) {
+        return a.order - b.order;
+      }
+      if (a?.order !== void 0) {
+        return -1;
+      }
+      return 1;
+    });
+    return transformedProviders;
+  }, [user?.connectedAccounts, availableProviders]);
+  return /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.List, {
+    dense: true,
+    sx: {
+      gap: 1,
+      display: "flex",
+      flexDirection: "column"
+    },
+    children: normalizedAccounts.map(account => {
+      return /* @__PURE__ */(0, _jsxRuntime.jsx)(_thirdPartyItem.default, {
+        item: account
+      }, account?.provider);
+    })
+  });
+}

package/lib/UserCenter/components/third-party-login/third-party-item.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import type { OAuthAccount } from '../../../@types';
+export default function ThirdPartyItem({ item, }: {
+    item: {
+        provider: string;
+        did: string;
+        pk: string;
+        userInfo?: OAuthAccount['userInfo'];
+        _bind?: boolean;
+        _rawProvider?: string;
+        _mainProvider?: boolean;
+    };
+}): import("react").JSX.Element;

package/lib/UserCenter/components/third-party-login/third-party-item.js

@@ -0,0 +1,235 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+module.exports = ThirdPartyItem;
+var _jsxRuntime = require("react/jsx-runtime");
+var _react = require("@iconify/react");
+var _material = require("@mui/material");
+var _linkRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/link-rounded"));
+var _Colors = require("@arcblock/ux/lib/Colors");
+var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
+var _Avatar = _interopRequireDefault(require("@arcblock/ux/lib/Avatar"));
+var _ahooks = require("ahooks");
+var _util = require("@arcblock/ux/lib/Locale/util");
+var _Dialog = require("@arcblock/ux/lib/Dialog");
+var _context = require("@arcblock/ux/lib/Locale/context");
+var _mailOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/mail-outline-rounded"));
+var _infoOutlineRounded = _interopRequireDefault(require("@iconify-icons/material-symbols/info-outline-rounded"));
+var _apple = _interopRequireDefault(require("@iconify-icons/logos/apple"));
+var _githubIcon = _interopRequireDefault(require("@iconify-icons/logos/github-icon"));
+var _googleIcon = _interopRequireDefault(require("@iconify-icons/logos/google-icon"));
+var _Session = require("@arcblock/did-connect/lib/Session");
+var _react2 = require("react");
+var _pick = _interopRequireDefault(require("lodash/pick"));
+var _federated = require("@arcblock/ux/lib/Util/federated");
+var _constant = require("@arcblock/ux/lib/Util/constant");
+var _locales = require("../../libs/locales");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function ThirdPartyItem({
+  item
+}) {
+  const {
+    confirmApi,
+    confirmHolder
+  } = (0, _Dialog.useConfirm)();
+  const currentState = (0, _ahooks.useReactive)({
+    loading: false
+  });
+  const {
+    locale
+  } = (0, _context.useLocaleContext)();
+  const t = (0, _ahooks.useMemoizedFn)((key, data = {}) => {
+    return (0, _util.translate)(_locales.translations, key, locale, "en", data);
+  });
+  const {
+    session
+  } = (0, _react2.useContext)(_Session.SessionContext);
+  const {
+    bindOAuth,
+    unbindOAuth,
+    setBaseUrl,
+    baseUrl: oauthBaseUrl
+  } = session.useOAuth();
+  const iconMap = {
+    // email: MailOutlineRoundedIcon,
+    [_constant.LOGIN_PROVIDER.AUTH0]: _mailOutlineRounded.default,
+    [_constant.LOGIN_PROVIDER.APPLE]: _apple.default,
+    [_constant.LOGIN_PROVIDER.GITHUB]: _githubIcon.default,
+    [_constant.LOGIN_PROVIDER.GOOGLE]: _googleIcon.default
+  };
+  const icon = (0, _ahooks.useCreation)(() => {
+    return iconMap[item?.provider];
+  }, [item?.provider]);
+  const title = (0, _ahooks.useCreation)(() => {
+    return _constant.OAUTH_PROVIDER[item?.provider] || "unknown";
+  }, [item?.provider]);
+  const toggleBind = (0, _ahooks.useMemoizedFn)(async () => {
+    try {
+      currentState.loading = true;
+      await new Promise((resolve, reject) => {
+        if (item?._bind) {
+          confirmApi.open({
+            title: t("thirdPartyLogin.confirmUnbind", {
+              name: title
+            }),
+            content: t("thirdPartyLogin.confirmUnbindDescription", {
+              name: title
+            }),
+            confirmButtonText: t("common.confirm"),
+            cancelButtonText: t("common.cancel"),
+            onConfirm(close) {
+              unbindOAuth({
+                session,
+                connectedAccount: {
+                  ...(0, _pick.default)(item, ["did", "pk"]),
+                  showProvider: item.provider,
+                  provider: item._rawProvider
+                }
+              }).then(resolve).catch(reject);
+              close();
+            },
+            onCancel: resolve
+          });
+        } else {
+          const backupBaseUrl = oauthBaseUrl;
+          const blocklet = window?.blocklet;
+          let baseUrl = "/";
+          const federatedEnabled = (0, _federated.getFederatedEnabled)(blocklet);
+          const master = (0, _federated.getMaster)(blocklet);
+          if (federatedEnabled && master?.appPid && session?.user?.sourceAppPid) {
+            baseUrl = master.appUrl;
+          }
+          setBaseUrl(baseUrl);
+          bindOAuth({
+            session,
+            oauthItem: {
+              ...item,
+              provider: item._rawProvider
+            }
+          }).then(resolve).catch(reject).finally(() => {
+            setBaseUrl(backupBaseUrl);
+          });
+        }
+      });
+    } catch (err) {
+      console.error(`Failed to ${item?._bind ? "unbind" : "bind"} oauth account`, err);
+    } finally {
+      currentState.loading = false;
+    }
+  });
+  return /* @__PURE__ */(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    children: [/* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.ListItem, {
+      disablePadding: true,
+      sx: {
+        display: "flex",
+        alignItems: "center",
+        gap: 1
+      },
+      children: [/* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Box, {
+        sx: {
+          flex: 1,
+          borderRadius: 2,
+          border: `1px solid ${_Colors.temp.strokeBorderBase}`,
+          background: _Colors.temp.backgroundsBgField,
+          display: "flex",
+          alignItems: "center",
+          py: 1,
+          px: 1.5,
+          gap: 0.75,
+          fontSize: "14px",
+          lineHeight: 1
+        },
+        children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+          icon,
+          fontSize: 16
+        }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Box, {
+          sx: {
+            display: "flex",
+            alignItems: "center",
+            justifyContent: "space-between",
+            flex: 1,
+            gap: 1
+          },
+          children: title
+        }), /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Box, {
+          sx: {
+            display: "flex",
+            alignItems: "center",
+            gap: 0.5
+          },
+          children: [item.userInfo?.email || item.did, item.userInfo?.email ? /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Tooltip, {
+            title: /* @__PURE__ */(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+              children: /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Box, {
+                sx: {
+                  display: "flex",
+                  alignItems: "center",
+                  gap: 1
+                },
+                children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_Avatar.default, {
+                  size: 36,
+                  variant: "circle",
+                  shape: "circle",
+                  src: item.userInfo?.picture,
+                  did: item.did
+                }), /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Box, {
+                  children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
+                    sx: {
+                      whiteSpace: "normal",
+                      wordBreak: "break-all",
+                      fontSize: "0.9rem"
+                    },
+                    children: item.userInfo?.name
+                  }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Typography, {
+                    sx: {
+                      whiteSpace: "normal",
+                      wordBreak: "break-all",
+                      fontSize: "0.9rem"
+                    },
+                    children: item.userInfo?.email
+                  })]
+                })]
+              })
+            }),
+            children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+              icon: _infoOutlineRounded.default,
+              color: _Colors.temp.textSubtitle,
+              fontSize: 16,
+              style: {
+                cursor: "pointer"
+              }
+            })
+          }) : null]
+        })]
+      }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Tooltip, {
+        title: item._mainProvider ? t("thirdPartyLogin.mainProviderCantRemove") : "",
+        children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_material.Box, {
+          children: /* @__PURE__ */(0, _jsxRuntime.jsx)(_Button.default, {
+            variant: "outlined",
+            size: "small",
+            sx: {
+              color: item?._bind ? _Colors.temp.red : _Colors.temp.foregroundsFgBase,
+              borderColor: item?._bind ? _Colors.temp.red : _Colors.temp.strokeBorderBase,
+              backgroundColor: _Colors.temp.buttonsButtonNeutral,
+              "&:hover": {
+                borderColor: item?._bind ? _Colors.temp.red : _Colors.temp.strokeBorderBase,
+                backgroundColor: _Colors.temp.buttonsButtonNeutralHover
+              },
+              py: 0.5,
+              borderRadius: 2,
+              fontWeight: 500
+            },
+            startIcon: currentState.loading ? null : /* @__PURE__ */(0, _jsxRuntime.jsx)(_react.Icon, {
+              icon: _linkRounded.default
+            }),
+            onClick: toggleBind,
+            disabled: item._mainProvider,
+            loading: currentState.loading,
+            children: item?._bind ? t("thirdPartyLogin.disconnect") : t("thirdPartyLogin.connect")
+          })
+        })
+      })]
+    }), confirmHolder]
+  });
+}

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

@@ -23,8 +23,7 @@ var _ufo = require("ufo");
 var _Footer = _interopRequireDefault(require("../../Footer"));
 var _Header = _interopRequireDefault(require("../../Header"));
 var _locales = require("../libs/locales");
-var _userInfo = _interopRequireDefault(require("./user-info"));
-var _userBasicInfo = _interopRequireDefault(require("./user-basic-info"));
+var _userInfo = require("./user-info");
 var _blocklets = require("../../blocklets");
 var _passport = _interopRequireDefault(require("./passport"));
 var _settings = _interopRequireDefault(require("./settings"));
@@ -83,7 +82,7 @@ function UserCenter({
       });
     }
   }, {
-    refreshDeps: [currentDid, isMyself, session?.initialized]
+    refreshDeps: [currentDid, isMyself, session?.initialized, session?.user]
   });
   const privacyState = (0, _ahooks.useRequest)(async () => {
     if (userState.data && currentTab) {
@@ -154,24 +153,32 @@ function UserCenter({
       });
     }
   });
+  const settingContent = (0, _ahooks.useCreation)(() => {
+    return /* @__PURE__ */(0, _jsxRuntime.jsx)(_settings.default, {
+      user: userState.data,
+      settings: {
+        userCenterTabs
+      },
+      onSave: async () => {
+        await privacyState.runAsync();
+        return privacyState.data;
+      }
+    });
+  }, [userState.data]);
   const openSettings = (0, _ahooks.useMemoizedFn)(() => {
     confirmApi.open({
       title: t("settings"),
-      content: /* @__PURE__ */(0, _jsxRuntime.jsx)(_settings.default, {
-        user: userState.data,
-        settings: {
-          userCenterTabs
-        },
-        onSave: async () => {
-          await privacyState.runAsync();
-          return privacyState.data;
-        }
-      }),
+      content: settingContent,
       showCancelButton: false,
       confirmButtonText: t("done"),
       onConfirm: confirmApi.close
     });
   });
+  (0, _ahooks.useUpdateEffect)(() => {
+    confirmApi.update({
+      content: settingContent
+    });
+  }, [settingContent]);
   (0, _ahooks.useMount)(() => {
     if (autoPopupSetting) {
       openSettings();
@@ -236,7 +243,7 @@ function UserCenter({
             }
           },
           children: userState.data.fullName
-        }) : null, /* @__PURE__ */(0, _jsxRuntime.jsx)(_userBasicInfo.default, {
+        }) : null, /* @__PURE__ */(0, _jsxRuntime.jsx)(_userInfo.UserBasicInfo, {
           isMyself,
           switchPassport: session.switchPassport,
           switchProfile: session.switchProfile,
@@ -337,7 +344,7 @@ function UserCenter({
             },
             top: theme => stickySidebar ? theme.spacing(3) : "unset"
           },
-          children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_userBasicInfo.default, {
+          children: [/* @__PURE__ */(0, _jsxRuntime.jsx)(_userInfo.UserBasicInfo, {
             isMyself,
             switchPassport: session.switchPassport,
             switchProfile: session.switchProfile,
@@ -357,7 +364,7 @@ function UserCenter({
                   mb: 1.5
                 },
                 children: t("myInfo")
-              }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_userInfo.default, {
+              }), /* @__PURE__ */(0, _jsxRuntime.jsx)(_userInfo.UserInfo, {
                 user: userState.data
               })]
             }), /* @__PURE__ */(0, _jsxRuntime.jsxs)(_material.Box, {

package/lib/UserCenter/components/user-info/index.d.ts

@@ -0,0 +1,3 @@
+export { default as UserBasicInfo } from './user-basic-info';
+export { default as UserInfoItem } from './user-info-item';
+export { default as UserInfo } from './user-info';

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

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "UserBasicInfo", {
+  enumerable: true,
+  get: function () {
+    return _userBasicInfo.default;
+  }
+});
+Object.defineProperty(exports, "UserInfo", {
+  enumerable: true,
+  get: function () {
+    return _userInfo.default;
+  }
+});
+Object.defineProperty(exports, "UserInfoItem", {
+  enumerable: true,
+  get: function () {
+    return _userInfoItem.default;
+  }
+});
+var _userBasicInfo = _interopRequireDefault(require("./user-basic-info"));
+var _userInfoItem = _interopRequireDefault(require("./user-info-item"));
+var _userInfo = _interopRequireDefault(require("./user-info"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }