@arcblock/ux 2.8.26 → 2.9.0

package/es/SessionManager/components/federated-login-detecter.js

@@ -1,183 +0,0 @@
-import PropTypes from 'prop-types';
-import { useCallback } from 'react';
-import Box from '@mui/material/Box';
-import Chip from '@mui/material/Chip';
-import Divider from '@mui/material/Divider';
-import ShieldCheckIcon from '@iconify-icons/mdi/shield-check';
-import { Icon } from '@iconify/react';
-import { useCreation, useReactive } from 'ahooks';
-import UserPopper from './user-popper';
-import DidAvatar from '../../Avatar';
-import DidAddress from '../../Address';
-import Button from '../../Button';
-import Toast from '../../Toast';
-import { getUserAvatar } from '../../Util';
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-import { jsx as _jsx } from "react/jsx-runtime";
-const translations = {
-  en: {
-    useToConnect({
-      master,
-      member
-    }) {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["Connect ", member, " with ", master, " account"]
-      });
-    },
-    connect: 'Connect Account',
-    loginFederatedFailed: 'Login federated account failed'
-  },
-  zh: {
-    useToConnect({
-      master,
-      member
-    }) {
-      return /*#__PURE__*/_jsxs(_Fragment, {
-        children: ["\u4F7F\u7528 ", master, " \u8D26\u53F7\u8FDE\u63A5 ", member]
-      });
-    },
-    connect: '连接账号',
-    loginFederatedFailed: '登录统一登录账号失败'
-  }
-};
-export default function FederatedLoginDetecter({
-  session,
-  anchorEl,
-  dark,
-  locale: _locale
-}) {
-  const state = useReactive({
-    open: true
-  });
-  const federatedMaster = useCreation(() => {
-    return session.federatedMaster;
-  }, [session?.federatedMaster]);
-  const localeList = Object.keys(translations);
-  const locale = localeList.includes(_locale) ? _locale : localeList[0];
-  const onLoginFederated = useCallback(() => {
-    session?.login(err => {
-      if (err) {
-        Toast.error(err || translations[_locale].loginFederatedFailed);
-      } else {
-        state.open = false;
-      }
-    }, {
-      sourceAppPid: federatedMaster?.site?.appPid,
-      mode: federatedMaster?.user ? 'auto' : 'manual'
-    });
-  }, [session, federatedMaster?.site?.appPid, federatedMaster?.user, _locale, state]);
-  let appLogoUrl;
-  if (federatedMaster?.site) {
-    appLogoUrl = new URL(federatedMaster.site.appLogo, federatedMaster.site.appUrl);
-    appLogoUrl.searchParams.set('imageFilter', 'resize');
-    // HACK: 保持跟其他地方使用的尺寸一致，可以复用同一资源的缓存，减少网络请求
-    appLogoUrl.searchParams.set('w', '80');
-    appLogoUrl.searchParams.set('h', '80');
-  }
-  return federatedMaster?.site && /*#__PURE__*/_jsx(UserPopper, {
-    open: state.open,
-    anchorEl: anchorEl,
-    dark: dark,
-    autoClose: false,
-    onClose: () => {
-      state.open = false;
-    },
-    children: /*#__PURE__*/_jsxs(Box, {
-      p: 2,
-      children: [federatedMaster.site && /*#__PURE__*/_jsxs(Box, {
-        display: "flex",
-        alignItems: "center",
-        children: [/*#__PURE__*/_jsx(Box, {
-          component: "img",
-          mr: 2,
-          src: appLogoUrl.href,
-          alt: federatedMaster.site.appName,
-          width: "30px",
-          height: "30px"
-        }), /*#__PURE__*/_jsx(Box, {
-          sx: {
-            maxWidth: '260px'
-          },
-          children: translations[locale].useToConnect({
-            master: /*#__PURE__*/_jsx(Box, {
-              component: "a",
-              href: federatedMaster.site.appUrl,
-              target: "_blank",
-              sx: {
-                textDecoration: 'none',
-                fontWeight: 'bold',
-                color: 'primary.main',
-                fontSize: '1.2em'
-              },
-              children: federatedMaster.site.appName
-            }),
-            member: window.blocklet.appName
-          })
-        })]
-      }), federatedMaster?.site && federatedMaster?.user && /*#__PURE__*/_jsx(Divider, {
-        style: {
-          margin: '15px 0 10px 0'
-        }
-      }), federatedMaster?.user && /*#__PURE__*/_jsxs(Box, {
-        display: "flex",
-        alignItems: "center",
-        children: [/*#__PURE__*/_jsx(DidAvatar, {
-          variant: "circle",
-          did: federatedMaster.user.did,
-          src: getUserAvatar(federatedMaster.user.avatar),
-          size: 28,
-          shape: "circle"
-        }), /*#__PURE__*/_jsxs(Box, {
-          ml: 2,
-          children: [/*#__PURE__*/_jsxs(Box, {
-            display: "flex",
-            justifyContent: "space-between",
-            alignItems: "center",
-            children: [/*#__PURE__*/_jsx(Box, {
-              fontSize: 18,
-              children: federatedMaster.user.fullName
-            }), federatedMaster.user.role?.toUpperCase() && /*#__PURE__*/_jsx(Chip, {
-              label: federatedMaster.user.role?.toUpperCase(),
-              size: "small",
-              variant: "outlined",
-              sx: {
-                height: 'auto',
-                marginRight: 0,
-                fontSize: 12
-              },
-              icon: /*#__PURE__*/_jsx(Icon, {
-                icon: ShieldCheckIcon,
-                fontSize: 14
-              })
-            })]
-          }), /*#__PURE__*/_jsx(DidAddress, {
-            responsive: false,
-            children: federatedMaster.user.did
-          })]
-        })]
-      }), federatedMaster?.site && /*#__PURE__*/_jsx(Box, {
-        display: "flex",
-        justifyContent: "center",
-        mt: 2,
-        children: /*#__PURE__*/_jsx(Button, {
-          variant: "contained",
-          size: "small",
-          onClick: onLoginFederated,
-          children: translations[locale].connect
-        })
-      })]
-    })
-  });
-}
-FederatedLoginDetecter.propTypes = {
-  session: PropTypes.object.isRequired,
-  anchorEl: PropTypes.instanceOf(Element),
-  dark: PropTypes.bool,
-  locale: PropTypes.string
-};
-FederatedLoginDetecter.defaultProps = {
-  dark: false,
-  anchorEl: null,
-  locale: 'en'
-};

package/es/SessionManager/components/manage-accounts.js

@@ -1,219 +0,0 @@
-/* eslint-disable react/jsx-no-bind */
-import PropTypes from 'prop-types';
-import { useMemoizedFn, useReactive, useUpdate } from 'ahooks';
-import { LinearProgress, MenuItem, SvgIcon } from '@mui/material';
-import { Icon } from '@iconify/react';
-import AccountIcon from '@arcblock/icons/lib/Account';
-import LinkIcon from '@iconify-icons/mdi/link';
-import DisconnectIcon from '@arcblock/icons/lib/Disconnect';
-import noop from 'lodash/noop';
-import AccountItem from './account-item';
-import MenuAccordion from './menu-accordion';
-import { translations } from '../libs/translation';
-import { translate } from '../../Locale/util';
-import { useConfirm } from '../../Dialog/confirm';
-import { getSourceProvider } from '../libs/utils';
-import AddAccountItem from './add-account-item';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function ManageAccounts({
-  session,
-  locale,
-  onBindWallet,
-  onSwitchDid,
-  connectAccount,
-  close,
-  hasBindAccount,
-  disableLogout,
-  onLogout,
-  expanded,
-  onExpand,
-  accounts,
-  deleteAccount,
-  hideLogout
-}) {
-  const {
-    bindOAuth,
-    configs: oauthConfigs
-  } = session.useOAuth();
-  const t = useMemoizedFn((key, data = {}) => {
-    return translate(translations, key, locale, 'en', data);
-  });
-  const {
-    confirmApi,
-    confirmHolder
-  } = useConfirm();
-  const update = useUpdate();
-  const pageState = useReactive({
-    logoutLoading: false
-  });
-  const onChoose = useMemoizedFn((account, {
-    active
-  }) => {
-    if (active) {
-      return;
-    }
-    close();
-    if (account.provider === 'auth0') {
-      // 如果切换的目标是 auth0，则直接打开 auth0 登录页面
-      session.switchDid((...args) => {
-        connectAccount();
-        onSwitchDid(...args);
-      }, {
-        allowWallet: false,
-        sourceAppPid: account.sourceAppPid
-      });
-      return;
-    }
-    const options = {
-      provider: account.provider,
-      sourceAppPid: account.sourceAppPid
-    };
-    if (account.did) {
-      options.forceConnected = account.did;
-    }
-    session.switchDid((...args) => {
-      connectAccount();
-      onSwitchDid(...args);
-    }, options);
-  });
-  const oauthConfigList = Object.entries(oauthConfigs).map(([key, value]) => {
-    return {
-      ...value,
-      provider: key
-    };
-  }).filter(item => item.enabled);
-  const isRawWalletAccount = getSourceProvider(session.user) === 'wallet';
-  const onDelete = useMemoizedFn((account, {
-    active
-  }) => {
-    if (active) {
-      return;
-    }
-    confirmApi.open({
-      title: t('deleteAccountTitle'),
-      content: t('deleteAccountContent'),
-      confirmButtonText: t('confirm'),
-      cancelButtonText: t('cancel'),
-      onConfirm(done) {
-        deleteAccount(account);
-        update();
-        done();
-      }
-    });
-  });
-  const onAdd = useMemoizedFn(app => {
-    close();
-    session.switchDid((...args) => {
-      connectAccount();
-      update();
-      onSwitchDid(...args);
-    }, {
-      sourceAppPid: app.sourceAppPid,
-      provider: app.provider
-    });
-  });
-  const _onLogout = useMemoizedFn(async (...args) => {
-    pageState.logoutLoading = true;
-    try {
-      await onLogout(...args);
-    } finally {
-      pageState.logoutLoading = true;
-    }
-  });
-  function _onBindWallet() {
-    close();
-    // FIXME: @zhanghan 暂时切换回 isRawWalletAccount 的方式来判断，在 did-connect 改版时，简化这里的关系判断
-    if (!isRawWalletAccount) {
-      session.bindWallet(onBindWallet);
-    } else {
-      bindOAuth({
-        session
-      });
-    }
-  }
-  return /*#__PURE__*/_jsxs(_Fragment, {
-    children: [/*#__PURE__*/_jsxs(MenuAccordion, {
-      expanded: expanded,
-      onChange: onExpand,
-      locale: locale,
-      title: /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsx(AccountIcon, {
-          className: "session-manager-menu-icon",
-          style: {
-            width: 24,
-            height: 24
-          }
-        }), t('accounts')]
-      }),
-      children: [accounts.map(item => /*#__PURE__*/_jsx(AccountItem, {
-        account: item,
-        locale: locale,
-        active: session.user.did === item.did,
-        onDelete: onDelete,
-        onChoose: onChoose
-      }, item.did)), /*#__PURE__*/_jsx(AddAccountItem, {
-        session: session,
-        locale: locale,
-        onAdd: onAdd
-      }), oauthConfigList.length > 0 && !hasBindAccount && /*#__PURE__*/_jsxs(MenuItem, {
-        className: "session-manager-menu-item",
-        onClick: _onBindWallet,
-        "aria-label": !isRawWalletAccount ? `${t('bind')}DID Wallet` : `${t('bind')}${t('thirdParty')}`,
-        "data-cy": "sessionManager-bind-trigger",
-        children: [/*#__PURE__*/_jsx(Icon, {
-          icon: LinkIcon,
-          width: 24,
-          height: 24,
-          className: "session-manager-menu-icon"
-        }), !isRawWalletAccount ? `${t('bind')}DID Wallet` : `${t('bind')}${t('thirdParty')}`]
-      }), !hideLogout ? /*#__PURE__*/_jsxs(MenuItem, {
-        className: "session-manager-menu-item",
-        onClick: _onLogout,
-        disabled: disableLogout,
-        "aria-label": "Logout account",
-        sx: {
-          position: 'relative'
-        },
-        "data-cy": "sessionManager-logout-trigger",
-        children: [pageState.logoutLoading ? /*#__PURE__*/_jsx(LinearProgress, {
-          sx: {
-            height: '2px',
-            position: 'absolute',
-            top: 0,
-            left: 0,
-            right: 0
-          }
-        }) : null, /*#__PURE__*/_jsx(SvgIcon, {
-          component: DisconnectIcon,
-          className: "session-manager-menu-icon"
-        }), t('disconnect')]
-      }) : null]
-    }), confirmHolder]
-  });
-}
-ManageAccounts.propTypes = {
-  session: PropTypes.object.isRequired,
-  locale: PropTypes.string,
-  onBindWallet: PropTypes.func.isRequired,
-  onSwitchDid: PropTypes.func.isRequired,
-  connectAccount: PropTypes.func.isRequired,
-  close: PropTypes.func.isRequired,
-  hasBindAccount: PropTypes.bool,
-  disableLogout: PropTypes.bool,
-  onLogout: PropTypes.func.isRequired,
-  expanded: PropTypes.bool,
-  onExpand: PropTypes.func,
-  accounts: PropTypes.array.isRequired,
-  deleteAccount: PropTypes.func.isRequired,
-  hideLogout: PropTypes.bool
-};
-ManageAccounts.defaultProps = {
-  locale: 'en',
-  hasBindAccount: false,
-  disableLogout: false,
-  expanded: true,
-  onExpand: noop,
-  hideLogout: false
-};

package/es/SessionManager/components/manage-blocklet.js

@@ -1,70 +0,0 @@
-/* eslint-disable react/no-array-index-key */
-import PropTypes from 'prop-types';
-import { useMemoizedFn } from 'ahooks';
-import { Icon } from '@iconify/react';
-import AppsIcon from '@iconify-icons/mdi/apps';
-import { MenuItem, SvgIcon } from '@mui/material';
-import MenuAccordion from './menu-accordion';
-import { translate } from '../../Locale/util';
-import { translations } from '../libs/translation';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment as _Fragment } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function ManageBlocklet({
-  menu,
-  menuRender,
-  locale,
-  expanded,
-  onExpand
-}) {
-  const t = useMemoizedFn((key, data = {}) => {
-    return translate(translations, key, locale, 'en', data);
-  });
-  return /*#__PURE__*/_jsxs(MenuAccordion, {
-    expanded: expanded,
-    locale: locale,
-    onChange: onExpand,
-    title: /*#__PURE__*/_jsxs(_Fragment, {
-      children: [/*#__PURE__*/_jsx(Icon, {
-        icon: AppsIcon,
-        width: 24,
-        height: 24,
-        className: "session-manager-menu-icon"
-      }), t('blocklet')]
-    }),
-    children: [Array.isArray(menu) && menu.map((menuItem, index) => {
-      const {
-        svgIcon,
-        ...menuProps
-      } = menuItem;
-      return /*#__PURE__*/_jsxs(MenuItem, {
-        className: "session-manager-menu-item",
-        ...menuProps,
-        icon: undefined,
-        label: undefined,
-        children: [svgIcon ? svgIcon && /*#__PURE__*/_jsx(SvgIcon, {
-          component: svgIcon,
-          className: "session-manager-menu-icon"
-        }) : menuItem.icon, menuItem.label]
-      }, index);
-    }), menuRender({
-      classes: {
-        menuItem: 'session-manager-menu-item',
-        menuIcon: 'session-manager-menu-icon'
-      }
-    })]
-  });
-}
-ManageBlocklet.propTypes = {
-  menu: PropTypes.array,
-  menuRender: PropTypes.func,
-  locale: PropTypes.string.isRequired,
-  expanded: PropTypes.bool,
-  onExpand: PropTypes.func
-};
-ManageBlocklet.defaultProps = {
-  menu: [],
-  menuRender: () => {},
-  expanded: true,
-  onExpand: () => {}
-};

package/es/SessionManager/components/menu-accordion.js

@@ -1,103 +0,0 @@
-import PropTypes from 'prop-types';
-import { Accordion, AccordionDetails, AccordionSummary, MenuItem } from '@mui/material';
-import ExpandMoreIcon from '@iconify-icons/mdi/expand-more';
-import { Icon } from '@iconify/react';
-import isEmpty from 'lodash/isEmpty';
-import isNil from 'lodash/isNil';
-import { useCreation, useMemoizedFn } from 'ahooks';
-import { translate } from '../../Locale/util';
-import { translations } from '../libs/translation';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-function isEmptyNode(node) {
-  if (isNil(node)) {
-    return true;
-  }
-  if (isEmpty(node)) {
-    return true;
-  }
-  if (Array.isArray(node)) {
-    return node.every(item => isEmptyNode(item));
-  }
-  return false;
-}
-export default function MenuAccordion({
-  title,
-  children,
-  locale,
-  expanded,
-  onChange
-}) {
-  const isEmptyChildren = useCreation(() => isEmptyNode(children), [children]);
-  const t = useMemoizedFn((key, data = {}) => {
-    return translate(translations, key, locale, 'en', data);
-  });
-  return /*#__PURE__*/_jsxs(Accordion, {
-    expanded: expanded,
-    disableGutters: true,
-    elevation: 0,
-    onChange: (e, value) => {
-      onChange(value);
-    },
-    sx: {
-      '&.MuiAccordion-root:before': {
-        content: 'unset'
-      },
-      '.MuiAccordionSummary-root': {
-        minHeight: 'auto',
-        width: '100%'
-      },
-      '.MuiAccordionSummary-content': {
-        margin: 0
-      },
-      '.MuiAccordionDetails-root': {
-        padding: 0,
-        '.session-manager-menu-item': {
-          fontSize: '15px',
-          padding: '12px 15px 12px 42px',
-          whiteSpace: 'normal'
-        },
-        '.session-manager-menu-icon': {
-          height: '21px',
-          widht: '21px'
-        }
-      }
-    },
-    children: [/*#__PURE__*/_jsx(MenuItem, {
-      sx: {
-        padding: 0,
-        width: '100%'
-      },
-      children: /*#__PURE__*/_jsx(AccordionSummary, {
-        className: "session-manager-menu-item",
-        expandIcon: /*#__PURE__*/_jsx(Icon, {
-          icon: ExpandMoreIcon,
-          width: 24,
-          height: 24
-        }),
-        children: title
-      })
-    }), /*#__PURE__*/_jsx(AccordionDetails, {
-      children: isEmptyChildren ? /*#__PURE__*/_jsx(MenuItem, {
-        disabled: true,
-        className: "session-manager-menu-item",
-        sx: {
-          justifyContent: 'center'
-        },
-        children: t('noneMenu')
-      }, "empty") : children
-    })]
-  });
-}
-MenuAccordion.propTypes = {
-  title: PropTypes.any.isRequired,
-  children: PropTypes.any.isRequired,
-  locale: PropTypes.string,
-  expanded: PropTypes.bool,
-  onChange: PropTypes.func
-};
-MenuAccordion.defaultProps = {
-  locale: 'en',
-  expanded: true,
-  onChange: () => {}
-};

package/es/SessionManager/components/responsive-popper.js

@@ -1,24 +0,0 @@
-import { useCreation, useSize } from 'ahooks';
-import UserPopper from './user-popper';
-import UserDrawer from './user-drawer';
-import { useTheme } from '../../Theme';
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function ResponsivePopper(props) {
-  const theme = useTheme();
-  const size = useSize(document.body);
-  const isMobile = useCreation(() => {
-    if (size?.width <= theme.breakpoints.values.sm) {
-      return true;
-    }
-    return false;
-  }, [theme, size]);
-  const WrapContainer = useCreation(() => {
-    if (isMobile) {
-      return UserDrawer;
-    }
-    return UserPopper;
-  }, [isMobile]);
-  return /*#__PURE__*/_jsx(WrapContainer, {
-    ...props
-  });
-}

package/es/SessionManager/components/user-drawer.js

@@ -1,68 +0,0 @@
-import PropTypes from 'prop-types';
-import { IconButton, Drawer } from '@mui/material';
-import CloseIcon from '@iconify-icons/mdi/close';
-import { Icon } from '@iconify/react';
-import noop from 'lodash/noop';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { jsxs as _jsxs } from "react/jsx-runtime";
-export default function UserDrawer({
-  children,
-  open,
-  onOpen,
-  onClose
-}) {
-  return /*#__PURE__*/_jsxs(Drawer, {
-    anchor: "bottom",
-    open: open,
-    onClose: onClose,
-    onOpen: onOpen,
-    sx: theme => ({
-      '& .MuiDrawer-paper.MuiPaper-root': {
-        width: '100%',
-        height: '90vh',
-        borderTopLeftRadius: '16px',
-        borderTopRightRadius: '16px'
-      },
-      '& .MuiChip-root .MuiChip-icon': {
-        color: theme.palette.success.main
-      },
-      '& .session-manager-menu-item': {
-        padding: '15px',
-        color: '#777',
-        fontSize: '16px',
-        '&:hover': {
-          backgroundColor: '#fbfbfb'
-        }
-      },
-      '& .session-manager-menu-icon': {
-        color: '#999',
-        marginRight: '8px'
-      }
-    }),
-    children: [/*#__PURE__*/_jsx(IconButton, {
-      sx: {
-        cursor: 'pointer',
-        position: 'absolute',
-        right: '8px',
-        top: '8px',
-        zIndex: 1
-      },
-      onClick: onClose,
-      children: /*#__PURE__*/_jsx(Icon, {
-        icon: CloseIcon,
-        width: 28,
-        height: 28
-      })
-    }), children]
-  });
-}
-UserDrawer.propTypes = {
-  children: PropTypes.any.isRequired,
-  open: PropTypes.bool.isRequired,
-  onOpen: PropTypes.func,
-  onClose: PropTypes.func
-};
-UserDrawer.defaultProps = {
-  onOpen: noop,
-  onClose: noop
-};