@blocklet/launcher-workflow 1.5.18 → 1.5.19

package/lib/locales/en.js

@@ -16,7 +16,7 @@ module.exports = {
   },
   plan: {
     title: 'Select Blocklet Server Type',
-    subTitle: 'Please select Blocklet Server type and payment method',
+    subTitle: 'Please select payment method and Blocklet Server type',
     loadListFailed: 'Plan list load error',
     paymentCredit: {
       status: {
@@ -27,7 +27,8 @@ module.exports = {
       }
     },
     useCrypto: 'Use ABT',
-    useFiat: 'Use Credit Card'
+    useFiat: 'Use Credit Card',
+    noPlan: 'No blocklet server available for purchase'
   },
   prepare: {
     title: 'Naming Blocklet Server',

package/lib/locales/zh.js

@@ -16,7 +16,7 @@ module.exports = {
   },
   plan: {
     title: '创建节点',
-    subTitle: '请选择节点类型和支付方式',
+    subTitle: '请选择支付方式和节点型号',
     loadListFailed: '加载节点类型列表出错',
     paymentCredit: {
       status: {
@@ -27,7 +27,8 @@ module.exports = {
       }
     },
     useCrypto: 'ABT 支付',
-    useFiat: '信用卡支付'
+    useFiat: '信用卡支付',
+    noPlan: '没有可购买的节点类型'
   },
   prepare: {
     title: '命名节点',

package/lib/prepare.js

@@ -202,7 +202,7 @@ function PreparePage() {
     value: description,
     labelWidth: 0
   }), error.description && /*#__PURE__*/_react.default.createElement(_FormHelperText.default, null, error.description)))), /*#__PURE__*/_react.default.createElement("div", {
-    className: "page-footer"
+    className: "botton-container"
   }, /*#__PURE__*/_react.default.createElement(_Button.default, {
     disabled: !name.trim() || !description.trim(),
     style: {
@@ -240,4 +240,4 @@ function PreparePage() {
 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:80px;}.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;}}@media (max-width:640px){.page-footer{margin-top:auto;}}"]);
+})(["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'));

package/lib/purchase.js

@@ -29,9 +29,11 @@ var _compactLayout = _interopRequireDefault(require("@blocklet/launcher-layout/l
 
 var _Alert = _interopRequireDefault(require("@material-ui/lab/Alert"));
 
-var _plan = _interopRequireDefault(require("./components/plan"));
+var _Empty = _interopRequireDefault(require("@arcblock/ux/lib/Empty"));
+
+var _Tabs = _interopRequireDefault(require("@arcblock/ux/lib/Tabs"));
 
-var _paymentType = _interopRequireDefault(require("./components/payment-type"));
+var _plan = _interopRequireDefault(require("./components/plan"));
 
 var _pageHeader = _interopRequireDefault(require("./components/page-header"));
 
@@ -87,9 +89,11 @@ function PurchasePage() {
 
   }, [paymentType, userDid]);
   const paymentTypes = [{
-    name: 'crypto'
+    label: t('plan.useCrypto'),
+    value: 'crypto'
   }, {
-    name: 'fiat'
+    label: t('plan.useFiat'),
+    value: 'fiat'
   }];
   const plansState = (0, _reactUse.useAsync)(async () => {
     const {
@@ -149,10 +153,6 @@ function PurchasePage() {
     setPaying(false);
   };
 
-  const selectPaymentType = value => {
-    setPaymentType(value);
-  };
-
   const selectPlan = value => {
     setPlan(value);
   };
@@ -244,39 +244,29 @@ function PurchasePage() {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "page-body-article"
   }, /*#__PURE__*/_react.default.createElement(_compactLayout.default, {
-    bottom: /*#__PURE__*/_react.default.createElement("div", {
+    bottom: plans.length ? /*#__PURE__*/_react.default.createElement("div", {
       className: "button-container"
-    }, /*#__PURE__*/_react.default.createElement(PayButton, null), /*#__PURE__*/_react.default.createElement(RedeemButton, null))
+    }, /*#__PURE__*/_react.default.createElement(PayButton, null), /*#__PURE__*/_react.default.createElement(RedeemButton, null)) : ''
   }, !isEmbed && /*#__PURE__*/_react.default.createElement(_pageHeader.default, {
     title: t('plan.title'),
     subTitle: t('plan.subTitle')
-  }), /*#__PURE__*/_react.default.createElement("div", {
+  }), plans.length ? /*#__PURE__*/_react.default.createElement("div", {
     className: "select-payment"
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "select-title"
-  }, t('common.paymentMethod')), /*#__PURE__*/_react.default.createElement("div", {
-    className: "select-row",
-    style: {
-      flexWrap: 'nowrap'
-    }
-  }, paymentTypes.map(item => /*#__PURE__*/_react.default.createElement(_paymentType.default, {
-    key: item.name,
-    className: "".concat(paymentType === item.name ? 'selected' : ''),
-    type: item.name,
-    onClick: () => selectPaymentType(item.name)
-  })))), /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement(_Tabs.default, {
+    tabs: paymentTypes,
+    current: paymentType,
+    onChange: e => setPaymentType(e)
+  })) : '', /*#__PURE__*/_react.default.createElement("div", {
     className: "select-plan small-select-plan-".concat(plans.length)
   }, /*#__PURE__*/_react.default.createElement("div", {
-    className: "select-title"
-  }, t('common.serverType')), /*#__PURE__*/_react.default.createElement("div", {
     className: "selector-container"
-  }, plans.map(item => /*#__PURE__*/_react.default.createElement(_plan.default, {
+  }, plans.length ? plans.map(item => /*#__PURE__*/_react.default.createElement(_plan.default, {
     key: item._id,
     paymentType: paymentType,
     onClick: () => selectPlan(item),
     className: "select-body-item ".concat(plan && plan._id === item._id ? 'selected' : ''),
     data: item
-  }))))))), /*#__PURE__*/_react.default.createElement(_Connect.default, {
+  })) : /*#__PURE__*/_react.default.createElement(_Empty.default, null, t('plan.noPlan'))))))), /*#__PURE__*/_react.default.createElement(_Connect.default, {
     open: paying && paymentType === 'crypto',
     popup: true,
     action: "purchase",
@@ -288,10 +278,10 @@ function PurchasePage() {
     webWalletUrl: (0, _utils.getWebWalletUrl)(),
     showDownload: false,
     messages: {
-      title: t('purchase.dialog.title'),
-      scan: t('purchase.dialog.scan'),
-      confirm: t('purchase.dialog.confirm'),
-      success: t('purchase.dialog.success')
+      title: t('launch.dialog.title'),
+      scan: t('launch.dialog.scan'),
+      confirm: t('launch.dialog.confirm'),
+      success: t('launch.dialog.success')
     }
   }), paymentInfo && /*#__PURE__*/_react.default.createElement(_checkout.default, {
     clientSecret: paymentInfo.clientSecret,
@@ -310,7 +300,7 @@ const Center = _styledComponents.default.div.withConfig({
 const Container = _styledComponents.default.div.withConfig({
   displayName: "purchase__Container",
   componentId: "sc-1knmtel-1"
-})(["display:flex;flex-direction:column;width:100%;height:100%;.select-payment{padding-top:40px;}.select-plan{margin:40px auto 0;&.small-select-plan-2{max-width:780px;}&.small-select-plan-1{max-width:460px;}}.select-title{text-align:center;font-size:16px;color:", ";}.page-body{position:relative;flex:1;padding:0 24px;margin-top:0;}.page-body-article{position:absolute;left:24px;top:0;width:calc(100% - 48px);height:100%;overflow-y:auto;}.select-row{display:flex;margin-top:18px;justify-content:center;flex-wrap:wrap;> div{margin-left:12px;margin-right:12px;}}.selector-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-top:18px;}.button-container{display:flex;justify-content:center;align-items:center;margin-top:24px;padding-bottom:16px;> button{width:200px;}}.select-body-item{cursor:pointer;transition:background-color ease 0.2s,border ease 0.2s;}@media screen and (max-width:600px){.select-title{text-align:left;}.select-row{flex-direction:column;> div{margin-bottom:24px;margin-right:0;margin-left:0;&:last-child{margin-bottom:0;}}}.page-body{padding:0 24px;}}.selected{border-color:", ";cursor:default;}"], props => props.theme.palette.grey[900], props => props.theme.palette.primary.main);
+})(["display:flex;flex-direction:column;width:100%;height:100%;.select-payment{display:flex;justify-content:center;align-items:center;padding-top:30px;}.select-plan{margin:48px auto;", "{margin:30px auto;}&.small-select-plan-2{max-width:780px;}&.small-select-plan-0,&.small-select-plan-1{max-width:460px;}}.page-body{position:relative;flex:1;padding:0 24px;margin-top:0;}.page-body-article{position:absolute;left:24px;top:0;width:calc(100% - 48px);height:100%;overflow-y:auto;}.selector-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;margin-top:18px;}.button-container{display:flex;justify-content:center;align-items:center;padding-bottom:16px;> button{width:200px;}}.select-body-item{cursor:pointer;transition:background-color ease 0.2s,border ease 0.2s;}@media screen and (max-width:600px){.page-body{padding:0 24px;}}.selected{border-color:", ";cursor:default;}"], props => props.theme.breakpoints.down('sm'), props => props.theme.palette.primary.main);
 
 var _default = (0, _reactRouterDom.withRouter)(PurchasePage);
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/launcher-workflow",
-  "version": "1.5.18",
+  "version": "1.5.19",
   "description": "Purchase components for Launcher UI",
   "publishConfig": {
     "access": "public"
@@ -39,7 +39,7 @@
   "dependencies": {
     "@arcblock/did-connect": "^1.16.30",
     "@arcblock/ux": "^1.16.30",
-    "@blocklet/launcher-layout": "1.5.18",
+    "@blocklet/launcher-layout": "1.5.19",
     "@material-ui/core": "^4.12.3",
     "@material-ui/icons": "^4.11.2",
     "@material-ui/lab": "^4.0.0-alpha.60",
@@ -64,5 +64,5 @@
     "babel-plugin-inline-react-svg": "^2.0.1",
     "babel-plugin-styled-components": "^1.10.7"
   },
-  "gitHead": "1c63d57795a0ce4bcb10e4fe756a0ed28d6fc8bb"
+  "gitHead": "1e84e32e17c49b8502f89cfc68aa5f4023afec54"
 }