@blocklet/launcher-workflow 1.5.65 → 1.5.68

package/lib/components/confirm.js

@@ -0,0 +1,98 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = ConfirmDialog;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
+
+var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
+
+var _DialogActions = _interopRequireDefault(require("@material-ui/core/DialogActions"));
+
+var _DialogContent = _interopRequireDefault(require("@material-ui/core/DialogContent"));
+
+var _DialogContentText = _interopRequireDefault(require("@material-ui/core/DialogContentText"));
+
+var _DialogTitle = _interopRequireDefault(require("@material-ui/core/DialogTitle"));
+
+var _useTheme = _interopRequireDefault(require("@material-ui/core/styles/useTheme"));
+
+var _useMediaQuery = _interopRequireDefault(require("@material-ui/core/useMediaQuery"));
+
+var _locale = require("../contexts/locale");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function ConfirmDialog(_ref) {
+  let {
+    title,
+    description,
+    cancel,
+    confirm,
+    color,
+    params: initialParams,
+    onCancel,
+    onConfirm
+  } = _ref;
+  const {
+    t
+  } = (0, _react.useContext)(_locale.LocaleContext);
+  const [params, setParams] = (0, _react.useState)(initialParams);
+  const theme = (0, _useTheme.default)();
+  const isBreakpointsDownSm = (0, _useMediaQuery.default)(theme.breakpoints.down('sm'));
+
+  const onCallback = cb => {
+    if (typeof cb === 'function') {
+      cb(params);
+    }
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_Dialog.default, {
+    open: true,
+    fullScreen: isBreakpointsDownSm
+  }, /*#__PURE__*/_react.default.createElement(_DialogTitle.default, null, typeof title === 'function' ? title() : title), /*#__PURE__*/_react.default.createElement(_DialogContent.default, null, /*#__PURE__*/_react.default.createElement(_DialogContentText.default, null, typeof description === 'function' ? description(params, setParams) : description)), /*#__PURE__*/_react.default.createElement(_DialogActions.default, {
+    style: {
+      padding: '8px 24px 24px'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
+    onClick: () => onCallback(onCancel),
+    color: "default",
+    rounded: true
+  }, cancel || t('common.cancel')), /*#__PURE__*/_react.default.createElement(_Button.default, {
+    onClick: () => onCallback(onConfirm),
+    color: color,
+    variant: "outlined",
+    autoFocus: true,
+    rounded: true
+  }, confirm || t('common.confirm'))));
+}
+
+ConfirmDialog.propTypes = {
+  title: _propTypes.default.any.isRequired,
+  description: _propTypes.default.any.isRequired,
+  // can be a function that renders different content based on params
+  cancel: _propTypes.default.string,
+  color: _propTypes.default.string,
+  confirm: _propTypes.default.string,
+  params: _propTypes.default.object,
+  // This object holds states managed in the dialog
+  onCancel: _propTypes.default.func,
+  onConfirm: _propTypes.default.func.isRequired
+};
+ConfirmDialog.defaultProps = {
+  onCancel: () => {},
+  cancel: '',
+  confirm: '',
+  color: 'danger',
+  params: {}
+};

package/lib/components/instance-operation.js

@@ -9,12 +9,12 @@ var _react = _interopRequireWildcard(require("react"));
 
 var _reactRouterDom = require("react-router-dom");
 
-var _reactUse = require("react-use");
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _lodash = _interopRequireDefault(require("lodash.get"));
 
+var _useInterval = _interopRequireDefault(require("react-use/lib/useInterval"));
+
 var _lodash2 = _interopRequireDefault(require("lodash.throttle"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
@@ -121,7 +121,7 @@ function OperationPage(_ref) {
   };
 
   const poll = (0, _lodash2.default)(getInstanceStatus, 5000);
-  (0, _reactUse.useInterval)(poll, launchState.status === STATUS.launching && nftId ? 5000 : null);
+  (0, _useInterval.default)(poll, launchState.status === STATUS.launching && nftId ? 5000 : null);
   (0, _react.useEffect)(() => {
     if (!nftId) {
       return;

package/lib/components/server-eula.js

@@ -0,0 +1,107 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = ServerEula;
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _useLocalStorage = _interopRequireDefault(require("react-use/lib/useLocalStorage"));
+
+var _Checkbox = _interopRequireDefault(require("@material-ui/core/Checkbox"));
+
+var _CheckCircleRounded = _interopRequireDefault(require("@material-ui/icons/CheckCircleRounded"));
+
+var _CheckCircleOutlineRounded = _interopRequireDefault(require("@material-ui/icons/CheckCircleOutlineRounded"));
+
+var _FormLabel = _interopRequireDefault(require("@material-ui/core/FormLabel"));
+
+var _Spinner = _interopRequireDefault(require("@arcblock/ux/lib/Spinner"));
+
+var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
+
+var _server = _interopRequireDefault(require("@arcblock/license/lib/server"));
+
+var _locale = require("../contexts/locale");
+
+var _confirm = _interopRequireDefault(require("./confirm"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+/* eslint-disable react/jsx-wrap-multilines */
+function ServerEula(_ref) {
+  let {
+    onContinue,
+    nextDisabled,
+    launching
+  } = _ref;
+  const [agreed, setAgreed] = (0, _useLocalStorage.default)('server-eula-checked', false);
+  const [open, setOpen] = (0, _react.useState)(false);
+  const {
+    t
+  } = (0, _react.useContext)(_locale.LocaleContext);
+
+  const handleChecked = () => setAgreed(x => !x);
+
+  const handleOpen = () => setOpen(x => !x);
+
+  const handleCancel = () => setOpen(false);
+
+  const handleConfirm = () => {
+    setAgreed(true);
+    setOpen(false);
+  };
+
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Div, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "eula-checkbox"
+  }, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
+    checked: agreed,
+    onChange: handleChecked,
+    color: "primary",
+    checkedIcon: /*#__PURE__*/_react.default.createElement(_CheckCircleRounded.default, null),
+    icon: /*#__PURE__*/_react.default.createElement(_CheckCircleOutlineRounded.default, null)
+  }), /*#__PURE__*/_react.default.createElement(_FormLabel.default, {
+    className: "eula-trigger",
+    onClick: handleOpen
+  }, t('license.footer'))), /*#__PURE__*/_react.default.createElement(_Button.default, {
+    disabled: !agreed || nextDisabled,
+    color: "primary",
+    variant: "contained",
+    className: "next-button",
+    onClick: onContinue
+  }, launching ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Spinner.default, {
+    size: 14
+  }), t('common.launching')) : t('common.next'))), open && /*#__PURE__*/_react.default.createElement(_confirm.default, {
+    title: t('license.title'),
+    description: /*#__PURE__*/_react.default.createElement(_server.default, {
+      className: "eula-content"
+    }),
+    color: "primary",
+    onCancel: handleCancel,
+    onConfirm: handleConfirm
+  }));
+}
+
+ServerEula.propTypes = {
+  onContinue: _propTypes.default.func.isRequired,
+  nextDisabled: _propTypes.default.bool,
+  launching: _propTypes.default.bool
+};
+ServerEula.defaultProps = {
+  nextDisabled: false,
+  launching: false
+};
+
+const Div = _styledComponents.default.div.withConfig({
+  displayName: "server-eula__Div",
+  componentId: "sc-16uy00s-0"
+})(["width:90%;max-width:450px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;@media (max-width:", "px){flex-direction:column;}.eula-checkbox{display:flex;align-items:center;.eula-trigger{cursor:pointer;font-size:14px;&:hover{color:", ";}}}.next-button{width:120px;}"], props => props.theme.breakpoints.values.sm, props => props.theme.palette.primary.main);

package/lib/contexts/request.js

@@ -18,6 +18,8 @@ var _urlJoin = _interopRequireDefault(require("url-join"));
 
 var _session = require("./session");
 
+var _locale = require("./locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -44,6 +46,9 @@ function RequestProvider(_ref) {
   const {
     session
   } = (0, _session.useSessionContext)();
+  const {
+    locale
+  } = (0, _locale.useLocaleContext)();
 
   const privateRequest = _axios.default.create({
     baseURL
@@ -51,6 +56,12 @@ function RequestProvider(_ref) {
 
   privateRequest.interceptors.request.use(config => {
     config.url = (0, _urlJoin.default)('/api', config.url);
+
+    if (!config.params) {
+      config.params = {};
+    }
+
+    config.params.locale = locale;
     return config;
   });
   privateRequest.interceptors.response.use(response => response, err => {

package/lib/index.js

@@ -77,11 +77,11 @@ function Stripe(_ref2) {
   } = _ref2,
       rest = _objectWithoutProperties(_ref2, _excluded);
 
-  return /*#__PURE__*/_react.default.createElement(_request.RequestProvider, {
-    baseURL: baseURL
-  }, /*#__PURE__*/_react.default.createElement(_locale.LocaleProvider, {
+  return /*#__PURE__*/_react.default.createElement(_locale.LocaleProvider, {
     translations: _locales.translations,
     locale: locale
+  }, /*#__PURE__*/_react.default.createElement(_request.RequestProvider, {
+    baseURL: baseURL
   }, /*#__PURE__*/_react.default.createElement(_checkout.default, rest)));
 }
 
@@ -101,11 +101,11 @@ function Launcher(_ref3) {
     locale,
     baseURL
   } = _ref3;
-  return /*#__PURE__*/_react.default.createElement(_request.RequestProvider, {
-    baseURL: baseURL
-  }, /*#__PURE__*/_react.default.createElement(_locale.LocaleProvider, {
+  return /*#__PURE__*/_react.default.createElement(_locale.LocaleProvider, {
     translations: _locales.translations,
     locale: locale
+  }, /*#__PURE__*/_react.default.createElement(_request.RequestProvider, {
+    baseURL: baseURL
   }, /*#__PURE__*/_react.default.createElement(LaunchContent, {
     Route: Route,
     routerPrefix: routerPrefix,

package/lib/locales/en.js

@@ -17,11 +17,14 @@ module.exports = {
     next: 'Next',
     purchase: 'Purchase',
     redeem: 'Redeem',
-    redirecting: 'Redirecting'
+    redirecting: 'Redirecting',
+    cancel: 'Cancel',
+    confirm: 'Confirm',
+    launching: 'Launching'
   },
   plan: {
-    title: 'Select Blocklet Server Type',
-    subTitle: 'Please select payment method and Blocklet Server type',
+    title: 'Select Blocklet Server Plan',
+    subTitle: 'Select payment method and plan',
     loadListFailed: 'Plan list load error',
     paymentCredit: {
       status: {
@@ -35,9 +38,13 @@ module.exports = {
     useFiat: 'Credit Card',
     noPlan: 'No blocklet server available for purchase'
   },
+  license: {
+    title: 'End User License Agreement',
+    footer: 'I agree to the Blocklet Server EULA'
+  },
   prepare: {
     title: 'Naming Blocklet Server',
-    subTitle: 'Please enter the name and description of the Blocklet Server'
+    subTitle: 'Please enter server name and description, they will appear in your server passport'
   },
   launch: {
     title: 'Create Blocklet Server',
@@ -71,7 +78,7 @@ module.exports = {
   },
   redeem: {
     title: 'Redeem Blocklet Server',
-    subTitle: 'Name and describe the Blocklet Server you are going to redeem',
+    subTitle: 'Name the blocklet server you are going to redeem, the name will exist on server passport',
     dialog: {
       title: 'Redeem Blocklet Server',
       scan: 'Scan the QR code below with your DID wallet to complete redeem',

package/lib/locales/zh.js

@@ -12,10 +12,13 @@ module.exports = {
     description: '描述',
     retry: '重试',
     launch: '启动',
-    next: '下一步',
+    next: '继续',
     redeem: '兑换',
     purchase: '购买',
-    redirecting: '跳转中'
+    redirecting: '跳转中',
+    cancel: '取消',
+    confirm: '同意',
+    launching: '启动中'
   },
   plan: {
     title: '创建节点',
@@ -33,9 +36,13 @@ module.exports = {
     useFiat: '信用卡支付',
     noPlan: '没有可购买的节点类型'
   },
+  license: {
+    title: '节点用户协议',
+    footer: '我已经阅读并同意节点的用户协议'
+  },
   prepare: {
     title: '命名节点',
-    subTitle: '请输入要创建的节点名称和描述'
+    subTitle: '请输入要创建的节点名称和描述，它们将显示在您的节点通行证中'
   },
   launch: {
     title: '创建节点',
@@ -69,7 +76,7 @@ module.exports = {
   },
   redeem: {
     title: '启动节点',
-    subTitle: '为你的节点起个名字吧',
+    subTitle: '为你的节点起个名字吧，节点名字将会打印在节点通行证上',
     dialog: {
       title: '兑换节点',
       scan: '用您的 DID 钱包扫描下面的二维码，提供 NFT',

package/lib/prepare.js

@@ -11,7 +11,7 @@ var _reactRouterDom = require("react-router-dom");
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
-var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
+var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
 
 var _Connect = _interopRequireDefault(require("@arcblock/did-connect/lib/Connect"));
 
@@ -27,12 +27,16 @@ var _launcherConstant = require("@blocklet/launcher-constant");
 
 var _pageHeader = _interopRequireDefault(require("./components/page-header"));
 
+var _serverEula = _interopRequireDefault(require("./components/server-eula"));
+
 var _request = _interopRequireDefault(require("./contexts/request"));
 
 var _locale = require("./contexts/locale");
 
 var _router = _interopRequireWildcard(require("./contexts/router"));
 
+var _util = require("./util");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -80,8 +84,6 @@ BlockletServerIcon.defaultProps = {
   fill: "none",
   xmlns: "http://www.w3.org/2000/svg"
 };
-const MAX_NAME_LENGTH = 30;
-const MAX_DESC_LENGTH = 50;
 
 function PreparePage() {
   const {
@@ -89,18 +91,21 @@ function PreparePage() {
   } = (0, _react.useContext)(_locale.LocaleContext);
   const [name, setName] = (0, _react.useState)('');
   const [description, setDescription] = (0, _react.useState)('');
-  const [error, setError] = (0, _react.useState)({
+  const [formError, setFormError] = (0, _react.useState)({
     name: '',
     description: ''
   });
   const routerPrefix = (0, _router.usePrefix)();
+  const [launching, setLaunching] = (0, _react.useState)(false);
+  const [error, setError] = (0, _react.useState)('');
   const [showLaunchInstanceDialog, setShowLaunchInstanceDialog] = (0, _react.useState)(false);
   const {
     nftId
   } = (0, _reactRouterDom.useParams)();
   const history = (0, _reactRouterDom.useHistory)();
   const {
-    create: createRequest
+    create: createRequest,
+    api
   } = (0, _request.default)();
 
   const handleInput = id => e => {
@@ -115,31 +120,34 @@ function PreparePage() {
     validate();
   };
 
+  const isRedeem = nftId === _launcherConstant.REDEEM_NFT_ID;
+  const headerScope = isRedeem ? 'redeem' : 'prepare';
+
   const validate = () => {
     let isError = false;
 
-    if (name.length > MAX_NAME_LENGTH) {
+    if (name.length > _launcherConstant.INSTANCE_MAX_NAME_LENGTH) {
       isError = true;
-      setError(value => _objectSpread(_objectSpread({}, value), {}, {
-        name: t('launchPrepare.error.nameExceed', {
-          length: MAX_NAME_LENGTH
+      setFormError(value => _objectSpread(_objectSpread({}, value), {}, {
+        name: t('launchPrepare.formError.nameExceed', {
+          length: _launcherConstant.INSTANCE_MAX_NAME_LENGTH
         })
       }));
     } else {
-      setError(value => _objectSpread(_objectSpread({}, value), {}, {
+      setFormError(value => _objectSpread(_objectSpread({}, value), {}, {
         name: ''
       }));
     }
 
-    if (description.length > MAX_DESC_LENGTH) {
+    if (description.length > _launcherConstant.INSTANCE_MAX_DESC_LENGTH) {
       isError = true;
-      setError(value => _objectSpread(_objectSpread({}, value), {}, {
-        description: t('launchPrepare.error.descriptionExceed', {
-          length: MAX_DESC_LENGTH
+      setFormError(value => _objectSpread(_objectSpread({}, value), {}, {
+        description: t('launchPrepare.formError.descriptionExceed', {
+          length: _launcherConstant.INSTANCE_MAX_DESC_LENGTH
         })
       }));
     } else {
-      setError(value => _objectSpread(_objectSpread({}, value), {}, {
+      setFormError(value => _objectSpread(_objectSpread({}, value), {}, {
         description: ''
       }));
     }
@@ -147,12 +155,40 @@ function PreparePage() {
     return isError;
   };
 
-  const handleLaunch = () => {
+  const handleLaunch = async () => {
+    setLaunching(true);
+
     if (validate()) {
       return;
     }
 
-    setShowLaunchInstanceDialog(true);
+    if (isRedeem) {
+      setShowLaunchInstanceDialog(true);
+      return;
+    }
+
+    try {
+      const {
+        status
+      } = await api.post('/instances/launch', {
+        nftId,
+        name,
+        description
+      });
+
+      if (status !== 202) {
+        setError(t('launch.error.launchFailed'));
+        return;
+      }
+
+      handleAuthSuccess({
+        nftId
+      });
+    } catch (err) {
+      setError((0, _util.getAPIResponseError)(err));
+    } finally {
+      setLaunching(false);
+    }
   }; // eslint-disable-next-line no-shadow
 
 
@@ -163,11 +199,11 @@ function PreparePage() {
     history.push((0, _router.default)(routerPrefix, "/in-progress/".concat(nftId).concat(window.location.search)));
   };
 
-  const handleCloseAuthDialog = () => setShowLaunchInstanceDialog(false);
+  const handleCloseAuthDialog = () => {
+    setLaunching(false);
+    setShowLaunchInstanceDialog(false);
+  };
 
-  const isRedeem = nftId === _launcherConstant.REDEEM_NFT_ID;
-  const headerScope = isRedeem ? 'redeem' : 'prepare';
-  const buttonScope = isRedeem ? 'redeem' : 'launch';
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Container, null, /*#__PURE__*/_react.default.createElement(_pageHeader.default, {
     title: t("".concat(headerScope, ".title")),
     subTitle: t("".concat(headerScope, ".subTitle"))
@@ -179,7 +215,7 @@ function PreparePage() {
     className: "inputs"
   }, /*#__PURE__*/_react.default.createElement(_FormControl.default, {
     className: "input-item",
-    error: !!error.name
+    formError: !!formError.name
   }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
     id: "name",
     variant: "outlined",
@@ -188,31 +224,26 @@ function PreparePage() {
     value: name,
     labelWidth: 0,
     autoFocus: true
-  }), error.name && /*#__PURE__*/_react.default.createElement(_FormHelperText.default, null, error.name)), /*#__PURE__*/_react.default.createElement(_FormControl.default, {
+  }), formError.name && /*#__PURE__*/_react.default.createElement(_FormHelperText.default, null, formError.name)), /*#__PURE__*/_react.default.createElement(_FormControl.default, {
     className: "input-item",
-    error: !!error.description
+    formError: !!formError.description
   }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
     id: "description",
     variant: "outlined",
     label: t('common.description'),
-    error: !!error.desc,
+    formError: !!formError.desc,
     onChange: handleInput('description'),
     multiline: true,
     maxRows: 5,
     value: description,
     labelWidth: 0
-  }), error.description && /*#__PURE__*/_react.default.createElement(_FormHelperText.default, null, error.description)))), /*#__PURE__*/_react.default.createElement("div", {
+  }), formError.description && /*#__PURE__*/_react.default.createElement(_FormHelperText.default, null, formError.description)))), /*#__PURE__*/_react.default.createElement("div", {
     className: "botton-container"
-  }, /*#__PURE__*/_react.default.createElement(_Button.default, {
-    disabled: !name.trim() || !description.trim(),
-    style: {
-      width: 300
-    },
-    color: "primary",
-    variant: "contained",
-    rounded: true,
-    onClick: handleLaunch
-  }, t('common.next')))), /*#__PURE__*/_react.default.createElement(_Connect.default, {
+  }, /*#__PURE__*/_react.default.createElement(_serverEula.default, {
+    onContinue: handleLaunch,
+    nextDisabled: !name.trim() || !description.trim() || launching,
+    launching: launching
+  }))), /*#__PURE__*/_react.default.createElement(_Connect.default, {
     open: showLaunchInstanceDialog,
     popup: true,
     action: "launch-instance",
@@ -229,15 +260,19 @@ function PreparePage() {
     disableClose: true,
     showDownload: false,
     messages: {
-      title: t("".concat(buttonScope, ".dialog.title")),
-      scan: t("".concat(buttonScope, ".dialog.scan")),
-      confirm: t("".concat(buttonScope, ".dialog.confirm")),
-      success: t("".concat(buttonScope, ".dialog.success"))
+      title: t('redeem.dialog.title'),
+      scan: t('redeem.dialog.scan'),
+      confirm: t('redeem.dialog.confirm'),
+      success: t('redeem.dialog.success')
     }
+  }), error && /*#__PURE__*/_react.default.createElement(_Toast.default, {
+    message: error,
+    variant: "error",
+    onClose: () => setError('')
   }));
 }
 
 const Container = _styledComponents.default.div.withConfig({
   displayName: "prepare__Container",
   componentId: "sc-1ddofcz-0"
-})(["display:flex;flex-direction:column;width:100%;height:100%;.page-logo{display:flex;justify-content:center;margin-top:62px;", "{margin-top:48px;}}.inputs{display:flex;align-items:center;flex-direction:column;text-align:center;}.input-item{margin-top:24px;width:90%;max-width:343px;font-size:14px;input,textarea{font-size:14px;}}.botton-container{margin-top:24px;text-align:center;}"], props => props.theme.breakpoints.down('sm'));
+})(["display:flex;flex-direction:column;width:100%;height:100%;.page-logo{display:flex;justify-content:center;margin-top:62px;", "{margin-top:48px;}}.inputs{display:flex;align-items:center;flex-direction:column;text-align:center;}.input-item{margin-top:24px;width:90%;max-width:450px;font-size:14px;input,textarea{font-size:14px;}}.botton-container{margin-top:24px;text-align:center;}"], props => props.theme.breakpoints.down('sm'));

package/lib/purchase.js

@@ -15,6 +15,8 @@ var _lodash = _interopRequireDefault(require("lodash.get"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
+var _jsCookie = _interopRequireDefault(require("js-cookie"));
+
 var _Coins = require("@styled-icons/remix-fill/Coins");
 
 var _util = require("@ocap/util");
@@ -160,8 +162,12 @@ function PurchasePage() {
 
   const handlePaid = _ref => {
     let {
-      nftId
+      nftId,
+      launchToken
     } = _ref;
+
+    _jsCookie.default.set('launch-token', launchToken);
+
     const url = "/prepare/".concat(nftId).concat(window.location.search);
     history.push((0, _router.default)(routerPrefix, url));
   };

package/lib/util.js

@@ -3,11 +3,14 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.getAPIResponseError = void 0;
 exports.getBlockletMetaUrl = getBlockletMetaUrl;
 exports.loadURL = exports.getLaunchBlockletUrl = void 0;
 
 var _urlJoin = _interopRequireDefault(require("url-join"));
 
+var _lodash = _interopRequireDefault(require("lodash.get"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function getBlockletMetaUrl(registry, did) {
@@ -30,6 +33,10 @@ const getLaunchBlockletUrl = (serverUrl, blockletMetaUrl, locale) => {
 
 exports.getLaunchBlockletUrl = getLaunchBlockletUrl;
 
+const getAPIResponseError = error => (0, _lodash.default)(error, 'response.data.error', '') || error.message;
+
+exports.getAPIResponseError = getAPIResponseError;
+
 const loadURL = url => new Promise(resolve => {
   let timer;
   const iframe = document.createElement('iframe');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/launcher-workflow",
-  "version": "1.5.65",
+  "version": "1.5.68",
   "description": "Purchase components for Launcher UI",
   "publishConfig": {
     "access": "public"
@@ -39,9 +39,10 @@
   "dependencies": {
     "@arcblock/did-connect": "^1.16.49",
     "@arcblock/icons": "^1.16.49",
+    "@arcblock/license": "^1.16.49",
     "@arcblock/ux": "^1.16.49",
-    "@blocklet/launcher-constant": "1.5.65",
-    "@blocklet/launcher-layout": "1.5.65",
+    "@blocklet/launcher-constant": "1.5.68",
+    "@blocklet/launcher-layout": "1.5.68",
     "@material-ui/core": "^4.12.3",
     "@material-ui/icons": "^4.11.2",
     "@material-ui/lab": "^4.0.0-alpha.60",
@@ -51,6 +52,7 @@
     "@styled-icons/remix-fill": "^10.18.0",
     "axios": "^0.26.0",
     "flat": "^5.0.2",
+    "js-cookie": "^3.0.1",
     "lodash.get": "^4.4.2",
     "lodash.throttle": "^4.1.1",
     "prop-types": "^15.8.1",
@@ -67,5 +69,5 @@
     "babel-plugin-inline-react-svg": "^2.0.1",
     "babel-plugin-styled-components": "^1.10.7"
   },
-  "gitHead": "f0d418d80249fc4d18fe2fd8481bd64a1010d4f4"
+  "gitHead": "70a65ca42b47efb86e93b8495ce6db35d4360cff"
 }