@abtnode/ux 1.16.27-beta-f109b207 → 1.16.27-beta-74c4e335

package/lib/blocklet/audit-logs.js

@@ -2,6 +2,7 @@
 import styled from '@emotion/styled';
 import { Link } from 'react-router-dom';
 import MarkdownPreview from '@uiw/react-markdown-preview';
+import rehypeExternalLinks from 'rehype-external-links';
 import DidAvatar from '@arcblock/did-connect/lib/Avatar';
 import Spinner from '@mui/material/CircularProgress';
 import Empty from '@arcblock/ux/lib/Empty';
@@ -105,7 +106,9 @@ function AuditLog({
         gutterBottom: true,
         children: /*#__PURE__*/_jsx(MarkdownPreview, {
           source: log.content,
-          linkTarget: "_blank"
+          rehypePlugins: [[rehypeExternalLinks, {
+            target: '_blank'
+          }]]
         })
       }), /*#__PURE__*/_jsxs(Box, {
         className: "log-meta",

package/lib/blocklet/component/add-component/add-component-core.js

@@ -101,6 +101,7 @@ export default function AddComponentCore({
   storageKey,
   inDialog,
   selectedMeta,
+  storeUrl,
   showResourcesSwitch,
   showFromUrl,
   enableRunBackground,
@@ -264,6 +265,7 @@ export default function AddComponentCore({
   useSubscription(BlockletEvents.installFailed, createBlockletEventHandler(() => {
     setInstallErrorResult(t('blocklet.component.installComponentError'));
   }), [blocklet?.meta?.did]);
+  const steps = [];
   const onOver = () => {
     setLoading(false);
     setParams({});
@@ -383,7 +385,6 @@ export default function AddComponentCore({
     setError(errMsg);
 
     // the step can complete, install component
-    // eslint-disable-next-line no-use-before-define
     if (activeStep === steps.length - 2) {
       await onInstall(payload);
     }
@@ -494,6 +495,7 @@ export default function AddComponentCore({
     });
     component.current = {
       ...chooseParams,
+      // FIXME: @zhanghan 此处不应该修改 meta 的结构，会导致在不同地方看到的 meta 结果不一样，然后产生误解
       meta: {
         ...meta,
         // init configs from environments
@@ -611,14 +613,14 @@ export default function AddComponentCore({
     }
   };
   useEffect(() => {
-    if (!selectedMeta || activeStep !== 0) {
+    if (!selectedMeta || activeStep !== 0 || !blocklet) {
       return;
     }
     setConfigValue({
       chooseParams: {
         blocklets: [selectedMeta],
         meta: selectedMeta,
-        registryUrl: selectedMeta.homepage,
+        registryUrl: storeUrl || selectedMeta.homepage,
         inStore: true
       },
       isInit: true
@@ -629,8 +631,8 @@ export default function AddComponentCore({
     onNext();
 
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [selectedMeta, activeStep]);
-  const steps = [{
+  }, [selectedMeta, activeStep, blocklet]);
+  steps.push({
     key: 'selectComponent',
     name: t('blocklet.component.selectComponent'),
     body: /*#__PURE__*/_jsxs(TypographyWrapper, {
@@ -695,7 +697,7 @@ export default function AddComponentCore({
               fontSize: 20,
               marginRight: 4
             }
-          }), ' ', t('blocklet.component.addComponentTip.fromUrl'), ' ']
+          }), " ", t('blocklet.component.addComponentTip.fromUrl'), ' ']
         }) : null : null,
         loading: loading,
         onChange: () => {
@@ -762,10 +764,14 @@ export default function AddComponentCore({
     onConfirm: () => {
       onNext();
     }
-  }, {
+  });
+  steps.push({
     key: 'agreement',
     name: t('launchBlocklet.introduction'),
-    body: /*#__PURE__*/_jsxs(TypographyWrapper, {
+    body:
+    /*#__PURE__*/
+    // TODO: @zhanghan 添加要展示的信息，暂时无法添加，需要修改 launch-layout 里的组件
+    _jsxs(TypographyWrapper, {
       component: "div",
       className: "agreement-wrapper",
       children: [/*#__PURE__*/_jsx(PageHeader, {
@@ -792,187 +798,200 @@ export default function AddComponentCore({
         })
       })]
     }),
-    cancel: selectedMeta ? t('common.cancel') : t('common.pre'),
+    cancel: selectedMeta ? undefined : t('common.pre'),
     confirm: t('launchBlocklet.next'),
     onCancel: selectedMeta ? onOver : onCancel,
     onConfirm: () => {
       setIsWaitingPurchase(false);
       onNext();
     }
-  }, meta && params.requirePurchase && {
-    key: 'purchase',
-    name: /*#__PURE__*/_jsxs(_Fragment, {
-      children: [t('common.verifyNFT'), /*#__PURE__*/_jsx(Required, {})]
-    }),
-    body: /*#__PURE__*/_jsxs(TypographyWrapper, {
-      component: "div",
-      className: "flex-align-center",
-      style: {
-        flexDirection: 'column'
-      },
-      children: [!(purchaseRef.current?.getCurrentStep?.() === 2 || isWaitingPurchase) && /*#__PURE__*/_jsx(PageHeaderWrapper, {
-        title: t('common.verifyNFT'),
-        subTitle: t('blocklet.component.addComponentTip.verifyNFT')
-      }), !isEmpty(params.purchaseResultProps) ? /*#__PURE__*/_jsx("div", {
-        className: "flex-align-center flex-justify-center",
-        children: /*#__PURE__*/_jsx(ResultMessage, {
-          ...params.purchaseResultProps
-        })
-      }) : purchaseData && /*#__PURE__*/_jsx(ComponentPurchaseSelect, {
-        ref: purchaseRef,
-        meta: purchaseData.meta
-        // if select deleted history, use verify mode
-        ,
-        mode: params.componentDid ? 'verify' : 'both',
-        onCancel: onCancelPurchase,
-        installOpts: purchaseData.installOpts,
-        handlePaySuccess: onSuccessPurchase
-      })]
-    }),
-    disabled: purchaseRef.current?.getCurrentStep?.() === 2 || isWaitingPurchase,
-    cancel: t('common.pre'),
-    confirm: t('common.next'),
-    onConfirm: () => {
-      if (typeof purchaseRef.current.onNext === 'function') {
-        purchaseRef.current.onNext();
-        setIsWaitingPurchase(true);
-      }
-    },
-    onCancel: () => {
-      onCancel();
-    }
-  }, hasStartEngine(meta) && !alreadyInstalled(meta.did) && {
-    key: 'config',
-    name: t('common.config'),
-    error,
-    body: /*#__PURE__*/_jsxs(TypographyWrapper, {
-      component: "div",
-      children: [/*#__PURE__*/_jsx(PageHeaderWrapper, {
-        title: t('common.config'),
-        subTitle: t('blocklet.component.addComponentTip.config')
-      }), /*#__PURE__*/_jsx(TextField, {
-        label: t('blocklet.component.mountPoint'),
-        autoComplete: "off",
-        variant: "outlined",
-        name: "pathPrefix",
-        inputProps: {
-          'data-cy': 'mount-point-input'
-        },
-        fullWidth: true,
-        helperText: mountPointHelperText || t('blocklet.component.mountPointTip'),
+  });
+  if (meta && params.requirePurchase) {
+    steps.push({
+      key: 'purchase',
+      name: /*#__PURE__*/_jsxs(_Fragment, {
+        children: [t('common.verifyNFT'), /*#__PURE__*/_jsx(Required, {})]
+      }),
+      body: /*#__PURE__*/_jsxs(TypographyWrapper, {
+        component: "div",
+        className: "flex-align-center",
         style: {
-          marginBottom: 32
+          flexDirection: 'column'
         },
-        margin: "normal",
-        value: params.pathPrefix,
-        onChange: e => {
-          const pathPrefix = e.target.value;
-          updateParams({
-            pathPrefix
-          });
-          setMountPointHelperText(t('common.slugifyHint', {
-            value: formatMountPoint(pathPrefix)
-          }));
+        children: [!(purchaseRef.current?.getCurrentStep?.() === 2 || isWaitingPurchase) && /*#__PURE__*/_jsx(PageHeaderWrapper, {
+          title: t('common.verifyNFT'),
+          subTitle: t('blocklet.component.addComponentTip.verifyNFT')
+        }), !isEmpty(params.purchaseResultProps) ? /*#__PURE__*/_jsx("div", {
+          className: "flex-align-center flex-justify-center",
+          children: /*#__PURE__*/_jsx(ResultMessage, {
+            ...params.purchaseResultProps
+          })
+        }) : purchaseData && /*#__PURE__*/_jsx(ComponentPurchaseSelect, {
+          ref: purchaseRef,
+          meta: purchaseData.meta
+          // if select deleted history, use verify mode
+          ,
+          mode: params.componentDid ? 'verify' : 'both',
+          onCancel: onCancelPurchase,
+          installOpts: purchaseData.installOpts,
+          handlePaySuccess: onSuccessPurchase
+        })]
+      }),
+      disabled: purchaseRef.current?.getCurrentStep?.() === 2 || isWaitingPurchase,
+      cancel: t('common.pre'),
+      confirm: t('common.next'),
+      onConfirm: () => {
+        if (typeof purchaseRef.current.onNext === 'function') {
+          purchaseRef.current.onNext();
+          setIsWaitingPurchase(true);
         }
-      }), !!error && /*#__PURE__*/_jsx(Alert, {
-        type: "error",
-        style: {
-          width: '100%',
-          marginTop: 8
-        },
-        children: error
-      })]
-    }),
-    cancel: t('common.pre'),
-    confirm: t('common.next'),
-    onCancel,
-    onConfirm: () => {
-      onNext();
-    }
-  }, meta && !alreadyInstalled(meta.did) && params?.hasEnvironmentsStep && {
-    key: 'environment',
-    name: /*#__PURE__*/_jsxs(_Fragment, {
-      children: [t('common.environment'), " ", params.hasRequiredEnvironments && /*#__PURE__*/_jsx(Required, {})]
-    }),
-    disabled: !!editingItem || params?.hasMissRequiredConfigs,
-    body: () => {
-      return /*#__PURE__*/_jsxs(TypographyWrapper, {
+      },
+      onCancel: () => {
+        onCancel();
+      }
+    });
+  }
+  if (hasStartEngine(meta) && !alreadyInstalled(meta.did)) {
+    steps.push({
+      key: 'config',
+      name: t('common.config'),
+      error,
+      body: /*#__PURE__*/_jsxs(TypographyWrapper, {
         component: "div",
         children: [/*#__PURE__*/_jsx(PageHeaderWrapper, {
-          title: t('common.environment'),
-          subTitle: t('blocklet.component.addComponentTip.environment')
-        }), /*#__PURE__*/_jsx(SchemaForm, {
+          title: t('common.config'),
+          subTitle: t('blocklet.component.addComponentTip.config')
+        }), /*#__PURE__*/_jsx(TextField, {
+          label: t('blocklet.component.mountPoint'),
+          autoComplete: "off",
+          variant: "outlined",
+          name: "pathPrefix",
+          inputProps: {
+            'data-cy': 'mount-point-input'
+          },
+          fullWidth: true,
+          helperText: mountPointHelperText || t('blocklet.component.mountPointTip'),
           style: {
-            marginTop: -12,
-            width: '100%'
+            marginBottom: 32
           },
-          schema: params.configsList,
-          defaultValue: params.configsValue
-          // eslint-disable-next-line
-          ,
-          onChange: (changeValue, {
-            action,
-            currentItem,
-            allValues
-          }) => {
-            if (action === 'confirm') {
-              updateParams({
-                hasMissRequiredConfigs: hasMissRequiredConfigs(params.configsList, allValues),
-                configsValue: allValues
-              });
-            }
-            if (action === 'edit') {
-              setEditingItem(currentItem);
-            } else if (['cancel', 'confirm'].includes(action)) {
-              setEditingItem(null);
-            }
+          margin: "normal",
+          value: params.pathPrefix,
+          onChange: e => {
+            const pathPrefix = e.target.value;
+            updateParams({
+              pathPrefix
+            });
+            setMountPointHelperText(t('common.slugifyHint', {
+              value: formatMountPoint(pathPrefix)
+            }));
           }
+        }), !!error && /*#__PURE__*/_jsx(Alert, {
+          type: "error",
+          style: {
+            width: '100%',
+            marginTop: 8
+          },
+          children: error
         })]
-      });
-    },
-    cancel: t('common.pre'),
-    confirm: t('common.next'),
-    onCancel,
-    onConfirm: onNext
-  }, meta && !alreadyInstalled(meta.did) && params?.didSpaceIsRequiredSetup && {
-    key: 'didSpace',
-    name: /*#__PURE__*/_jsxs(_Fragment, {
-      children: [t('blocklet.component.didSpaceConfig'), " ", params.didSpaceIsRequiredSetup === 'required' && /*#__PURE__*/_jsx(Required, {})]
-    }),
-    disabled: params?.didSpaceIsRequiredSetup && !params.didSpaceEndpoint,
-    body: () => {
-      return /*#__PURE__*/_jsx(ConfigSpaceProvider, {
-        children: /*#__PURE__*/_jsxs(TypographyWrapper, {
+      }),
+      cancel: t('common.pre'),
+      confirm: t('common.next'),
+      onCancel,
+      onConfirm: () => {
+        onNext();
+      }
+    });
+  }
+  if (meta && !alreadyInstalled(meta.did) && params?.hasEnvironmentsStep) {
+    steps.push({
+      key: 'environment',
+      name: /*#__PURE__*/_jsxs(_Fragment, {
+        children: [t('common.environment'), " ", params.hasRequiredEnvironments && /*#__PURE__*/_jsx(Required, {})]
+      }),
+      disabled: !!editingItem || params?.hasMissRequiredConfigs,
+      body: () => {
+        return /*#__PURE__*/_jsxs(TypographyWrapper, {
           component: "div",
           children: [/*#__PURE__*/_jsx(PageHeaderWrapper, {
-            title: t('blocklet.component.didSpaceConfig'),
-            subTitle: t('blocklet.component.didSpaceConfigTip')
-          }), /*#__PURE__*/_jsx(Box, {
-            sx: {
-              mt: '36px',
-              '& > div': {
-                maxWidth: 'unset !important',
-                '& .MuiAutocomplete-root': {
-                  maxWidth: 'unset !important'
-                }
-              }
+            title: t('common.environment'),
+            subTitle: t('blocklet.component.addComponentTip.environment')
+          }), /*#__PURE__*/_jsx(SchemaForm, {
+            style: {
+              marginTop: -12,
+              width: '100%'
             },
-            children: /*#__PURE__*/_jsx(DidSpace, {
-              blockletMeta: component.current.meta,
-              onNext: () => {
-                onNext();
-              },
-              onEndpointUpdate: refreshDidSpaceEndpoint
-            })
+            schema: params.configsList,
+            defaultValue: params.configsValue
+            // eslint-disable-next-line
+            ,
+            onChange: (changeValue, {
+              action,
+              currentItem,
+              allValues
+            }) => {
+              if (action === 'confirm') {
+                updateParams({
+                  hasMissRequiredConfigs: hasMissRequiredConfigs(params.configsList, allValues),
+                  configsValue: allValues
+                });
+              }
+              if (action === 'edit') {
+                setEditingItem(currentItem);
+              } else if (['cancel', 'confirm'].includes(action)) {
+                setEditingItem(null);
+              }
+            }
           })]
-        })
-      });
-    },
-    cancel: t('common.pre'),
-    confirm: t('common.next'),
-    onCancel,
-    onConfirm: onNext
-  }, {
+        });
+      },
+      cancel: t('common.pre'),
+      confirm: t('common.next'),
+      onCancel,
+      onConfirm: onNext
+    });
+  }
+  if (meta && !alreadyInstalled(meta.did) && params?.didSpaceIsRequiredSetup) {
+    steps.push({
+      key: 'didSpace',
+      name: /*#__PURE__*/_jsxs(_Fragment, {
+        children: [t('blocklet.component.didSpaceConfig'), " ", params.didSpaceIsRequiredSetup === 'required' && /*#__PURE__*/_jsx(Required, {})]
+      }),
+      disabled: params?.didSpaceIsRequiredSetup && !params.didSpaceEndpoint,
+      body: () => {
+        return /*#__PURE__*/_jsx(ConfigSpaceProvider, {
+          children: /*#__PURE__*/_jsxs(TypographyWrapper, {
+            component: "div",
+            children: [/*#__PURE__*/_jsx(PageHeaderWrapper, {
+              title: t('blocklet.component.didSpaceConfig'),
+              subTitle: t('blocklet.component.didSpaceConfigTip')
+            }), /*#__PURE__*/_jsx(Box, {
+              sx: {
+                mt: '36px',
+                '& > div': {
+                  maxWidth: 'unset !important',
+                  '& .MuiAutocomplete-root': {
+                    maxWidth: 'unset !important'
+                  }
+                }
+              },
+              children: /*#__PURE__*/_jsx(DidSpace, {
+                blockletMeta: component.current.meta,
+                onNext: () => {
+                  onNext();
+                },
+                onEndpointUpdate: refreshDidSpaceEndpoint
+              })
+            })]
+          })
+        });
+      },
+      cancel: t('common.pre'),
+      confirm: t('common.next'),
+      onCancel,
+      onConfirm: onNext
+    });
+  }
+  steps.push({
     key: 'install',
     name: alreadyInstalled(meta?.did) ? t('common.upgrade') : t('common.install'),
     disabled: enableRunBackground ? false : isEmpty(params.installResultProps),
@@ -1014,7 +1033,7 @@ export default function AddComponentCore({
         }
       }, 200);
     }
-  }].filter(item => item);
+  });
   const step = steps[activeStep] || {};
   const isDisabled = () => {
     if (loading || step.error || !params.bundleDid) {
@@ -1098,6 +1117,7 @@ AddComponentCore.propTypes = {
   mode: PropTypes.oneOf(['normal', 'embed']),
   inDialog: PropTypes.bool,
   stores: PropTypes.arrayOf(PropTypes.string),
+  storeUrl: PropTypes.string,
   resourceType: PropTypes.string,
   resourceDid: PropTypes.string,
   storageKey: PropTypes.string,
@@ -1111,6 +1131,7 @@ AddComponentCore.defaultProps = {
   onClose: () => {},
   mode: 'normal',
   stores: [],
+  storeUrl: '',
   resourceType: '',
   resourceDid: '',
   storageKey: '',

package/lib/blocklet/component/add-component/step-connect.js

@@ -36,7 +36,12 @@ const StepContent = /*#__PURE__*/forwardRef(({
     component: "div",
     className: isMobile ? 'mobileStyle' : '',
     sx: {
-      height: 'calc(100% - 56px)'
+      height: 'calc(100% - 56px)',
+      '&>div>div>div:first-child': {
+        flex: {
+          md: 1
+        }
+      }
     },
     children: /*#__PURE__*/_jsx(Layout, {
       locale: locale,
@@ -155,8 +160,9 @@ const ContentWrapper = styled(Box)`
             // left-panel
             &:first-child {
               padding: 0;
-              width: 25%;
-              min-width: 240px;
+              width: 20%;
+              min-width: 180px;
+
               & > div:first-child {
                 display: none;
               }

package/lib/blocklet/component/related-components-dialog.js

@@ -137,6 +137,7 @@ export default function RelatedComponentsDialog({
                 }
               },
               onClick: () => {
+                // FIXME: @zhanghan 不能使用 homepage 来获得最终地址
                 window.open(`${component.bundleSource?.store || component.meta.homepage}/blocklets/${component.meta.did}`, '_blank');
               },
               children: [component.meta.title, /*#__PURE__*/_jsx(Box, {

package/lib/blocklet/publish/connect-store-list.js

@@ -19,7 +19,8 @@ function ConnectStoreList({
   onPublish,
   onDelete,
   projectType,
-  componentDid
+  componentDid,
+  onOpenConnectStore
 }) {
   const {
     t
@@ -50,7 +51,8 @@ function ConnectStoreList({
           published: publishedStoreIds?.indexOf(x.id) > -1,
           connectedStore: connectedMap[x.id],
           onPublish: onPublish,
-          onDelete: onDelete
+          onDelete: onDelete,
+          onOpenConnectStore: onOpenConnectStore
         })
       })
     }, x.url)), !!storeList?.length && /*#__PURE__*/_jsx(Alert, {
@@ -89,13 +91,15 @@ ConnectStoreList.propTypes = {
   publishedStoreIds: PropTypes.arrayOf(PropTypes.string),
   connectedStores: PropTypes.arrayOf(PropTypes.object).isRequired,
   projectType: PropTypes.string,
-  componentDid: PropTypes.string
+  componentDid: PropTypes.string,
+  onOpenConnectStore: PropTypes.func
 };
 ConnectStoreList.defaultProps = {
   projectType: '',
   componentDid: '',
   publishedStoreIds: [],
   onPublish: () => {},
-  onDelete: () => {}
+  onDelete: () => {},
+  onOpenConnectStore: () => {}
 };
 export default ConnectStoreList;