@abtnode/ux 1.16.27-beta-725ce3a6 → 1.16.27-beta-d1555a79

package/es/blocklet/publish/create-release.js

@@ -1,1059 +0,0 @@
-import { useState, useEffect, lazy, useRef, useCallback, useMemo } from 'react';
-import { Link, useNavigate, useParams } from 'react-router-dom';
-import styled from '@emotion/styled';
-import useSetState from 'react-use/lib/useSetState';
-import pick from 'lodash/pick';
-import joinUrl from 'url-join';
-import semver from 'semver';
-import Avatar from '@mui/material/Avatar';
-import TextField from '@mui/material/TextField';
-import Typography from '@mui/material/Typography';
-import Breadcrumbs from '@mui/material/Breadcrumbs';
-import Box from '@mui/material/Box';
-import IconButton from '@mui/material/IconButton';
-import DeleteOutlineIcon from '@mui/icons-material/DeleteOutline';
-import CloudUploadRoundedIcon from '@mui/icons-material/CloudUploadRounded';
-import InputAdornment from '@mui/material/InputAdornment';
-import Spinner from '@mui/material/CircularProgress';
-import MaterialDialog from '@mui/material/Dialog';
-import DidConnect from '@arcblock/did-connect/lib/Connect';
-import { useLocaleContext } from '@arcblock/ux/lib/Locale/context';
-import Button from '@arcblock/ux/lib/Button';
-import Toast from '@arcblock/ux/lib/Toast';
-import Empty from '@arcblock/ux/lib/Empty';
-import Tabs from '@arcblock/ux/lib/Tabs';
-import Dialog from '@arcblock/ux/lib/Dialog';
-import Alert from '@arcblock/ux/lib/Alert';
-import { PROJECT } from '@blocklet/constant';
-import { EVENTS, STUDIO_CONNECTED_STORE, WELLKNOWN_SERVICE_PATH_PREFIX, UNOWNED_DID } from '@abtnode/constant';
-import BlockletBundleAvatar from '../bundle-avatar';
-import { useSessionContext } from '../../contexts/session';
-import { useNodeContext } from '../../contexts/node';
-import { useBlockletContext } from '../../contexts/blocklet';
-import EmptySpinner from '../../empty-spinner';
-import ClickToCopy from '../../click-to-copy';
-import { formatError } from '../../util';
-import Resource from './resource';
-import SelectComponents from './select-components';
-import ConnectStoreList from './connect-store-list';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-const allowedFileTypes = ['image/*', '.jpg', '.jpeg', '.png', '.gif', '.svg'];
-const maxFileSize = 1024 * 1024 * 10; // 10 MB
-
-const serverEndpoint = window.env?.serverEndpoint;
-
-// eslint-disable-next-line import/no-unresolved
-const UploaderComponent = /*#__PURE__*/lazy(() => import('@blocklet/uploader/react').then(res => ({
-  default: res.Uploader
-})));
-const validateParams = (params, status, t) => {
-  const errors = [];
-  if (!params.blockletTitle) {
-    errors.push({
-      param: 'blockletTitle',
-      message: t('blocklet.publish.errorTip.noTitle')
-    });
-  }
-  if (!params.blockletVersion) {
-    errors.push({
-      param: 'blockletVersion',
-      message: t('blocklet.publish.errorTip.noVersion')
-    });
-  } else if (!semver.valid(params.blockletVersion)) {
-    errors.push({
-      param: 'blockletVersion',
-      message: 'Invalid Blocklet Version'
-    });
-  }
-  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;
-};
-const addComponentTabs = ({
-  tabs,
-  blocklet,
-  ancestors = []
-}) => {
-  const key = blocklet.meta.did;
-  tabs.push({
-    label: /*#__PURE__*/_jsxs(Box, {
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "flex-start",
-      children: [/*#__PURE__*/_jsx(BlockletBundleAvatar, {
-        size: 24,
-        blocklet: blocklet,
-        ancestors: ancestors
-      }), /*#__PURE__*/_jsx(Box, {
-        ml: "4px",
-        className: "text",
-        children: /*#__PURE__*/_jsx(Box, {
-          children: blocklet.meta.title
-        })
-      })]
-    }, key),
-    value: key
-  });
-};
-const pickParams = (release, app) => {
-  const params = pick(release, ['blockletVersion', 'blockletTitle', 'blockletDescription', 'blockletLogo', 'blockletIntroduction', 'blockletScreenshots', 'blockletComponents', 'publishedStoreIds', 'connectedStores', 'note']);
-  params.blockletScreenshots ||= [];
-  params.publishedStoreIds ||= [];
-  params.connectedStores ||= [];
-  if (!params.blockletComponents) {
-    params.blockletComponents = (app.children || []).map(x => ({
-      did: x.meta.did,
-      included: false,
-      required: false
-    }));
-  } else {
-    params.blockletComponents = params.blockletComponents.map(x => ({
-      ...x,
-      included: true
-    }));
-  }
-  return params;
-};
-export default function CreateRelease({
-  ...rest
-}) {
-  const navigate = useNavigate();
-  const {
-    projectId,
-    releaseId: inputReleaseId,
-    componentDid = ''
-  } = useParams();
-  const {
-    t,
-    locale
-  } = useLocaleContext();
-  const {
-    api: sessionApi
-  } = useSessionContext();
-  const {
-    blocklet
-  } = useBlockletContext();
-  const [params, setParams] = useSetState(null);
-  const [paramsErrTip, setParamsErrTip] = useState({});
-  const [loading, setLoading] = useState(false);
-  const [createLoading, setCreateLoading] = useState(false);
-  const [release, setRelease] = useState(null);
-  const {
-    api,
-    ws: {
-      useSubscription
-    }
-  } = useNodeContext();
-  const uploaderLogoRef = useRef(null);
-  const uploaderScreenshotRef = useRef(null);
-  const [installResourceTip, setInstallResourceTip] = useState();
-  const [openConnect, setOpenConnect] = useState(false);
-  const [showStoreDialog, setShowStoreDialog] = useState(false);
-  const releaseId = inputReleaseId === 'create' ? '' : inputReleaseId;
-  const mode = inputReleaseId === 'create' ? 'create' : 'edit';
-  const projectType = useMemo(() => params?.blockletComponents?.some(x => x.included) ? 'pack' : 'resource', [params?.blockletComponents]);
-  const tabs = [];
-  const resourceComponents = (blocklet?.children || []).filter(x => x.meta.resource?.exportApi).filter(x => !componentDid || x.meta.did === componentDid);
-  resourceComponents.forEach(item => {
-    addComponentTabs({
-      tabs,
-      blocklet: item,
-      t,
-      ancestors: [blocklet]
-    });
-  });
-  const [tab, setTab] = useState(tabs[0]?.value);
-  const isPublished = release?.status === 'published';
-  const readOnly = isPublished;
-  const getProject = () => {
-    if (projectId === UNOWNED_DID) {
-      setParams({
-        blockletVersion: '1.0.0',
-        blockletTitle: ''
-      });
-      return;
-    }
-    if (!projectId) {
-      Toast.error(t('blocklet.publish.errorTip.noDid'));
-      return;
-    }
-    api.getProject({
-      input: {
-        did: blocklet.meta.did,
-        projectId
-      }
-    }).then(res => {
-      setLoading(false);
-      const data = res.project || {};
-      if (!data.blockletVersion) {
-        data.blockletVersion = '1.0.0';
-      } else if (mode === 'create' && semver.valid(data.blockletVersion)) {
-        data.blockletVersion = semver.inc(data.blockletVersion, 'patch');
-      }
-      const theParams = pickParams(data, blocklet);
-      if (theParams.blockletTitle === projectId.slice(0, 8)) {
-        theParams.blockletTitle = '';
-      }
-      setParams(theParams);
-    }).catch(err => {
-      setLoading(false);
-      Toast.error(formatError(err));
-    });
-  };
-  const getRelease = () => {
-    api.getRelease({
-      input: {
-        did: blocklet.meta.did,
-        projectId,
-        releaseId
-      }
-    }).then(res => {
-      setLoading(false);
-      // setParams(pickParams(res?.release, blocklet));
-      setRelease(res?.release);
-    }).catch(err => {
-      setLoading(false);
-      Toast.error(formatError(err));
-    });
-  };
-  const getData = useCallback(() => {
-    if (mode === 'edit') {
-      if (!releaseId) {
-        Toast.error('Empty release id');
-        return;
-      }
-      getRelease();
-    }
-    getProject();
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [mode, releaseId]);
-  const onRelease = status => {
-    if (!projectId || projectId === UNOWNED_DID) {
-      Toast.error(t('blocklet.publish.errorTip.noDid'));
-      return;
-    }
-    const errors = validateParams(params, status, t);
-    if (errors) {
-      Toast.error(errors.map(x => x.message).join('; '));
-      setParamsErrTip(errors.reduce((acc, x) => ({
-        ...acc,
-        [x.param]: x.message
-      }), {}));
-      return;
-    }
-    const _params = {
-      ...params
-    };
-    _params.blockletVersion = semver.valid(_params.blockletVersion);
-    if (!_params.blockletVersion) {
-      Toast.error('Invalid Blocklet Version');
-      setParamsErrTip({
-        blockletVersion: 'Invalid Blocklet Version'
-      });
-      return;
-    }
-    _params.blockletTitle = (_params.blockletTitle || '').trim();
-    _params.blockletDescription = (_params.blockletDescription || '').trim();
-    _params.blockletIntroduction = (_params.blockletIntroduction || '').trim();
-    _params.note = (_params.note || '').trim();
-    _params.blockletComponents = (_params.blockletComponents || []).filter(x => x.included).map(x => pick(x, ['did', 'required'])).map(JSON.stringify);
-    setCreateLoading(status);
-    setLoading(true);
-    api.createRelease({
-      input: {
-        ..._params,
-        did: blocklet.meta.did,
-        projectId,
-        releaseId,
-        status
-      }
-    }).then(res => {
-      setCreateLoading(false);
-      setLoading(false);
-      if (status === 'draft') {
-        Toast.success(t('blocklet.publish.saveDraftSuccess'));
-      } else {
-        Toast.success(t('blocklet.publish.createReleaseSuccess'));
-      }
-      if (mode === 'create') {
-        const id = res?.release?.id;
-        navigate(`../${projectId}/${id}`, {
-          replace: true
-        });
-      } else {
-        getRelease();
-      }
-    }).catch(err => {
-      setCreateLoading(false);
-      setLoading(false);
-      const msg = formatError(err);
-      Toast.error(msg);
-      if (/resource.*empty/.test(msg)) {
-        setParamsErrTip({
-          blockletResource: msg
-        });
-      }
-    });
-  };
-  const handleDidConnectShow = e => {
-    e.preventDefault();
-    e.stopPropagation();
-    if (!params.blockletTitle) {
-      setParamsErrTip({
-        blockletTitle: t('blocklet.publish.errorTip.noTitle')
-      });
-      Toast.error(t('blocklet.publish.errorTip.noTitle'));
-      return;
-    }
-    if (!projectId || projectId === UNOWNED_DID) {
-      setOpenConnect(true);
-    }
-  };
-  const handleDidConnectClose = () => {
-    setOpenConnect(false);
-  };
-  const handleChangeSelectedComponents = data => {
-    setParams({
-      blockletComponents: data
-    });
-  };
-  const handleCreateBlockletDidError = err => {
-    Toast.error(err.message);
-    setOpenConnect(false);
-  };
-  const handleCreate = nextProjectDid => {
-    if (!nextProjectDid) {
-      Toast.error(t('blocklet.publish.errorTip.noDid'));
-      return;
-    }
-    setLoading(true);
-    api.createProject({
-      input: {
-        did: blocklet.meta.did,
-        blockletTitle: params.blockletTitle || nextProjectDid.slice(0, 9),
-        blockletDid: nextProjectDid,
-        type: params.blockletComponents?.length > 0 ? 'pack' : 'resource',
-        componentDid
-      }
-    }).then(() => {
-      setLoading(false);
-      navigate(window.location.pathname.replace(`${UNOWNED_DID}/create`, `${nextProjectDid}/create`), {
-        replace: true
-      });
-    }).catch(err => {
-      setLoading(false);
-      Toast.error(err.message);
-    });
-  };
-  const handleCreateBlockletDidSuccess = result => {
-    const did = result?.blockletWallet?.address;
-    if (!did) {
-      Toast.error('Empty Blocklet DID');
-    } else {
-      handleCreate(did);
-    }
-    setOpenConnect(false);
-  };
-  useEffect(() => {
-    getData();
-  }, [getData]);
-  useSubscription(EVENTS.NOTIFICATION_BLOCKLET_CREATE, notification => {
-    if (notification?.meta?.eventType === STUDIO_CONNECTED_STORE) {
-      getData();
-    }
-  }, [getData]);
-  if (!params && loading) {
-    return /*#__PURE__*/_jsx(EmptySpinner, {});
-  }
-  if (!params) {
-    return null;
-  }
-  const connect = openConnect ? /*#__PURE__*/_jsx(DidConnect, {
-    open: true,
-    popup: true,
-    onClose: handleDidConnectClose,
-    action: "gen-blocklet-key-pair",
-    locale: locale,
-    checkFn: sessionApi.get,
-    saveConnect: false,
-    forceConnected: false,
-    checkTimeout: 5 * 60 * 1000,
-    onSuccess: handleCreateBlockletDidSuccess,
-    onError: handleCreateBlockletDidError,
-    extraParams: {
-      did: blocklet.meta.did
-    },
-    messages: {
-      title: t('blocklet.publish.connect.title'),
-      scan: t('blocklet.publish.connect.scan'),
-      confirm: t('blocklet.publish.connect.confirm'),
-      success: t('blocklet.publish.connect.success')
-    }
-  }) : null;
-  const uploadLogoPrefix = `${WELLKNOWN_SERVICE_PATH_PREFIX}/api/project/${blocklet.meta.did}/${projectId}/logo/upload`;
-  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 item = resourceComponents.find(x => x.meta.did === tab);
-  const resourceContent = item ? /*#__PURE__*/_jsx(Box, {
-    children: /*#__PURE__*/_jsx(Resource, {
-      error: paramsErrTip.blockletResource,
-      app: blocklet,
-      component: item,
-      projectId: projectId === UNOWNED_DID ? '' : projectId,
-      release: {
-        ...release,
-        id: releaseId
-      },
-      onSave: selected => {
-        if (selected.length) {
-          setParamsErrTip({
-            blockletResource: ''
-          });
-        }
-      }
-    })
-  }) : /*#__PURE__*/_jsx(Box, {
-    display: "flex",
-    mt: -3,
-    children: /*#__PURE__*/_jsx(Empty, {
-      children: t('common.empty')
-    })
-  });
-  const onTabChange = x => {
-    setTab(x);
-  };
-  let installButton = null;
-  if (isPublished && serverEndpoint) {
-    const blockletMetaUrl = joinUrl(serverEndpoint, `/api/project/${blocklet.meta.did}/${projectId}/${releaseId}/release/blocklet.json`);
-    if (projectType === 'pack') {
-      const url = new URL(serverEndpoint);
-      url.pathname = joinUrl(url.pathname, '/launch-blocklet/agreement');
-      url.searchParams.set('blocklet_meta_url', blockletMetaUrl);
-      installButton = /*#__PURE__*/_jsx(Button, {
-        variant: "outlined",
-        style: {
-          marginRight: 8
-        },
-        children: /*#__PURE__*/_jsx("a", {
-          href: url.href,
-          target: "_blank",
-          rel: "noreferrer",
-          children: t('common.install')
-        })
-      });
-    } else {
-      installButton = /*#__PURE__*/_jsxs(_Fragment, {
-        children: [/*#__PURE__*/_jsx(Button, {
-          variant: "outlined",
-          style: {
-            marginRight: 8
-          },
-          onClick: () => setInstallResourceTip(blockletMetaUrl),
-          children: t('blocklet.publish.copyInstallUrl')
-        }), /*#__PURE__*/_jsx(MaterialDialog, {
-          fullWidth: true,
-          maxWidth: "sm",
-          open: installResourceTip,
-          onClose: () => setInstallResourceTip(''),
-          children: /*#__PURE__*/_jsxs(Box, {
-            sx: {
-              py: 5,
-              px: 4,
-              wordBreak: 'break-all'
-            },
-            children: [/*#__PURE__*/_jsx(Typography, {
-              variant: "h6",
-              sx: {
-                mb: 2
-              },
-              children: t('blocklet.publish.installResourceTip')
-            }), /*#__PURE__*/_jsx(ClickToCopy, {
-              children: installResourceTip
-            }), /*#__PURE__*/_jsxs(Typography, {
-              sx: {
-                mt: 2
-              },
-              children: [t('blocklet.publish.installResourceTip2'), /*#__PURE__*/_jsx("a", {
-                style: {
-                  marginLeft: 4
-                },
-                href: "https://www.arcblock.io/docs/blocklet-developer/R3weqCy7WPI8ggudt0C2alWv",
-                target: "_blank",
-                rel: "noreferrer",
-                children: t('blocklet.publish.installResourceHelp')
-              })]
-            })]
-          })
-        })]
-      });
-    }
-  }
-  return /*#__PURE__*/_jsxs(Main, {
-    ...rest,
-    children: [connect, /*#__PURE__*/_jsxs(Box, {
-      className: "sticky-header",
-      children: [/*#__PURE__*/_jsxs(Breadcrumbs, {
-        className: "breadcrumbs",
-        "aria-label": "breadcrumb",
-        children: [/*#__PURE__*/_jsx(Link, {
-          to: "../",
-          children: t('common.blockletStudio')
-        }), /*#__PURE__*/_jsx(Link, {
-          to: `../${projectId}`,
-          children: params?.blockletTitle || 'Blocklet'
-        }), /*#__PURE__*/_jsx(Typography, {
-          color: "text.primary",
-          children: mode === 'create' ? t('common.create') : params?.blockletVersion || t('common.edit')
-        })]
-      }), /*#__PURE__*/_jsxs(Box, {
-        display: "flex",
-        children: [!isPublished && /*#__PURE__*/_jsxs(_Fragment, {
-          children: [/*#__PURE__*/_jsxs(Button, {
-            variant: "outlined",
-            disabled: loading || createLoading,
-            onClick: () => onRelease(PROJECT.RELEASE_STATUS.draft),
-            style: {
-              marginRight: 12
-            },
-            children: [createLoading === PROJECT.RELEASE_STATUS.draft && /*#__PURE__*/_jsx(Spinner, {
-              size: 14,
-              sx: {
-                mr: 0.5
-              }
-            }), t('blocklet.publish.saveDraft')]
-          }), /*#__PURE__*/_jsxs(Button, {
-            variant: "contained",
-            disabled: loading || createLoading,
-            style: {
-              marginRight: 12
-            },
-            onClick: () => onRelease(PROJECT.RELEASE_STATUS.published),
-            children: [createLoading === PROJECT.RELEASE_STATUS.published && /*#__PURE__*/_jsx(Spinner, {
-              size: 14,
-              sx: {
-                mr: 0.5
-              },
-              color: "inherit"
-            }), t('common.release')]
-          })]
-        }), isPublished && /*#__PURE__*/_jsxs(_Fragment, {
-          children: [installButton, /*#__PURE__*/_jsx(Button, {
-            variant: "outlined",
-            style: {
-              marginRight: 12
-            },
-            children: /*#__PURE__*/_jsx("a", {
-              href: joinUrl(`${WELLKNOWN_SERVICE_PATH_PREFIX}/api/project/${blocklet.meta.did}/${projectId}/${releaseId}/download/${(release.files || [])[0]}`),
-              children: t('common.download')
-            })
-          }), /*#__PURE__*/_jsxs(Button, {
-            variant: "contained",
-            onClick: () => setShowStoreDialog(true),
-            children: [/*#__PURE__*/_jsx(CloudUploadRoundedIcon, {
-              style: {
-                fontSize: '1.3em',
-                marginRight: 4
-              }
-            }), t('common.uploadToStore')]
-          })]
-        })]
-      })]
-    }), /*#__PURE__*/_jsxs(Box, {
-      children: [/*#__PURE__*/_jsx(Box, {
-        pt: 5
-      }), /*#__PURE__*/_jsxs(Box, {
-        display: "flex",
-        className: "section",
-        children: [/*#__PURE__*/_jsx(Typography, {
-          variant: "h3",
-          className: "left",
-          children: t('blocklet.publish.productTitle')
-        }), /*#__PURE__*/_jsxs(Box, {
-          sx: {
-            flex: 1
-          },
-          children: [/*#__PURE__*/_jsx(TextField, {
-            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: projectId !== UNOWNED_DID,
-            autoComplete: "off",
-            variant: "outlined",
-            onClick: handleDidConnectShow,
-            onInput: handleDidConnectShow,
-            InputProps: {
-              'data-cy': 'export-blocklet-did',
-              endAdornment: projectId === UNOWNED_DID && /*#__PURE__*/_jsx(InputAdornment, {
-                position: "end",
-                children: /*#__PURE__*/_jsx(Button, {
-                  onClick: handleDidConnectShow,
-                  children: t('common.create')
-                })
-              })
-            },
-            helperText: "",
-            value: projectId === UNOWNED_DID ? '' : projectId,
-            sx: {
-              mt: 3
-            }
-          }), /*#__PURE__*/_jsx(TextField, {
-            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__*/_jsx(TextField, {
-            label: `Blocklet ${t('common.introduction')}`,
-            placeholder: `Blocklet ${t('common.introduction')}`,
-            InputProps: {
-              'data-cy': 'export-blocklet-introduction',
-              readOnly,
-              endAdornment: /*#__PURE__*/_jsxs(InputAdornment, {
-                position: "end",
-                children: [params?.blockletIntroduction?.length || 0, " / ", PROJECT.MAX_INTRO_LENGTH]
-              })
-            },
-            autoComplete: "off",
-            variant: "outlined",
-            fullWidth: true,
-            multiline: true,
-            minRows: 4,
-            value: params.blockletIntroduction || '',
-            onChange: e => {
-              setParamsErrTip({
-                blockletIntroduction: ''
-              });
-              setParams({
-                blockletIntroduction: e.target.value.slice(0, PROJECT.MAX_INTRO_LENGTH)
-              });
-            },
-            error: !!paramsErrTip.blockletIntroduction,
-            helperText: paramsErrTip.blockletIntroduction || '',
-            sx: {
-              mt: 3
-            }
-          })]
-        })]
-      }), /*#__PURE__*/_jsxs(Box, {
-        display: "flex",
-        mt: 3,
-        className: "section",
-        children: [/*#__PURE__*/_jsx(Typography, {
-          variant: "h3",
-          className: "left",
-          children: t('blocklet.publish.versionTitle')
-        }), /*#__PURE__*/_jsxs(Box, {
-          sx: {
-            flex: 1
-          },
-          children: [/*#__PURE__*/_jsx(TextField, {
-            required: true,
-            label: `Blocklet ${t('common.version')}`,
-            placeholder: `Blocklet ${t('common.version')}`,
-            InputProps: {
-              'data-cy': 'blocklet-version',
-              readOnly
-            },
-            autoComplete: "off",
-            variant: "outlined",
-            fullWidth: true,
-            value: params.blockletVersion,
-            onChange: e => {
-              setParamsErrTip({
-                blockletVersion: ''
-              });
-              setParams({
-                blockletVersion: e.target.value
-              });
-            },
-            error: !!paramsErrTip.blockletVersion,
-            helperText: paramsErrTip.blockletVersion || ''
-          }), /*#__PURE__*/_jsx(TextField, {
-            label: t('blocklet.publish.releaseNote'),
-            autoComplete: "off",
-            variant: "outlined",
-            InputProps: {
-              'data-cy': 'release-note',
-              readOnly,
-              endAdornment: /*#__PURE__*/_jsxs(InputAdornment, {
-                position: "end",
-                children: [params?.note?.length || 0, " / ", PROJECT.MAX_NOTE_LENGTH]
-              })
-            },
-            fullWidth: true,
-            multiline: true,
-            minRows: 4,
-            required: true,
-            value: params.note,
-            onChange: e => {
-              setParamsErrTip({
-                note: ''
-              });
-              setParams({
-                note: e.target.value.slice(0, PROJECT.MAX_NOTE_LENGTH)
-              });
-            },
-            error: !!paramsErrTip.note,
-            helperText: paramsErrTip.note || '',
-            sx: {
-              mt: 3
-            }
-          })]
-        })]
-      }), /*#__PURE__*/_jsxs(Box, {
-        display: "flex",
-        mt: 3,
-        className: "section full-width",
-        children: [/*#__PURE__*/_jsx(Typography, {
-          variant: "h3",
-          className: "left",
-          children: t('blocklet.publish.imgTitle')
-        }), /*#__PURE__*/_jsxs(Box, {
-          sx: {
-            flex: 1
-          },
-          children: [/*#__PURE__*/_jsxs(Box, {
-            display: "flex",
-            children: [/*#__PURE__*/_jsx(Typography, {
-              variant: "subtitle1",
-              sx: {
-                mr: 2
-              },
-              children: t('common.logo')
-            }), /*#__PURE__*/_jsx(Box, {
-              sx: {
-                flex: 1,
-                cursor: readOnly ? 'default' : 'pointer'
-              },
-              children: /*#__PURE__*/_jsx(Avatar, {
-                variant: "square",
-                sx: {
-                  width: 80,
-                  height: 80
-                },
-                alt: "Blocklet Logo",
-                src: logoUrl,
-                onClick: () => !readOnly && uploaderLogoRef.current.open()
-              })
-            })]
-          }), /*#__PURE__*/_jsxs(Box, {
-            display: "flex",
-            mt: 3,
-            children: [/*#__PURE__*/_jsx(Typography, {
-              variant: "subtitle1",
-              sx: {
-                mr: 2
-              },
-              children: t('common.screenshot')
-            }), /*#__PURE__*/_jsxs(Box, {
-              display: "flex",
-              alignItems: "center",
-              sx: {
-                flex: 1,
-                flexWrap: 'wrap'
-              },
-              children: [screenshotUrls.map((x, index) => /*#__PURE__*/_jsxs(Box, {
-                className: "screenshot",
-                children: [/*#__PURE__*/_jsx("img", {
-                  alt: "screenshot",
-                  src: x
-                }), !readOnly && /*#__PURE__*/_jsx(IconButton, {
-                  className: "action",
-                  onClick: () => {
-                    const arr = [...params.blockletScreenshots];
-                    arr.splice(index, 1);
-                    setParams({
-                      blockletScreenshots: arr
-                    });
-                  },
-                  children: /*#__PURE__*/_jsx(DeleteOutlineIcon, {})
-                })]
-              })), screenshotUrls.length < 5 && /*#__PURE__*/_jsx(Box, {
-                sx: {
-                  width: 200,
-                  height: 140,
-                  background: '#eee',
-                  cursor: readOnly ? 'default' : 'pointer',
-                  color: '#999',
-                  mb: 2
-                },
-                display: "flex",
-                justifyContent: "center",
-                alignItems: "center",
-                fontSize: 40,
-                onClick: () => !readOnly && uploaderScreenshotRef.current.open(),
-                children: "+"
-              })]
-            })]
-          })]
-        }), /*#__PURE__*/_jsx(UploaderComponent, {
-          id: "\u200Buploader-logo",
-          ref: uploaderLogoRef,
-          popup: true,
-          onUploadFinish: result => {
-            setParams({
-              blockletLogo: result.data.filename
-            });
-            uploaderLogoRef.current.close();
-          },
-          plugins: ['ImageEditor'],
-          installerProps: {
-            disabled: true
-          },
-          apiPathProps: {
-            uploader: uploadLogoPrefix,
-            disableMediaKitPrefix: true
-          },
-          coreProps: {
-            restrictions: {
-              allowedFileTypes,
-              maxFileSize,
-              maxNumberOfFiles: 1
-            }
-          }
-        }, "uploader-logo"), /*#__PURE__*/_jsx(UploaderComponent, {
-          id: "\u200Buploader-screenshot",
-          ref: uploaderScreenshotRef,
-          popup: true,
-          onUploadFinish: result => {
-            const blockletScreenshots = params.blockletScreenshots || [];
-            blockletScreenshots.push(result.data?.filename);
-            setParams({
-              blockletScreenshots
-            });
-            uploaderScreenshotRef.current.close();
-          },
-          plugins: ['ImageEditor'],
-          apiPathProps: {
-            uploader: uploadScreenshotPrefix,
-            disableMediaKitPrefix: true
-          },
-          coreProps: {
-            restrictions: {
-              allowedFileTypes,
-              maxFileSize,
-              maxNumberOfFiles: 5 - screenshotUrls.length
-            }
-          }
-        }, "uploader-screenshot")]
-      }), /*#__PURE__*/_jsxs(Box, {
-        display: "flex",
-        mt: 3,
-        className: "section full-width",
-        children: [/*#__PURE__*/_jsx(Box, {
-          className: "left",
-          children: /*#__PURE__*/_jsx(Typography, {
-            variant: "h3",
-            children: t('blocklet.publish.resourceTitle')
-          })
-        }), /*#__PURE__*/_jsxs(Box, {
-          sx: {
-            flex: 1
-          },
-          children: [/*#__PURE__*/_jsx(Tabs, {
-            tabs: tabs,
-            current: tab,
-            onChange: onTabChange,
-            sx: {
-              ml: -2,
-              mt: -1.5
-            }
-          }), /*#__PURE__*/_jsx(Box, {
-            children: resourceContent
-          })]
-        })]
-      }), /*#__PURE__*/_jsxs(Box, {
-        display: "flex",
-        mt: 3,
-        className: "section full-width",
-        children: [/*#__PURE__*/_jsx(Box, {
-          className: "left",
-          children: /*#__PURE__*/_jsx(Typography, {
-            variant: "h3",
-            children: t('common.components')
-          })
-        }), /*#__PURE__*/_jsx(Box, {
-          sx: {
-            flex: 1
-          },
-          children: /*#__PURE__*/_jsx(SelectComponents, {
-            disabled: loading || readOnly,
-            app: blocklet,
-            value: params.blockletComponents || [],
-            onChange: handleChangeSelectedComponents
-          })
-        })]
-      }), /*#__PURE__*/_jsx(Alert, {
-        type: "info",
-        style: {
-          width: '100%'
-        },
-        children: /*#__PURE__*/_jsx(Box, {
-          display: "flex",
-          alignItems: "center",
-          rel: "noreferrer",
-          children: projectType === 'pack' ? t('blocklet.publish.packTip') : t('blocklet.publish.resourceTip')
-        })
-      })]
-    }), /*#__PURE__*/_jsx(Dialog, {
-      title: t('common.connectToStore'),
-      disableEscapeKeyDown: true,
-      disablePortal: false,
-      fullWidth: true,
-      open: showStoreDialog,
-      onClose: () => setShowStoreDialog(false),
-      children: /*#__PURE__*/_jsx(ConnectStoreList, {
-        projectType: projectType,
-        blocklet: blocklet,
-        releaseType: params.blockletComponents?.length > 0 ? 'pack' : 'resource',
-        projectId: projectId,
-        releaseId: releaseId,
-        onPublish: getRelease,
-        onDelete: getData,
-        connectedStores: params.connectedStores,
-        publishedStoreIds: release?.publishedStoreIds
-      })
-    })]
-  });
-}
-CreateRelease.defaultProps = {};
-const Main = styled.div`
-  .sticky-header {
-    margin-top: -12px;
-    padding: 12px 0;
-    position: sticky;
-    top: 0;
-    z-index: 99;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    background-color: #fff;
-    padding-bottom: 12px;
-    border-bottom: ${({
-  theme
-}) => `1px solid ${theme.palette.divider}`};
-  }
-  .screenshot {
-    margin-bottom: 16px;
-    max-width: 200px;
-    max-height: 140px;
-    width: 200px;
-    height: 140px;
-    overflow: hidden;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-color: #eee;
-    margin-right: 16px;
-    position: relative;
-    .action {
-      visibility: hidden;
-      position: absolute;
-      top: 0px;
-      right: 0px;
-      background-color: rgba(0, 0, 0, 0.2);
-      color: rgba(255, 255, 255, 0.8);
-    }
-    &:hover .action {
-      visibility: visible;
-    }
-  }
-  .screenshot img {
-    width: 100%; /* 图像宽度填充容器 */
-    height: auto; /* 图像高度自适应 */
-  }
-  .section {
-    max-width: 800px;
-    &.full-width {
-      max-width: 100%;
-    }
-    .MuiTypography-h3 {
-      font-size: 1.1rem;
-      font-weight: 700;
-    }
-    .left {
-      flex-shrink: 0;
-      width: 140px;
-    }
-    .MuiTabs-indicator {
-      display: none;
-    }
-    .MuiTypography-subtitle1 {
-      width: 120px;
-      font-weight: 700;
-      font-size: 1rem;
-      ${({
-  theme
-}) => theme.breakpoints.down('sm')} {
-        width: 80px;
-      }
-    }
-  }
-  .MuiButtonBase-root {
-    a {
-      color: inherit;
-    }
-  }
-  .MuiInputBase-multiline .MuiInputAdornment-positionEnd {
-    align-self: flex-end;
-    .MuiTypography-root {
-      font-size: 0.8rem;
-    }
-    font-size: 0.8rem;
-  }
-`;