@arcblock/ux 2.10.67 → 2.10.69

package/src/Layout/dashboard/external-link.jsx

@@ -1,47 +0,0 @@
-import PropTypes from 'prop-types';
-import { Link as RouterLink, NavLink as RouterNavLink } from 'react-router-dom';
-
-// 包裹 router Link/NavLink 组件, 支持 external link (external 为 true 时渲染为 a 标签)
-function ExternalLink({ children, routerLinkComponent: RouterLinkComponent, to, external, ...rest }) {
-  if (external) {
-    return (
-      <a href={to} {...rest}>
-        {children}
-      </a>
-    );
-  }
-  return (
-    <RouterLinkComponent to={to} {...rest}>
-      {children}
-    </RouterLinkComponent>
-  );
-}
-
-ExternalLink.propTypes = {
-  children: PropTypes.any.isRequired,
-  routerLinkComponent: PropTypes.elementType.isRequired,
-  external: PropTypes.bool,
-  to: PropTypes.oneOfType([PropTypes.string, PropTypes.object]).isRequired,
-};
-
-ExternalLink.defaultProps = {
-  external: false,
-};
-
-export function Link(props) {
-  return <ExternalLink routerLinkComponent={RouterLink} {...props} />;
-}
-
-export function NavLink({ className, ...rest }) {
-  // NavLink#className 支持 function
-  const classes = rest.external && typeof className === 'function' ? className({}) : className;
-  return <ExternalLink routerLinkComponent={RouterNavLink} className={classes} {...rest} />;
-}
-
-NavLink.propTypes = {
-  className: PropTypes.oneOfType([PropTypes.string, PropTypes.func]),
-};
-
-NavLink.defaultProps = {
-  className: '',
-};

package/src/Logo/index.jsx

@@ -1,66 +0,0 @@
-import PropTypes from 'prop-types';
-
-import { styled } from '../Theme';
-
-// eslint-disable-next-line import/no-unresolved
-import LightLogo from './images/logo-light-top.svg?react';
-// eslint-disable-next-line import/no-unresolved
-import LightText from './images/logo-light-text.svg?react';
-// eslint-disable-next-line import/no-unresolved
-import DarkLogo from './images/logo-dark-top.svg?react';
-// eslint-disable-next-line import/no-unresolved
-import DarkText from './images/logo-dark-text.svg?react';
-
-/**
-  @typedef {import('react').HTMLAttributes<HTMLSpanElement> & {
-    mode?: 'light' | 'dark',
-    layout?: 'vertical' | 'horizontal',
-    showText?: boolean,
-    showLogo?: boolean,
-  }} LogoProps
-*/
-
-/**
- * @description
- * @export
- * @param {LogoProps} props
- * @return {React.ReactComponentElement}
- */
-export default function Logo({ showText, showLogo, mode, layout, ...rest }) {
-  const logo = mode === 'light' ? <LightLogo /> : <DarkLogo />;
-  const text = mode === 'light' ? <LightText className="logo-text" /> : <DarkText className="logo-text" />;
-
-  return (
-    <Container layout={layout} {...rest}>
-      {showLogo && logo}
-      {showText && text}
-    </Container>
-  );
-}
-
-Logo.propTypes = {
-  mode: PropTypes.oneOf(['light', 'dark']),
-  layout: PropTypes.oneOf(['vertical', 'horizontal']),
-  showText: PropTypes.bool,
-  showLogo: PropTypes.bool,
-};
-
-Logo.defaultProps = {
-  mode: 'dark',
-  layout: 'vertical',
-  showText: true,
-  showLogo: true,
-};
-
-/** @type {import('@emotion/styled').StyledComponent<HTMLSpanElement, {}, { ref?: React.Ref<any> | undefined;}>} */
-const Container = styled('span')`
-  display: inline-flex;
-  flex-direction: ${(props) => (props.layout === 'horizontal' ? 'row' : 'column')};
-  justify-content: center;
-  align-items: center;
-
-  .logo-text {
-    ${(props) => (props.layout === 'vertical' ? 'margin-top: 8px;' : '')}
-    ${(props) => (props.layout === 'vertical' ? '' : 'margin-left: 8px;')};
-  }
-`;

package/src/Result/index.jsx

@@ -1,33 +0,0 @@
-import PropTypes from 'prop-types';
-import Result from './result';
-import * as common from './common';
-
-const componentsKeyByStatus = Object.keys(common).reduce(
-  (acc, cur) => ({ ...acc, [common[cur].status || cur]: common[cur] }),
-  {}
-);
-
-function ResultWrapper({ status, ...rest }) {
-  if (status) {
-    if (componentsKeyByStatus[status]) {
-      const Component = componentsKeyByStatus[status];
-      return <Component {...rest} />;
-    }
-    throw new Error(
-      `Please provide a valid status for Result.status. Valid values are: ${Object.keys(componentsKeyByStatus).join(
-        ', '
-      )}`
-    );
-  }
-  return <Result {...rest} />;
-}
-
-ResultWrapper.propTypes = {
-  status: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  ...Result.propTypes,
-};
-ResultWrapper.defaultProps = {
-  status: '',
-};
-
-export default ResultWrapper;

package/src/SessionPermission/index.jsx

@@ -1,28 +0,0 @@
-import PropTypes from 'prop-types';
-import { useCreation } from 'ahooks';
-
-const roleList = ['owner', 'admin', 'member', 'guest'];
-
-export default function SessionPermission({ session, roles, children }) {
-  const hasPermission = useCreation(() => {
-    return roles.includes(session?.user?.role || 'guest');
-  }, [session?.user?.role, roles]);
-
-  if (typeof children === 'function') {
-    return children({ hasPermission });
-  }
-
-  if (hasPermission) {
-    return children;
-  }
-}
-
-SessionPermission.propTypes = {
-  children: PropTypes.any.isRequired,
-  session: PropTypes.object.isRequired,
-  roles: PropTypes.arrayOf(PropTypes.oneOf(roleList)),
-};
-
-SessionPermission.defaultProps = {
-  roles: ['owner', 'admin'],
-};

package/src/SessionUser/components/session-user-item.jsx

@@ -1,93 +0,0 @@
-import PropTypes from 'prop-types';
-import { forwardRef } from 'react';
-import { Box, IconButton, Tooltip, Typography } from '@mui/material';
-import { Icon } from '@iconify/react';
-import LensIcon from '@iconify-icons/material-symbols/lens';
-
-import WalletOSIcon from '../../WalletOSIcon';
-import Avatar from '../../Avatar';
-import DID from '../../DID';
-import { temp as colors } from '../../Colors';
-import { getSourceProvider } from '../libs/utils';
-
-const SessionUserItem = forwardRef(({ sessionItem, statusContent, active, ...rest }, ref) => {
-  const isRawWalletAccount = getSourceProvider(sessionItem?.user) === 'wallet';
-
-  return (
-    <Box
-      {...rest}
-      ref={ref}
-      sx={{
-        display: 'flex',
-        alignItems: 'center',
-        justifyContent: 'space-between',
-        py: 0.75,
-        px: 1,
-        width: '100%',
-        ...rest?.sx,
-      }}>
-      <Box
-        sx={{
-          display: 'flex',
-          alignItems: 'center',
-          gap: 0.5,
-          overflow: 'hidden',
-          '& .did-address-avatar': {
-            display: 'none !important',
-          },
-          '& .did-address-text': {
-            color: `${colors.textBase} !important`,
-          },
-        }}>
-        <Box sx={{ mr: 0.5, fontSize: 0 }}>
-          <Avatar did={sessionItem.userDid} size={36} />
-        </Box>
-        <WalletOSIcon
-          loading={sessionItem.__isDefault}
-          provider={sessionItem?.extra?.provider}
-          walletOS={sessionItem?.extra?.walletOS}
-        />
-        {isRawWalletAccount ? (
-          <DID did={sessionItem.userDid} copyable={false} size={14} responsive={false} compact sx={{ lineHeight: 1 }} />
-        ) : (
-          sessionItem.user.email && (
-            <Tooltip
-              title={sessionItem.user.email}
-              sx={{
-                zIndex: 1600,
-              }}
-              placement="top">
-              <Typography
-                sx={{
-                  fontSize: 14,
-                  overflow: 'hidden',
-                  textOverflow: 'ellipsis',
-                }}>
-                {sessionItem.user.email}
-              </Typography>
-            </Tooltip>
-          )
-        )}
-      </Box>
-      {statusContent ||
-        (active && (
-          <IconButton size="small" disableRipple>
-            <Icon icon={LensIcon} fontSize={6} color={colors.surfaceSuccess} />
-          </IconButton>
-        ))}
-    </Box>
-  );
-});
-
-SessionUserItem.propTypes = {
-  sessionItem: PropTypes.object.isRequired,
-  statusContent: PropTypes.node,
-  active: PropTypes.bool,
-};
-
-SessionUserItem.defaultProps = {
-  statusContent: null,
-  active: false,
-};
-
-export default SessionUserItem;

package/src/SessionUser/index.jsx

@@ -1,38 +0,0 @@
-import PropTypes from 'prop-types';
-import noop from 'lodash/noop';
-import { useCreation } from 'ahooks';
-
-import LoggedIn from './components/logged-in';
-import UnLogin from './components/un-login';
-
-export default function SessionUser({ session, onBindWallet, locale, size }) {
-  const isBlocklet = useCreation(() => {
-    return !!globalThis?.blocklet;
-  });
-  if (session.user) {
-    return (
-      <LoggedIn isBlocklet={isBlocklet} session={session} onBindWallet={onBindWallet} locale={locale} size={size} />
-    );
-  }
-  return <UnLogin session={session} isBlocklet={isBlocklet} locale={locale} size={size} />;
-}
-
-SessionUser.propTypes = {
-  session: PropTypes.shape({
-    user: PropTypes.shape({
-      did: PropTypes.string.isRequired,
-      fullName: PropTypes.string.isRequired,
-      avatar: PropTypes.string.isRequired,
-      email: PropTypes.string,
-    }),
-  }).isRequired,
-  onBindWallet: PropTypes.func,
-  locale: PropTypes.string,
-  size: PropTypes.number,
-};
-
-SessionUser.defaultProps = {
-  onBindWallet: noop,
-  locale: 'en',
-  size: 24,
-};

package/src/SessionUser/libs/utils.js

@@ -1,37 +0,0 @@
-export const getSourceAppPid = (user) => user?.sourceAppPid;
-
-export const getCurrentAppPid = (user) => user?.sourceAppPid || window?.blocklet?.appPid;
-
-export function getPermanentDid(user) {
-  return user?.did;
-}
-
-export function getConnectedAccounts(user) {
-  return user?.connectedAccounts || user?.extraConfigs?.connectedAccounts || [];
-}
-
-export function getSourceProvider(user) {
-  return user?.sourceProvider || user?.extraConfigs?.sourceProvider || 'wallet';
-}
-
-export function getSourceProviders(user) {
-  const connectedAccounts = getConnectedAccounts(user);
-  return connectedAccounts.map((item) => item.provider);
-}
-
-export function getConnectedDids(user) {
-  const connectedAccounts = getConnectedAccounts(user);
-  const didList = connectedAccounts.map((item) => item.did);
-  return didList;
-}
-
-export function getWallet(user) {
-  const connectedAccounts = getConnectedAccounts(user);
-  const walletAccount = connectedAccounts.find((item) => item.provider === 'wallet');
-  return walletAccount;
-}
-
-export function getWalletDid(user) {
-  const walletAccount = getWallet(user);
-  return walletAccount?.did;
-}

package/src/Spinner/index.jsx

@@ -1,21 +0,0 @@
-import CircularProgress from '@mui/material/CircularProgress';
-import { withDeprecated } from '../Util/deprecate';
-
-/**
- * Spinner
- *
- * 之前的 Spinner 实现由内外 2 个环构成, 现在改为基于 @mui/material/CircularProgress 的实现
- *
- * - 之前 size prop 是 array 类型, 需要与 CircularProgress#size 兼容
- * - color 默认使用 #4598fa, 如果调用方传入了 color prop 或 style#color, 则默认 color 被覆盖
- */
-function Spinner(props) {
-  const _props = { ...props };
-  // 兼容之前的 size prop (设置外圈/内圈的尺寸)
-  if (_props.size && Array.isArray(_props.size)) {
-    [_props.size] = _props.size;
-  }
-  return <CircularProgress {..._props} />;
-}
-
-export default withDeprecated(Spinner, { name: 'Spinner', alternative: '@mui/material/CircularProgress' });