@abtnode/ux 1.16.27-beta-426c1690 → 1.16.27-beta-d27e19fa

package/lib/blocklet/publish/utils/validate-params.js

@@ -0,0 +1,92 @@
+import { PROJECT } from '@blocklet/constant';
+import { UNOWNED_DID } from '@abtnode/constant';
+import semver from 'semver';
+export const validateParams = ({
+  params,
+  isSelectedResources,
+  projectId,
+  status,
+  t
+}) => {
+  const errors = [];
+  if (!params.blockletTitle) {
+    errors.push({
+      param: 'blockletTitle',
+      message: t('blocklet.publish.errorTip.noTitle')
+    });
+  }
+  if (!projectId || projectId === UNOWNED_DID) {
+    errors.push({
+      param: 'projectId',
+      message: t('blocklet.publish.errorTip.noDid')
+    });
+  }
+  if (!isSelectedResources) {
+    errors.push({
+      param: 'blockletResources',
+      message: t('blocklet.publish.errorTip.noResource')
+    });
+  }
+  if (!params.blockletVersion) {
+    errors.push({
+      param: 'blockletVersion',
+      message: t('blocklet.publish.errorTip.noVersion')
+    });
+  } else if (!semver.valid(params.blockletVersion)) {
+    errors.push({
+      param: 'blockletVersion',
+      message: t('blocklet.publish.errorTip.inValidVersion')
+    });
+  }
+  if (status === PROJECT.RELEASE_STATUS.published) {
+    if (!params.blockletDescription) {
+      errors.push({
+        param: 'blockletDescription',
+        message: t('blocklet.publish.errorTip.noDescription')
+      });
+    }
+    if (!params.note) {
+      errors.push({
+        param: 'note',
+        message: t('blocklet.publish.errorTip.noNote')
+      });
+    }
+  }
+  return errors.length ? errors : null;
+};
+export const validateParamsStep = ({
+  params,
+  isSelectedResources,
+  step,
+  t,
+  projectId
+}) => {
+  if (step === 0) {
+    if (!params.blockletTitle) {
+      return t('blocklet.publish.errorTip.noTitle');
+    }
+    if (!projectId || projectId === UNOWNED_DID) {
+      return t('blocklet.publish.errorTip.noDid');
+    }
+    if (!params.blockletDescription) {
+      return t('blocklet.publish.errorTip.noDescription');
+    }
+  }
+  if (step === 2) {
+    if (!isSelectedResources) {
+      return t('blocklet.publish.errorTip.noResource');
+    }
+  }
+  if (step >= 4) {
+    if (!params.blockletVersion) {
+      return t('blocklet.publish.errorTip.noVersion');
+    }
+    if (!semver.valid(params.blockletVersion)) {
+      return t('blocklet.publish.errorTip.inValidVersion');
+    }
+    if (!params.note) {
+      return t('blocklet.publish.errorTip.noNote');
+    }
+  }
+  return '';
+};

package/lib/blocklet/router/action/add-domain-alias.js

@@ -6,11 +6,8 @@ import MenuItem from '@mui/material/MenuItem';
 import PropTypes from 'prop-types';
 import useSetState from 'react-use/lib/useSetState';
 import Confirm from '../../../confirm';
-import { DomainProvider, useDomainContext } from '../../../contexts/domain';
-import { useNodeContext } from '../../../contexts/node';
-import { sleep } from '../../../util';
+import { DomainProvider } from '../../../contexts/domain';
 import AddDomain from '../add-domain';
-import { parseDomainFromURL } from '../util';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 function AddDomainAliasComponent({
   id,
@@ -24,56 +21,17 @@ function AddDomainAliasComponent({
   const {
     t
   } = useLocaleContext();
-  const {
-    api
-  } = useNodeContext();
   const [state, setState] = useSetState({
     loading: false,
     confirmSetting: null
   });
   const cnameDomain = systemDomains.find(item => isDidDomain(item));
-  const domainContext = useDomainContext();
   const onCancel = () => {
     setState({
       loading: false,
       confirmSetting: null
     });
   };
-  const onConfirm = async params => {
-    if (state.loading) {
-      return;
-    }
-    setState({
-      loading: true
-    });
-    try {
-      const domain = parseDomainFromURL(params.domain);
-      const validateResult = await domainContext.validateDomain(domain, params.type);
-      if (!validateResult) {
-        // eslint-disable-next-line consistent-return
-        return false;
-      }
-      await api.addDomainAlias({
-        input: {
-          id,
-          domainAlias: domain,
-          teamDid
-        }
-      });
-      await sleep(2000);
-      setState({
-        confirmSetting: null
-      });
-    } catch (error) {
-      domainContext.setError(error.message);
-      // eslint-disable-next-line consistent-return
-      return false; // 防止 Dialog 关闭
-    } finally {
-      setState({
-        loading: false
-      });
-    }
-  };
   const setting = {
     title: title || t('router.domainAlias.add.title'),
     // eslint-disable-next-line react/no-unstable-nested-components
@@ -108,7 +66,6 @@ function AddDomainAliasComponent({
       domain: '',
       __disableConfirm: true
     },
-    onConfirm,
     onCancel
   };
   const onMenuItemClick = e => {
@@ -139,14 +96,13 @@ function AddDomainAliasComponent({
       confirm: state.confirmSetting.confirm,
       cancel: state.confirmSetting.cancel,
       params: state.confirmSetting.params,
-      onConfirm: state.confirmSetting.onConfirm,
       onCancel: state.confirmSetting.onCancel,
       showConfirm: false,
       showCancel: true,
       displayError: false,
       color: "primary",
       loading: state.loading,
-      maxWidth: "lg"
+      maxWidth: "sm"
     })]
   });
 }

package/lib/blocklet/router/add-domain.js

@@ -15,15 +15,17 @@ import Typography from '@mui/material/Typography';
 import useTheme from '@mui/material/styles/useTheme';
 import noop from 'lodash/noop';
 import trim from 'lodash/trim';
+import pRetry from 'p-retry';
 import PropTypes from 'prop-types';
 import useAsync from 'react-use/lib/useAsync';
 import useSetState from 'react-use/lib/useSetState';
 import { useDomainContext } from '../../contexts/domain';
 import { useNodeContext } from '../../contexts/node';
-import { sleep, validateDomain } from '../../util';
+import { validateDomain } from '../../util';
 import { axios } from '../../util/api';
 import DNSTip from './dns-tip';
 import { parseDomainFromURL } from './util';
+import ConfirmDialog from '../../../lib/confirm';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export default function AddDomain({
   siteId,
@@ -34,9 +36,14 @@ export default function AddDomain({
   appId,
   appPk,
   onSuccess,
+  onError,
   disabled,
   autoFocus,
   inBlockletSetup,
+  shouldCheckDomain,
+  onStateChange,
+  currentIp,
+  resolveDomain,
   ...props
 }) {
   const {
@@ -53,7 +60,7 @@ export default function AddDomain({
     key: 'sm'
   });
   const [state, setState] = useSetState({
-    loading: false,
+    submittingDomain: false,
     domain: defaultCustomDomain,
     error: null,
     type: info?.nftDomainUrl ? 'nftDomain' : 'inputDomain',
@@ -80,6 +87,151 @@ export default function AddDomain({
     });
   }
   const nftDomainService = nftDomainURLState.value;
+  const resetState = () => {
+    setState({
+      invalidDNSDomain: null
+    });
+  };
+  const addDomain = async domain => {
+    onStateChange(t('setup.domain.addingDomain'));
+    await api.addDomainAlias({
+      input: {
+        id: siteId,
+        domainAlias: domain,
+        teamDid,
+        inBlockletSetup: true
+      }
+    });
+    setState({
+      submittingDomain: false
+    });
+    onSuccess({
+      domain,
+      type: 'inputDomain'
+    });
+  };
+  const submitDomain = async ({
+    domain,
+    type,
+    nftDid,
+    chainHost
+  }) => {
+    try {
+      if (!shouldCheckDomain) {
+        if (type === 'inputDomain') {
+          await addDomain(domain);
+          return;
+        }
+        onSuccess({
+          domain,
+          type,
+          nftDid,
+          chainHost
+        });
+        return;
+      }
+      onStateChange({
+        text: t('setup.domain.checkingResolvable')
+      });
+      let counter = 30;
+      const timeout = 3000;
+      const retries = import.meta.env?.PROD || process?.env?.NODE_ENV === 'production' ? counter * 1000 / timeout : 0; // 重试 10 * 3000 = 30s 左右
+
+      const timer = setInterval(() => {
+        if (counter <= 0) {
+          clearInterval(timer);
+          return;
+        }
+        onStateChange({
+          text: `${t('setup.domain.checkingResolvable')} (${counter--}s)`
+        });
+      }, 1000);
+      const address = await pRetry(async () => {
+        const {
+          data
+        } = await resolveDomain(domain);
+        if (!data.address) {
+          throw new Error('Cannot resolve domain');
+        }
+        return data.address;
+      }, {
+        retries,
+        minTimeout: timeout,
+        maxTimeout: timeout,
+        onFailedAttempt: console.error
+      }).catch(console.error);
+      clearInterval(timer);
+      if (!address) {
+        const err = t('setup.domain.cannotResolve', {
+          domain
+        });
+        if (type === 'nftDomain') {
+          Toast.error(err);
+          onSuccess({
+            domain,
+            type: 'nftDomain'
+          });
+          return;
+        }
+        onStateChange({
+          text: ''
+        });
+        setState({
+          invalidDNSDomain: {
+            domain,
+            error: err
+          },
+          domain,
+          type,
+          submittingDomain: false
+        });
+        return;
+      }
+      if (address !== currentIp) {
+        const err = t('setup.domain.resolvedAddressError', {
+          domain,
+          curDomain: window.location.hostname
+        });
+        if (type === 'nftDomain') {
+          Toast.error(err);
+          onSuccess({
+            domain,
+            type: 'nftDomain'
+          });
+          return;
+        }
+        onStateChange({
+          text: ''
+        });
+        setState({
+          invalidDNSDomain: {
+            domain,
+            error: err
+          },
+          domain,
+          type,
+          submittingDomain: false
+        });
+        return;
+      }
+      if (type === 'nftDomain') {
+        onSuccess({
+          domain,
+          type: 'nftDomain'
+        });
+        return;
+      }
+      await addDomain(domain);
+    } catch (err) {
+      Toast.error(err.message);
+      onStateChange({
+        text: ''
+      });
+      setState({
+        submittingDomain: false
+      });
+    }
+  };
   const handleAuthSuccess = async ({
     domain,
     nftDid,
@@ -87,6 +239,9 @@ export default function AddDomain({
   }) => {
     try {
       const tmpDomain = parseDomainFromURL(domain);
+      setState({
+        submittingDomain: true
+      });
       await api.addDomainAlias({
         input: {
           id: siteId,
@@ -98,14 +253,14 @@ export default function AddDomain({
           inBlockletSetup
         }
       });
-      await sleep(2000);
+      const type = 'nftDomain';
       setState({
         showNFTDomainAuth: false,
-        type: 'nftDomain'
+        type
       });
-      onSuccess({
+      await submitDomain({
         domain: tmpDomain,
-        type: state.type,
+        type,
         nftDid,
         chainHost
       });
@@ -113,14 +268,15 @@ export default function AddDomain({
       Toast.error(error.message);
     } finally {
       setState({
-        showNFTDomainAuth: false
+        showNFTDomainAuth: false,
+        submittingDomain: false
       });
     }
   };
   const handleAdd = async () => {
     try {
       setState({
-        loading: true
+        submittingDomain: true
       });
       const domain = parseDomainFromURL(state.domain);
       if (info.nftDomainUrl && nftDomainService) {
@@ -136,35 +292,29 @@ export default function AddDomain({
           return;
         }
       }
-      await api.addDomainAlias({
-        input: {
-          id: siteId,
-          domainAlias: domain,
-          teamDid
-        }
-      });
-      await sleep(2000);
-      setState({
-        loading: false,
-        domain: ''
-      });
-      onSuccess({
+      await submitDomain({
         domain,
         type: state.type
       });
     } catch (error) {
-      domainContext.setError(error.message);
       setState({
-        loading: false
+        submittingDomain: false
       });
+      domainContext.setError(error.message);
     }
   };
   const error = domainContext.error || state.error; // TODO: state error 可能不需要了
 
-  const domainTypes = {
-    inputDomain: {
-      name: t('router.domainAlias.inputDomain'),
-      component: /*#__PURE__*/_jsxs(Box, {
+  return /*#__PURE__*/_jsx(Box, {
+    ...props,
+    children: /*#__PURE__*/_jsxs(Box, {
+      sx: {
+        display: 'flex',
+        flexDirection: 'column',
+        justifyContent: 'flex-start',
+        gap: '1em'
+      },
+      children: [/*#__PURE__*/_jsxs(Box, {
         sx: {
           display: 'flex',
           flexDirection: 'column',
@@ -172,7 +322,6 @@ export default function AddDomain({
         },
         children: [info.nftDomainUrl && nftDomainService && /*#__PURE__*/_jsxs(Box, {
           sx: {
-            maxWidth: '640px',
             color: theme.palette.text.primary
           },
           children: [/*#__PURE__*/_jsx(Typography, {
@@ -195,7 +344,8 @@ export default function AddDomain({
           })]
         }), /*#__PURE__*/_jsx(TextField, {
           sx: {
-            display: 'block'
+            display: 'block',
+            marginTop: '8px'
           },
           label: t('router.domainAlias.add.domainDescription'),
           helperText: state.type === 'inputDomain' && error || t('router.domainAlias.add.helperText'),
@@ -242,7 +392,7 @@ export default function AddDomain({
             "data-cy": "confirm-add-domain",
             fullWidth: isMobile,
             variant: "contained",
-            loading: state.loading,
+            loading: state.submittingDomain,
             onClick: handleAdd,
             children: t('common.add')
           })
@@ -269,40 +419,16 @@ export default function AddDomain({
             marginTop: '4px'
           }
         })]
-      })
-    }
-  };
-  const inputDomainTypes = Object.keys(domainTypes);
-  inputDomainTypes.sort(x => {
-    // 优先展示 nft domain
-    if (x === 'inputDomain') {
-      return 1;
-    }
-    return -1;
-  });
-  return /*#__PURE__*/_jsx(Box, {
-    ...props,
-    children: /*#__PURE__*/_jsxs(Box, {
-      sx: {
-        display: 'flex',
-        flexDirection: 'column',
-        justifyContent: 'flex-start',
-        gap: '1em'
-      },
-      children: [inputDomainTypes.map((type, index) => /*#__PURE__*/_jsxs(Box, {
-        children: [inputDomainTypes.length > 1 && /*#__PURE__*/_jsx(Box, {
-          sx: {
-            fontWeight: 700,
-            color: theme.palette.text.primary
-          },
-          children: `${t(`optionsOrder.${index + 1}`)}: ${domainTypes[type]?.name}`
-        }), /*#__PURE__*/_jsx(Box, {
-          sx: {
-            marginTop: '8px'
-          },
-          children: domainTypes[type]?.component
-        })]
-      }, type)), nftDomainService && /*#__PURE__*/_jsx(Connect, {
+      }), state.invalidDNSDomain && /*#__PURE__*/_jsx(ConfirmDialog, {
+        title: t('common.reminder'),
+        description: t('setup.domain.invalidDNSReminder', {
+          error: state.invalidDNSDomain.error
+        }),
+        color: "primary",
+        confirm: t('setup.domain.continueAdd'),
+        onConfirm: () => addDomain(state.invalidDNSDomain.domain, state.type),
+        onCancel: resetState
+      }), nftDomainService && /*#__PURE__*/_jsx(Connect, {
         open: state.showNFTDomainAuth,
         popup: true,
         useSocket: false,
@@ -319,7 +445,7 @@ export default function AddDomain({
         onSuccess: handleAuthSuccess,
         onClose: () => setState({
           showNFTDomainAuth: false,
-          loading: false
+          submittingDomain: false
         }),
         checkTimeout: 60 * 5000,
         showDownload: false,
@@ -335,6 +461,7 @@ export default function AddDomain({
 }
 AddDomain.propTypes = {
   siteId: PropTypes.string.isRequired,
+  currentIp: PropTypes.string,
   teamDid: PropTypes.string.isRequired,
   cnameDomain: PropTypes.string.isRequired,
   defaultCustomDomain: PropTypes.string,
@@ -344,15 +471,24 @@ AddDomain.propTypes = {
   appPk: PropTypes.string,
   disabled: PropTypes.bool,
   autoFocus: PropTypes.bool,
-  inBlockletSetup: PropTypes.bool
+  inBlockletSetup: PropTypes.bool,
+  shouldCheckDomain: PropTypes.bool,
+  onStateChange: PropTypes.func,
+  resolveDomain: PropTypes.func,
+  onError: PropTypes.func
 };
 AddDomain.defaultProps = {
   defaultCustomDomain: '',
+  currentIp: '',
   onInputDomain: noop,
   onSuccess: noop,
   appId: '',
   appPk: '',
   disabled: false,
   autoFocus: true,
-  inBlockletSetup: false
+  inBlockletSetup: false,
+  shouldCheckDomain: false,
+  onStateChange: () => {},
+  resolveDomain: () => {},
+  onError: () => {}
 };

package/lib/contexts/domain.js

@@ -3,7 +3,6 @@ import trim from 'lodash/trim';
 import { createContext, useContext } from 'react';
 import useSetState from 'react-use/lib/useSetState';
 import { validateDomain } from '../util';
-import { useNodeContext } from './node';
 import { jsx as _jsx } from "react/jsx-runtime";
 const DomainContext = /*#__PURE__*/createContext({});
 const {
@@ -20,12 +19,8 @@ function DomainProvider({
     error: null
   });
   const {
-    locale,
-    t
+    locale
   } = useLocaleContext();
-  const {
-    api
-  } = useNodeContext();
   const value = {
     error: state.error,
     domain: state.domain,
@@ -41,22 +36,6 @@ function DomainProvider({
         domain: tmpDomain,
         error: errMessage
       });
-    },
-    validateDomain: async (domain, type) => {
-      if (!state.error && type && type !== 'nftDomain') {
-        const result = await api.isDidDomain({
-          input: {
-            domain
-          }
-        });
-        if (result.value === true) {
-          setState({
-            error: t('router.domainAlias.add.isDidDomainError')
-          });
-          return false;
-        }
-      }
-      return true;
     }
   };
   return /*#__PURE__*/_jsx(Provider, {

package/lib/hooks/use-bundle-logo.js

@@ -1,7 +1,7 @@
 import joinUrl from 'url-join';
 import { WELLKNOWN_SERVICE_PATH_PREFIX } from '@abtnode/constant';
 import { useNodeContext } from '../contexts/node';
-import { formatRegistryLogoPath, APP_PREFIX, isDownloading } from '../util';
+import { formatRegistryLogoPath, APP_PREFIX, isDownloading, isExtracting } from '../util';
 export default function useAvatar({
   blocklet,
   ancestors = []
@@ -10,7 +10,8 @@ export default function useAvatar({
   const {
     inService
   } = node;
-  const search = `?v=${blocklet?.meta?.version}${isDownloading(blocklet?.status) ? '~' : ''}`;
+  const pending = isDownloading(blocklet?.status) || isExtracting(blocklet?.status);
+  const search = `?v=${blocklet?.meta?.version}${pending ? '~' : ''}`;
   let logoUrl = inService ? joinUrl(APP_PREFIX, WELLKNOWN_SERVICE_PATH_PREFIX, '/blocklet/logo-bundle', search) : joinUrl(node.imgPrefix, 'blocklet.png');
   if (blocklet.source === 'registry' && blocklet.deployedFrom && blocklet.meta.logo) {
     logoUrl = joinUrl(blocklet.deployedFrom, formatRegistryLogoPath(blocklet.meta.bundleDid, blocklet.meta.logo), search);

package/lib/layout/addon.js

@@ -25,27 +25,13 @@ export default function HeaderAddon({
     locale
   } = useContext(LocaleContext);
   const location = useLocation();
-  const defaultEndpoint = 'https://developer.blocklet.io/docs';
-  const docMap = {
-    '/store': {
-      endpoint: 'https://store.blocklet.io'
-    },
-    '/dashboard': {
-      path: '/conceptual/overview'
-    },
-    '/settings/router': {
-      path: '/conceptual/server-architecture'
-    }
-  };
   const onHelpClick = () => {
     const pathName = location.pathname;
-    let doc = {};
     if (pathName.indexOf('/store') > -1) {
-      doc = docMap['/store'];
-    } else if (docMap[pathName]) {
-      doc = docMap[pathName];
+      window.open('https://www.arcblock.io/content/docs/createblocklet', '_blank');
+      return;
     }
-    window.open(`${doc.endpoint || defaultEndpoint}/${locale}${doc.path || ''}`, '_blank');
+    window.open('https://www.arcblock.io/content/docs/blocklet-developer', '_blank');
   };
   return /*#__PURE__*/_jsxs(Div, {
     children: [extraItems.map((x, index) => /*#__PURE__*/cloneElement(x, {