@abtnode/ux 1.16.27-beta-4022dde0 → 1.16.27-beta-21d213c5

package/lib/blocklet/component/shorten-label.js

@@ -9,26 +9,40 @@ function shortenString(str, maxLength = 10) {
 }
 function ShortenLabel({
   children,
-  maxLength
+  maxLength,
+  sx,
+  hiddenTip
 }) {
   if (children?.length <= maxLength) {
     return /*#__PURE__*/_jsx(Typography, {
+      sx: sx,
       children: children
     });
   }
+  if (hiddenTip) {
+    return /*#__PURE__*/_jsx(Typography, {
+      sx: sx,
+      children: shortenString(children, maxLength)
+    });
+  }
   return /*#__PURE__*/_jsx(Tooltip, {
     title: children,
     placement: "top",
     children: /*#__PURE__*/_jsx(Typography, {
+      sx: sx,
       children: shortenString(children, maxLength)
     })
   });
 }
 ShortenLabel.propTypes = {
   children: PropTypes.string.isRequired,
-  maxLength: PropTypes.number
+  maxLength: PropTypes.number,
+  sx: PropTypes.object,
+  hiddenTip: PropTypes.bool
 };
 ShortenLabel.defaultProps = {
-  maxLength: 10
+  maxLength: 10,
+  sx: null,
+  hiddenTip: false
 };
 export default ShortenLabel;

package/lib/blocklet/publish/blocklet-card.js

@@ -0,0 +1,59 @@
+import { WELLKNOWN_SERVICE_PATH_PREFIX } from '@abtnode/constant';
+import { Avatar, Box } from '@mui/material';
+import PropTypes from 'prop-types';
+import { useState } from 'react';
+import ShortenLabel from '../component/shorten-label';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+function BlockletCard({
+  did,
+  projectId,
+  title,
+  logo,
+  describe
+}) {
+  const uploadLogoPrefix = `${WELLKNOWN_SERVICE_PATH_PREFIX}/api/project/${did}/${projectId}/logo/upload`;
+  const logoUrl = `${uploadLogoPrefix}/${logo}`;
+  const [hover, setHover] = useState(false);
+  return /*#__PURE__*/_jsxs(Box, {
+    sx: {
+      display: 'flex',
+      flexDirection: 'row',
+      color: hover ? 'primary.main' : 'grey.900',
+      gap: 1
+    },
+    onPointerEnter: () => setHover(true),
+    onPointerLeave: () => setHover(false),
+    children: [/*#__PURE__*/_jsx(Avatar, {
+      sx: {
+        borderRadius: 1
+      },
+      src: logoUrl
+    }), /*#__PURE__*/_jsxs(Box, {
+      children: [/*#__PURE__*/_jsx(ShortenLabel, {
+        hiddenTip: true,
+        maxLength: "24",
+        sx: {
+          fontSize: '14px',
+          fontWeight: '500'
+        },
+        children: title || '/'
+      }), /*#__PURE__*/_jsx(ShortenLabel, {
+        hiddenTip: true,
+        maxLength: "58",
+        sx: {
+          fontSize: '12px',
+          color: hover ? 'primary.main' : 'grey.700'
+        },
+        children: describe || '/'
+      })]
+    })]
+  });
+}
+BlockletCard.propTypes = {
+  projectId: PropTypes.string.isRequired,
+  did: PropTypes.string.isRequired,
+  title: PropTypes.string.isRequired,
+  logo: PropTypes.string.isRequired,
+  describe: PropTypes.string.isRequired
+};
+export default BlockletCard;

package/lib/blocklet/publish/create-release/branding.js

@@ -113,8 +113,104 @@ function Branding({
   const uploadScreenshotPrefix = `${WELLKNOWN_SERVICE_PATH_PREFIX}/api/project/${blocklet.meta.did}/${projectId}/screenshot/upload`;
   const logoUrl = params?.blockletLogo ? `${uploadLogoPrefix}/${params.blockletLogo}` : `${WELLKNOWN_SERVICE_PATH_PREFIX}/static/images/logo.png`;
   const screenshotUrls = (params?.blockletScreenshots || []).filter(Boolean).map(x => `${uploadScreenshotPrefix}/${x}`);
+  const checkCanUpload = () => {
+    if (readOnly) {
+      return false;
+    }
+    if (!projectId || projectId === UNOWNED_DID) {
+      Toast.error(t('blocklet.publish.errorTip.noFirstDid'));
+      return false;
+    }
+    return true;
+  };
   return /*#__PURE__*/_jsxs(Content, {
-    children: [/*#__PURE__*/_jsxs(Box, {
+    children: [/*#__PURE__*/_jsx(Box, {
+      display: "flex",
+      className: "section",
+      children: /*#__PURE__*/_jsxs(Box, {
+        sx: {
+          flex: 1
+        },
+        children: [/*#__PURE__*/_jsx(TextField, {
+          disabled: loading || readOnly,
+          label: `Blocklet ${t('common.title')}`,
+          placeholder: `Blocklet ${t('common.title')}`,
+          InputProps: {
+            'data-cy': 'blocklet-title',
+            readOnly
+          },
+          autoComplete: "off",
+          variant: "outlined",
+          fullWidth: true,
+          required: true,
+          value: params.blockletTitle || '',
+          onChange: e => {
+            setParamsErrTip({
+              blockletTitle: ''
+            });
+            setParams({
+              blockletTitle: e.target.value
+            });
+          },
+          error: !!paramsErrTip.blockletTitle,
+          helperText: paramsErrTip.blockletTitle || ''
+        }), /*#__PURE__*/_jsx(TextField, {
+          required: true,
+          label: "Blocklet DID",
+          fullWidth: true,
+          readonly: true,
+          disabled: true,
+          autoComplete: "off",
+          variant: "outlined",
+          InputProps: {
+            'data-cy': 'export-blocklet-did',
+            endAdornment: projectId === UNOWNED_DID && /*#__PURE__*/_jsx(InputAdornment, {
+              position: "end",
+              children: /*#__PURE__*/_jsx(ConnectStoreButton, {
+                blocklet: blocklet,
+                store: wantToConnectStore,
+                onChangeStore: setWantToConnectStore,
+                disabled: !params.blockletTitle || readOnly || loading,
+                loading: loading,
+                onClick: handleConnectByStudio
+              })
+            })
+          },
+          error: !!paramsErrTip.projectId,
+          helperText: paramsErrTip.projectId || '',
+          value: projectId === UNOWNED_DID ? '' : projectId,
+          sx: {
+            mt: 3
+          }
+        }), /*#__PURE__*/_jsx(TextField, {
+          disabled: loading || readOnly,
+          label: `Blocklet ${t('common.description')}`,
+          placeholder: `Blocklet ${t('common.description')}`,
+          InputProps: {
+            'data-cy': 'blocklet-description',
+            readOnly
+          },
+          required: true,
+          autoComplete: "off",
+          variant: "outlined",
+          fullWidth: true,
+          value: params.blockletDescription || '',
+          onChange: e => {
+            setParamsErrTip({
+              blockletDescription: ''
+            });
+            setParams({
+              blockletDescription: e.target.value
+            });
+          },
+          error: !!paramsErrTip.blockletDescription,
+          helperText: paramsErrTip.blockletDescription || '',
+          sx: {
+            mt: 3
+          }
+        })]
+      })
+    }), /*#__PURE__*/_jsxs(Box, {
       display: "flex",
       mt: 3,
       className: "section full-width",
@@ -143,7 +239,12 @@ function Branding({
               },
               alt: "Blocklet Logo",
               src: initLogoUrl || logoUrl,
-              onClick: () => !readOnly && uploaderLogoRef.current.open()
+              onClick: () => {
+                if (!checkCanUpload()) {
+                  return;
+                }
+                uploaderLogoRef.current.open();
+              }
             })
           })]
         }), /*#__PURE__*/_jsxs(Box, {
@@ -191,7 +292,12 @@ function Branding({
               justifyContent: "center",
               alignItems: "center",
               fontSize: 40,
-              onClick: () => !readOnly && uploaderScreenshotRef.current.open(),
+              onClick: () => {
+                if (!checkCanUpload()) {
+                  return;
+                }
+                uploaderScreenshotRef.current.open();
+              },
               children: "+"
             })]
           })]
@@ -251,92 +357,6 @@ function Branding({
           }
         }, "uploader-screenshot")
       })]
-    }), /*#__PURE__*/_jsx(Box, {
-      display: "flex",
-      className: "section",
-      children: /*#__PURE__*/_jsxs(Box, {
-        sx: {
-          flex: 1
-        },
-        children: [/*#__PURE__*/_jsx(TextField, {
-          disabled: loading || readOnly,
-          label: `Blocklet ${t('common.title')}`,
-          placeholder: `Blocklet ${t('common.title')}`,
-          InputProps: {
-            'data-cy': 'blocklet-title',
-            readOnly
-          },
-          autoComplete: "off",
-          variant: "outlined",
-          fullWidth: true,
-          required: true,
-          value: params.blockletTitle || '',
-          onChange: e => {
-            setParamsErrTip({
-              blockletTitle: ''
-            });
-            setParams({
-              blockletTitle: e.target.value
-            });
-          },
-          error: !!paramsErrTip.blockletTitle,
-          helperText: paramsErrTip.blockletTitle || ''
-        }), /*#__PURE__*/_jsx(TextField, {
-          required: true,
-          label: "Blocklet DID",
-          fullWidth: true,
-          readonly: true,
-          disabled: true,
-          autoComplete: "off",
-          variant: "outlined",
-          InputProps: {
-            'data-cy': 'export-blocklet-did',
-            endAdornment: projectId === UNOWNED_DID && /*#__PURE__*/_jsx(InputAdornment, {
-              position: "end",
-              children: /*#__PURE__*/_jsx(ConnectStoreButton, {
-                blocklet: blocklet,
-                store: wantToConnectStore,
-                onChangeStore: setWantToConnectStore,
-                disabled: !params.blockletTitle || readOnly || loading,
-                loading: loading,
-                onClick: handleConnectByStudio
-              })
-            })
-          },
-          error: !!paramsErrTip.projectId,
-          helperText: paramsErrTip.projectId || '',
-          value: projectId === UNOWNED_DID ? '' : projectId,
-          sx: {
-            mt: 3
-          }
-        }), /*#__PURE__*/_jsx(TextField, {
-          disabled: loading || readOnly,
-          label: `Blocklet ${t('common.description')}`,
-          placeholder: `Blocklet ${t('common.description')}`,
-          InputProps: {
-            'data-cy': 'blocklet-description',
-            readOnly
-          },
-          required: true,
-          autoComplete: "off",
-          variant: "outlined",
-          fullWidth: true,
-          value: params.blockletDescription || '',
-          onChange: e => {
-            setParamsErrTip({
-              blockletDescription: ''
-            });
-            setParams({
-              blockletDescription: e.target.value
-            });
-          },
-          error: !!paramsErrTip.blockletDescription,
-          helperText: paramsErrTip.blockletDescription || '',
-          sx: {
-            mt: 3
-          }
-        })]
-      })
     })]
   });
 }

package/lib/blocklet/publish/create-release/header.js

@@ -156,7 +156,7 @@ function Header({
         concurrency: 2
       });
     } catch (err) {
-      Toast.error(err.message);
+      Toast.error(err?.response?.data?.error?.message || err.message);
       setLoading(false);
       setParamsErrTip({
         resources: 'Invalid save the resource'
@@ -188,7 +188,7 @@ function Header({
           componentDid
         }, '*');
       }
-      if (mode === 'create') {
+      if (mode === 'create' || mode === 'new-release') {
         const id = res?.release?.id;
         navigate(`../${projectId}/view/${id}`, {
           replace: true

package/lib/blocklet/publish/create-release/index.js

@@ -311,7 +311,7 @@ export default function CreateRelease({
     label: componentsUrlTitle || t('common.components'),
     description: t('blocklet.publish.steps.blocklets')
   }, {
-    label: mode === 'create' || mode === 'new-version' ? t('blocklet.publish.newVersionTitle') : t('blocklet.publish.versionTitle'),
+    label: t('blocklet.publish.versionTitle'),
     description: t('blocklet.publish.steps.version')
   }];
   const nowStep = steps[activeStep] || steps[steps.length - 1];
@@ -330,6 +330,7 @@ export default function CreateRelease({
       isPublished: isPublished,
       loading: loading,
       setLoading: setLoading,
+      initLogoUrl: initLogoUrl,
       releaseId: releaseId,
       projectId: projectId,
       resourceComponents: resourceComponents,

package/lib/blocklet/publish/create-release/release-stepper.js

@@ -110,7 +110,7 @@ export default function ReleaseStepper({
                     mr: 1
                   },
                   disabled: error || !ok,
-                  children: "Continue"
+                  children: t('common.continue')
                 }), index > 0 && /*#__PURE__*/_jsx(Button, {
                   disabled: index === 0,
                   onClick: handleBack,
@@ -118,7 +118,7 @@ export default function ReleaseStepper({
                     mt: 1,
                     mr: 1
                   },
-                  children: "Back"
+                  children: t('common.back')
                 })]
               })
             })]

package/lib/blocklet/publish/create-release/tree.js

@@ -128,7 +128,7 @@ export default function Tree({
           tabIndex: -1,
           disableRipple: true,
           onClick: event => handleNodeSelect(event, node.id),
-          disabled: disabled
+          disabled: node.disabled || disabled
         }),
         label: /*#__PURE__*/_jsxs(Box, {
           className: "content",

package/lib/blocklet/publish/project-list.js

@@ -19,7 +19,7 @@ import Toast from '@arcblock/ux/lib/Toast';
 import Tag from '@arcblock/ux/lib/Tag';
 import RelativeTime from '@arcblock/ux/lib/RelativeTime';
 import DidConnect from '@arcblock/did-connect/lib/Connect';
-import { Tooltip, Typography } from '@mui/material';
+import { Tooltip, Typography, useMediaQuery } from '@mui/material';
 import { useSessionContext } from '../../contexts/session';
 import { useBlockletContext } from '../../contexts/blocklet';
 import { useNodeContext } from '../../contexts/node';
@@ -28,6 +28,7 @@ import DidAddress from '../../did-address';
 import Confirm from '../../confirm';
 import BlockletBundleAvatar from '../bundle-avatar';
 import ShortenLabel from '../component/shorten-label';
+import BlockletCard from './blocklet-card';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export default function ProjectList({
   initUrl
@@ -50,6 +51,7 @@ export default function ProjectList({
   } = useBlockletContext();
   const [deleteConfirm, setDeleteConfirm] = useState(null);
   const [openDidConnect, setOpenDidConnect] = useState(false);
+  const smallScreen = useMediaQuery(theme => theme.breakpoints.down('xl'));
   const {
     componentDid = ''
   } = useParams();
@@ -148,39 +150,68 @@ export default function ProjectList({
   const columns = [{
     label: 'Blocklet',
     name: 'blockletTitle',
+    minWidth: 160,
     options: {
       customBodyRenderLite: rawIndex => {
         const project = projects[rawIndex];
         return /*#__PURE__*/_jsx(Link, {
           to: `${project.id}`,
-          children: project.blockletTitle || '/'
+          children: /*#__PURE__*/_jsx(BlockletCard, {
+            did: blocklet.meta.did,
+            projectId: project.id,
+            logo: project.blockletLogo,
+            title: project.blockletTitle,
+            describe: project.blockletDescription
+          })
         });
       }
     }
+  }, {
+    label: 'Version',
+    name: 'blockletVersion',
+    options: {
+      customBodyRender: value => {
+        return value ? /*#__PURE__*/_jsx(Tag, {
+          type: "success",
+          children: value
+        }) : '';
+      }
+    }
   }, {
     label: 'DID',
     name: 'blockletDid',
     options: {
-      customBodyRender: e => {
+      customBodyRender: did => {
         return /*#__PURE__*/_jsx(DidAddress, {
           size: 14,
-          responsive: true,
-          did: e
+          compact: true,
+          responsive: false,
+          did: did
         });
       }
     }
-  }, {
-    label: 'Version',
-    name: 'blockletVersion',
+  }, smallScreen || componentDid ? null : {
+    label: t('common.createdBy'),
+    name: 'createdBy',
     options: {
-      customBodyRender: value => {
-        return value ? /*#__PURE__*/_jsx(Tag, {
-          type: "success",
-          children: value
-        }) : '';
+      customBodyRender: did => {
+        return /*#__PURE__*/_jsx(DidAddress, {
+          onClick: () => {
+            navigate(`/.well-known/service/admin/members?did=${did}`);
+          },
+          style: {
+            cursor: 'pointer'
+          },
+          size: 14,
+          compact: true,
+          copyable: false,
+          showQrcode: false,
+          responsive: false,
+          did: did
+        });
       }
     }
-  }, componentDid ? null : {
+  }, smallScreen || componentDid ? null : {
     label: t('common.scope'),
     name: 'componentDid',
     options: {
@@ -209,7 +240,7 @@ export default function ProjectList({
         }, value);
       }
     }
-  }, tenantScope ? null : {
+  }, smallScreen || tenantScope ? null : {
     label: t('blocklet.publish.tenantScope'),
     name: 'tenantScope',
     options: {

package/lib/blocklet/publish/release-list.js

@@ -25,6 +25,7 @@ import { useBlockletContext } from '../../contexts/blocklet';
 import { useNodeContext } from '../../contexts/node';
 import EmptySpinner from '../../empty-spinner';
 import Confirm from '../../confirm';
+import BlockletCard from './blocklet-card';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 export default function ReleaseList() {
   const {
@@ -156,7 +157,7 @@ export default function ReleaseList() {
           },
           children: t('blocklet.publish.createReleaseTip')
         }), /*#__PURE__*/_jsx(Link, {
-          to: "create",
+          to: "create/none",
           children: /*#__PURE__*/_jsx(Button, {
             variant: "contained",
             children: t('blocklet.publish.createRelease')
@@ -168,12 +169,19 @@ export default function ReleaseList() {
   const columns = [{
     label: t('common.version'),
     name: 'blockletVersion',
+    minWidth: 160,
     options: {
       customBodyRenderLite: rawIndex => {
         const release = releases[rawIndex];
         return /*#__PURE__*/_jsx(Link, {
           to: `view/${release.id}`,
-          children: release.blockletVersion || '/'
+          children: /*#__PURE__*/_jsx(BlockletCard, {
+            did: blocklet.meta.did,
+            projectId: project.id,
+            logo: release.blockletLogo,
+            title: release.blockletVersion,
+            describe: release.blockletTitle
+          })
         });
       }
     }
@@ -334,7 +342,6 @@ export default function ReleaseList() {
     })]
   });
 }
-ReleaseList.propTypes = {};
 const Main = styled(Box)`
   .header {
     display: flex;

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"
     })]
   });
 }