@blocklet/launcher-workflow 1.5.67 → 1.5.68

package/lib/components/server-eula.js

@@ -21,6 +21,8 @@ var _CheckCircleOutlineRounded = _interopRequireDefault(require("@material-ui/ic
 
 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"));
@@ -39,7 +41,8 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function ServerEula(_ref) {
   let {
     onContinue,
-    nextDisabled
+    nextDisabled,
+    launching
   } = _ref;
   const [agreed, setAgreed] = (0, _useLocalStorage.default)('server-eula-checked', false);
   const [open, setOpen] = (0, _react.useState)(false);
@@ -75,7 +78,9 @@ function ServerEula(_ref) {
     variant: "contained",
     className: "next-button",
     onClick: onContinue
-  }, t('common.next'))), open && /*#__PURE__*/_react.default.createElement(_confirm.default, {
+  }, 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"
@@ -88,10 +93,12 @@ function ServerEula(_ref) {
 
 ServerEula.propTypes = {
   onContinue: _propTypes.default.func.isRequired,
-  nextDisabled: _propTypes.default.bool
+  nextDisabled: _propTypes.default.bool,
+  launching: _propTypes.default.bool
 };
 ServerEula.defaultProps = {
-  nextDisabled: false
+  nextDisabled: false,
+  launching: false
 };
 
 const Div = _styledComponents.default.div.withConfig({

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

@@ -19,7 +19,8 @@ module.exports = {
     redeem: 'Redeem',
     redirecting: 'Redirecting',
     cancel: 'Cancel',
-    confirm: 'Confirm'
+    confirm: 'Confirm',
+    launching: 'Launching'
   },
   plan: {
     title: 'Select Blocklet Server Plan',

package/lib/locales/zh.js

@@ -17,7 +17,8 @@ module.exports = {
     purchase: '购买',
     redirecting: '跳转中',
     cancel: '取消',
-    confirm: '同意'
+    confirm: '同意',
+    launching: '启动中'
   },
   plan: {
     title: '创建节点',

package/lib/prepare.js

@@ -11,6 +11,8 @@ var _reactRouterDom = require("react-router-dom");
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
+var _Toast = _interopRequireDefault(require("@arcblock/ux/lib/Toast"));
+
 var _Connect = _interopRequireDefault(require("@arcblock/did-connect/lib/Connect"));
 
 var _utils = require("@arcblock/did-connect/lib/utils");
@@ -33,6 +35,8 @@ 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,24 +224,25 @@ 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(_serverEula.default, {
     onContinue: handleLaunch,
-    nextDisabled: !name.trim() || !description.trim()
+    nextDisabled: !name.trim() || !description.trim() || launching,
+    launching: launching
   }))), /*#__PURE__*/_react.default.createElement(_Connect.default, {
     open: showLaunchInstanceDialog,
     popup: true,
@@ -223,11 +260,15 @@ 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('')
   }));
 }
 

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.67",
+  "version": "1.5.68",
   "description": "Purchase components for Launcher UI",
   "publishConfig": {
     "access": "public"
@@ -41,8 +41,8 @@
     "@arcblock/icons": "^1.16.49",
     "@arcblock/license": "^1.16.49",
     "@arcblock/ux": "^1.16.49",
-    "@blocklet/launcher-constant": "1.5.67",
-    "@blocklet/launcher-layout": "1.5.67",
+    "@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",
@@ -52,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",
@@ -68,5 +69,5 @@
     "babel-plugin-inline-react-svg": "^2.0.1",
     "babel-plugin-styled-components": "^1.10.7"
   },
-  "gitHead": "148ece1f7072a00dac0ef077e8e96b4460cc6381"
+  "gitHead": "70a65ca42b47efb86e93b8495ce6db35d4360cff"
 }