@arcblock/did-connect-react 3.4.14 → 3.5.0

package/src/Session/did-spaces-guide.jsx

@@ -1,173 +0,0 @@
-/* eslint-disable import/no-unresolved */
-/* eslint-disable jsx-a11y/anchor-is-valid */
-import React, { useState } from 'react';
-import {
-  Dialog,
-  DialogTitle,
-  DialogContent,
-  DialogActions,
-  Button,
-  ImageListItem,
-  Typography,
-  Stack,
-  Box,
-  CircularProgress,
-} from '@mui/material';
-import { useCreation, useReactive } from 'ahooks';
-import PropTypes from 'prop-types';
-import isUndefined from 'lodash/isUndefined';
-import noop from 'lodash/noop';
-
-import DIDSpacesGuideCoverSVG from './assets/did-spaces-guide-cover.svg?react';
-import DidSpacesGuideIcon from './assets/did-spaces-guide-icon.svg?react';
-import { useLocale } from '../hooks/use-locale';
-import { t } from '../locales';
-import useMobile from './hooks/use-mobile';
-
-/**
- * @typedef {{
- *  autoClose?: true | false;
- *  open?: boolean;
- * }} DIDSpacesGuideProps
- */
-
-/**
- * @type {React.ForwardRefExoticComponent<React.PropsWithoutRef<DIDSpacesGuideProps> & React.RefAttributes<HTMLDivElement>>}
- */
-function DIDSpacesGuideView({ ...rawProps }) {
-  const props = Object.assign({}, rawProps);
-  if (isUndefined(props.open)) {
-    props.open = false;
-  }
-  if (isUndefined(props.onConnect)) {
-    props.onConnect = noop;
-  }
-  const locale = useLocale();
-  const isMobile = useMobile();
-  const currentState = useReactive({
-    loading: false,
-  });
-
-  const features = useCreation(() => {
-    return [
-      t('didSpacesGuide.feature.dataSecurity', locale),
-      t('didSpacesGuide.feature.dataSharing', locale),
-      t('didSpacesGuide.feature.dataSync', locale),
-      t('didSpacesGuide.feature.dataIntegration', locale),
-    ];
-  }, []);
-
-  return (
-    <Dialog
-      disableEscapeKeyDown
-      aria-labelledby="alert-dialog-title"
-      aria-describedby="alert-dialog-description"
-      open={props.open}>
-      <DialogTitle id="alert-dialog-title">
-        <Typography
-          sx={{
-            fontSize: '20px',
-            fontWeight: '500',
-          }}>
-          {t('didSpacesGuide.title', locale)}
-        </Typography>
-        <Typography
-          sx={{
-            fontSize: '14px',
-            fontWeight: '300',
-            color: '#9397A1',
-          }}>
-          {t('didSpacesGuide.description', locale)}
-        </Typography>
-      </DialogTitle>
-      <DialogContent sx={{ padding: '12px 20px !important' }}>
-        <ImageListItem sx={{ width: '100%' }}>
-          <DIDSpacesGuideCoverSVG style={{ width: '100%', height: isMobile ? '100%' : '167px' }} />
-        </ImageListItem>
-        <Stack
-          direction="row"
-          sx={{
-            justifyContent: 'space-between',
-            width: '100%',
-            padding: '16px',
-            mt: 1,
-            backgroundColor: '#F6F6F6',
-            borderRadius: '8px',
-          }}>
-          {features.map((x) => {
-            return (
-              <Box key={x} sx={{ display: 'flex', flex: 1, padding: 'auto 16px' }}>
-                <DidSpacesGuideIcon size="16px" />
-                <Typography
-                  variant="body1"
-                  sx={{
-                    marginLeft: '1.5px',
-                    color: '#030712',
-                    fontFamily: 'Helvetica Neue',
-                    fontSize: '12px',
-                    fontStyle: 'normal',
-                    fontWeight: '400',
-                    lineHeight: 'normal',
-                    letterSpacing: '-0.12px',
-                  }}>
-                  {x}
-                </Typography>
-              </Box>
-            );
-          })}
-        </Stack>
-      </DialogContent>
-      <DialogActions>
-        <Button
-          variant="contained"
-          size="small"
-          onClick={() => {
-            currentState.loading = true;
-            props.onConnect(() => {
-              currentState.loading = false;
-            });
-          }}
-          sx={{
-            boxShadow: 'none',
-          }}
-          disabled={currentState.loading}>
-          {currentState.loading ? <CircularProgress color="inherit" size={12} sx={{ mr: 1 }} /> : null}
-          {t('didSpacesGuide.connectNow', locale)}
-        </Button>
-      </DialogActions>
-    </Dialog>
-  );
-}
-
-DIDSpacesGuideView.propTypes = {
-  open: PropTypes.bool,
-  onConnect: PropTypes.func,
-};
-
-/**
- *
- *
- * @export
- * @param {DIDSpacesGuideProps} [props={}]
- * @return {*}
- */
-export default function useDIDSpacesGuide(props = {}) {
-  const [open, setOpen] = useState(false);
-  const [onConnect, setOnConnect] = useState(() => {});
-
-  const invokeOpen = () => {
-    setOpen(true);
-  };
-
-  const invokeClose = () => {
-    setOpen(false);
-  };
-
-  const invokeOnConnect = (callback) => {
-    setOnConnect(() => callback);
-  };
-  return {
-    DidSpacesGuideView: <DIDSpacesGuideView {...props} open={open} onConnect={onConnect} />,
-    didSpacesGuideApi: { open: invokeOpen, close: invokeClose, onConnect: invokeOnConnect },
-  };
-}

package/src/Session/handler.jsx

@@ -1,98 +0,0 @@
-import { ReactGA } from '@arcblock/ux/lib/withTracker';
-import { GA_LAST_LOGIN_METHOD, GA_LAST_ROLE, GA_LAST_SOURCE_PROVIDER } from '@arcblock/ux/lib/withTracker/constant';
-
-// 监听用户登录事件
-export const gaLoginSuccessHandler = () => {
-  /**
-   * @type {import('@arcblock/ux/lib/withTracker/action/login').LoginSuccessEvent}
-   */
-  const loginSuccessEvent = {
-    action: 'loginSuccess',
-    provider: localStorage.getItem(GA_LAST_LOGIN_METHOD),
-    success: true,
-  };
-  ReactGA.event(loginSuccessEvent.action, loginSuccessEvent);
-};
-
-/**
- *
- * @param {Error} error
- */
-export const gaLoginFailedHandler = (error) => {
-  /**
-   * @type {import('@arcblock/ux/lib/withTracker/action/login').LoginFailedEvent}
-   */
-  const loginFailedEvent = {
-    action: 'loginFailed',
-    provider: localStorage.getItem(GA_LAST_LOGIN_METHOD),
-    success: false,
-    errorMessage: error.message,
-  };
-  ReactGA.event(loginFailedEvent.action, loginFailedEvent);
-};
-
-export const gaSwitchPassportSuccessHandler = (_result, _decrypt, session) => {
-  const fromRole = localStorage.getItem(GA_LAST_ROLE);
-  const toRole = session?.user?.role;
-  const change = `${fromRole} -> ${toRole}`;
-  /** @type {import('@arcblock/ux/lib/withTracker/action/switch-passport').SwitchPassportSuccessEvent} */
-  const switchPassportSuccessEvent = {
-    action: 'switchPassportSuccess',
-    change,
-    success: true,
-  };
-  ReactGA.event(switchPassportSuccessEvent.action, switchPassportSuccessEvent);
-};
-
-/**
- *
- * @param {Error} error
- */
-export const gaSwitchPassportFailedHandler = (error) => {
-  /** @type {import('@arcblock/ux/lib/withTracker/action/switch-passport').SwitchPassportFailedEvent} */
-  const switchPassportFailedEvent = {
-    action: 'switchPassportFailed',
-    success: false,
-    errorMessage: error.message,
-  };
-  ReactGA.event(switchPassportFailedEvent.action, switchPassportFailedEvent);
-};
-
-/**
- *
- * @param {any} _result
- * @param {Function} _decrypt
- * @param {import('../types').SessionProps} session
- */
-/**
- *
- * @param {any} _result
- * @param {Function} _decrypt
- * @param {import('../types').SessionProps} session
- */
-export const gaBindWalletSuccessHandler = (_result, _decrypt, session) => {
-  /**
-   * @type {import('@arcblock/ux/lib/withTracker/action/bind-wallet').BindWalletSuccessEvent} */
-  const bindWalletEvent = {
-    action: 'bindWalletSuccess',
-    provider: session?.user?.sourceProvider,
-    success: true,
-  };
-  ReactGA.event(bindWalletEvent.action, bindWalletEvent);
-};
-
-/**
- * @param {Error} error
- * @param {import('../types').User} user
- */
-export const gaBindWalletFailedHandler = (error) => {
-  /** @type {import('@arcblock/ux/lib/withTracker/action/bind-wallet').BindWalletFailedEvent} */
-  const bindWalletFailedEvent = {
-    action: 'bindWalletFailed',
-    provider: localStorage.getItem(GA_LAST_SOURCE_PROVIDER),
-    success: false,
-    errorMessage: error.message,
-  };
-
-  ReactGA.event(bindWalletFailedEvent.action, bindWalletFailedEvent);
-};

package/src/Session/hooks/use-federated.js

@@ -1,91 +0,0 @@
-import { useMemoizedFn, useReactive } from 'ahooks';
-import { getConfig, getFederatedEnabled, getMaster } from '@arcblock/ux/lib/Util/federated';
-import noop from 'lodash/noop';
-
-import { loginFederatedMaster } from '../libs/federated';
-
-const translations = {
-  zh: {
-    notFoundFederatedInfo: '未发现统一登录的信息',
-    autoLoginFederatedFailed: '自动登录统一登录账号失败',
-    manualLoginFederatedFailed: '手动登录统一登录账号失败',
-  },
-  en: {
-    notFoundFederatedInfo: 'No federated login info detected',
-    autoLoginFederatedFailed: 'Auto login federated account failed',
-    manualLoginFederatedFailed: 'Manual login federated account failed',
-  },
-};
-
-export default function useFederated({ locale, handleLoginResult, login, handleRefreshUser }) {
-  const state = useReactive({
-    federatedMaster: null,
-  });
-  const federatedEnabled = getFederatedEnabled();
-  const master = getMaster();
-  const config = getConfig();
-
-  /**
-   * @deprecated no longer used
-   */
-  const loginFederated = useMemoizedFn(
-    async (callback = noop, extraParams = {}, options = {}) => {
-      // @compatible: 兼容旧的传递 origin 的方式
-      if (typeof options === 'string') {
-        // eslint-disable-next-line no-param-reassign
-        options = { origin: options };
-      }
-      // eslint-disable-next-line prefer-const
-      let { mode = 'auto', ...params } = extraParams;
-      if (options.mode) {
-        mode = options.mode;
-      }
-      // @compatible end
-
-      if (mode === 'auto') {
-        if (!federatedEnabled) {
-          // NOTE: 这里的错误仅展示在控制台，不需要展示给用户看
-          throw new Error(translations[locale].notFoundFederatedInfo);
-        }
-        try {
-          // 自动登录的前提是：master 已经登录成功，这里需要通过 master 拿到 member 的登录 token
-          // FIXME: @zhanghan 当 connect 组件使用不同的 baseUrl 时，不应该直接从 window.blocklet 去取值
-          const data = await loginFederatedMaster({ appId: globalThis.blocklet.appId }, { fetchToken: false });
-          handleLoginResult({ ...data, encrypted: false });
-          await handleRefreshUser({ showProgress: true });
-          callback();
-        } catch (err) {
-          const errMessage = err?.response ? err.response?.data : err?.message;
-          callback(errMessage || translations[locale].autoLoginFederatedFailed);
-        }
-      } else if (mode === 'manual') {
-        try {
-          login(
-            async () => {
-              await loginFederatedMaster(
-                // FIXME: @zhanghan 当 connect 组件使用不同的 baseUrl 时，不应该直接从 window.blocklet 去取值
-                { appId: globalThis.blocklet.appId, onlyWriteCookie: true }
-              );
-              callback();
-            },
-            { ...params },
-            options
-          );
-        } catch (err) {
-          const errMessage = err?.response ? err.response?.data : err?.message;
-          callback(errMessage || translations[locale].autoLoginFederatedFailed);
-        }
-      }
-    },
-    [handleRefreshUser, login, locale, handleLoginResult]
-  );
-
-  return {
-    master,
-    config,
-    federatedMaster: state.federatedMaster,
-    federatedEnabled,
-    loginFederated,
-    loginFederatedMaster,
-  };
-}

package/src/Session/hooks/use-mobile.jsx

@@ -1,6 +0,0 @@
-import { useTheme, useMediaQuery } from '@mui/material';
-
-export default function useMobile(key = 'sm') {
-  const theme = useTheme();
-  return useMediaQuery(theme.breakpoints.down(key));
-}

package/src/Session/hooks/use-protected-routes.js

@@ -1,16 +0,0 @@
-import { useCreation, useMemoizedFn } from 'ahooks';
-import pathToRegexp from 'path-to-regexp';
-
-export default function useProtectedRoutes({ protectedRoutes = [] }) {
-  const matchList = useCreation(() => {
-    return protectedRoutes.map((item) => pathToRegexp(item, []));
-  }, [protectedRoutes]);
-
-  const checkMatch = useMemoizedFn((currentRoute = window.location.pathname) => {
-    return matchList.some((item) => item.exec(currentRoute));
-  });
-
-  return {
-    checkMatch,
-  };
-}