@blocklet/launcher-workflow 2.3.80 → 2.3.82

package/lib/purchase.js

@@ -1,603 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _Button = _interopRequireDefault(require("@arcblock/ux/lib/Button"));
-var _Center = _interopRequireDefault(require("@arcblock/ux/lib/Center"));
-var _useConnect = _interopRequireDefault(require("@arcblock/did-connect/lib/Connect/use-connect"));
-var _compactLayout = _interopRequireDefault(require("@blocklet/launcher-layout/lib/compact-layout"));
-var _constant = require("@blocklet/launcher-util/es/constant");
-var _useMobile = _interopRequireDefault(require("@blocklet/launcher-ux/lib/use-mobile"));
-var _styled = _interopRequireDefault(require("@emotion/styled"));
-var _CircularProgress = _interopRequireDefault(require("@mui/material/CircularProgress"));
-var _Tooltip = _interopRequireDefault(require("@mui/material/Tooltip"));
-var _reactSplide = require("@splidejs/react-splide");
-var _splideExtensionGrid = require("@splidejs/splide-extension-grid");
-var _lodash = _interopRequireDefault(require("lodash.get"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactRouterDom = require("react-router-dom");
-var _useMeasure = _interopRequireDefault(require("react-use/lib/useMeasure"));
-var _useSetState = _interopRequireDefault(require("react-use/lib/useSetState"));
-var _urlJoin = _interopRequireDefault(require("url-join"));
-var _constant2 = require("@arcblock/did-connect/lib/constant");
-var _launchResultMessage = _interopRequireDefault(require("@blocklet/launcher-layout/lib/launch-result-message"));
-var _formatError = _interopRequireDefault(require("@blocklet/launcher-util/es/format-error"));
-var _useBrowser = _interopRequireDefault(require("@arcblock/react-hooks/lib/useBrowser"));
-require("@splidejs/splide/dist/css/splide.min.css");
-var _inProgressSession = _interopRequireDefault(require("./components/in-progress-session"));
-var _layout = _interopRequireDefault(require("./components/layout"));
-var _body = _interopRequireDefault(require("./components/layout/body"));
-var _footer = _interopRequireDefault(require("./components/layout/footer"));
-var _header = _interopRequireDefault(require("./components/layout/header"));
-var _plan = _interopRequireDefault(require("./components/plan"));
-var _locale = require("./contexts/locale");
-var _request = _interopRequireDefault(require("./contexts/request"));
-var _session = require("./contexts/session");
-var _workflow = require("./contexts/workflow");
-var _util = require("./util");
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-/* eslint-disable react-hooks/exhaustive-deps */
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _taggedTemplateLiteral(e, t) { return t || (t = e.slice(0)), Object.freeze(Object.defineProperties(e, { raw: { value: Object.freeze(t) } })); }
-var NextIcon = function NextIcon(props) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", _objectSpread(_objectSpread({}, props), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: "m15.5.932-4.3 4.38 14.5 14.6-14.5 14.5 4.3 4.4 14.6-14.6 4.4-4.3-4.4-4.4L15.5.912z"
-    })
-  }));
-};
-NextIcon.defaultProps = {
-  xmlns: "http://www.w3.org/2000/svg",
-  width: "40",
-  height: "40"
-};
-var PrevIcon = function PrevIcon(props) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)("svg", _objectSpread(_objectSpread({}, props), {}, {
-    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("path", {
-      d: "m15.5.932-4.3 4.38 14.5 14.6-14.5 14.5 4.3 4.4 14.6-14.6 4.4-4.3-4.4-4.4L15.5.912z"
-    })
-  }));
-};
-PrevIcon.defaultProps = {
-  xmlns: "http://www.w3.org/2000/svg",
-  width: "40",
-  height: "40"
-};
-const SLIDE_WIDTH = 300;
-const SLIDE_MIN_WIDTH = 280;
-const getSlideConfig = (maxLength, planLength) => {
-  const factor = Math.min(maxLength, planLength);
-  const width = factor < 3 ? SLIDE_MIN_WIDTH : SLIDE_WIDTH;
-  return {
-    perPage: factor,
-    width: "".concat(factor * width, "px"),
-    gap: '24px'
-  };
-};
-function PurchasePage(_ref) {
-  var _state$plans3;
-  let {
-    disableBack
-  } = _ref;
-  const {
-    t,
-    locale
-  } = (0, _locale.useLocaleContext)();
-  const {
-    create,
-    api: launchSessionAPI,
-    baseURL
-  } = (0, _request.default)();
-  const {
-    isMobile
-  } = (0, _useMobile.default)();
-  const navigate = (0, _reactRouterDom.useNavigate)();
-  const {
-    session,
-    storage,
-    events
-  } = (0, _session.useSessionContext)();
-  const {
-    connectApi,
-    connectHolder
-  } = (0, _useConnect.default)();
-  const [params, setParams] = (0, _reactRouterDom.useSearchParams)();
-  const {
-    routerPrefix,
-    embed,
-    didPayPrefix,
-    isPurchaseOnly
-  } = (0, _workflow.useWorkflowContext)();
-  const [planListRef, {
-    width
-  }] = (0, _useMeasure.default)();
-  const [state, setState] = (0, _useSetState.default)({
-    loading: true,
-    error: '',
-    plans: [],
-    paymentMethods: [],
-    paymentMethod: params.get('paymentMethod'),
-    sessionId: params.get('sessionId'),
-    planId: params.get('planId'),
-    showMorePrompt: false,
-    arrows: false,
-    perPage: 100,
-    width: "".concat(SLIDE_WIDTH, "px"),
-    gap: '16px'
-  });
-  const api = create({
-    baseURL: didPayPrefix
-  });
-  const browser = (0, _useBrowser.default)();
-  const selectPlan = launch => {
-    if (!state.plans.length) {
-      return;
-    }
-    if (launch && launch.planId && state.plans.find(x => x._id === launch.planId)) {
-      setState({
-        planId: launch.planId
-      });
-    }
-    const recommended = state.plans.find(x => !!x.isRecommended);
-    if (recommended) {
-      setState({
-        planId: recommended._id
-      });
-    } else {
-      setState({
-        planId: state.plans[0]._id
-      });
-    }
-  };
-
-  // 用户退出的时候自动重新创建启动会话
-  (0, _react.useEffect)(() => {
-    if (isPurchaseOnly) {
-      return;
-    }
-    events.on('logout', () => {
-      const metaUrl = params.get('blocklet_meta_url');
-      _util.launchSession.create(launchSessionAPI, routerPrefix, metaUrl, (err, launch) => {
-        setState({
-          sessionId: launch._id
-        });
-        selectPlan(launch);
-      });
-    });
-  }, []);
-
-  // 创建启动会话或者加载现有的会话
-  (0, _react.useEffect)(() => {
-    Promise.all([api.get('/plans'), api.get('/payment-methods')]).then(_ref2 => {
-      let [{
-        data
-      }, {
-        data: {
-          data: paymentMethods
-        }
-      }] = _ref2;
-      if (data.length === 0 || paymentMethods.length === 0) {
-        setState({
-          loading: false,
-          error: t('purchase.noProducts')
-        });
-        return;
-      }
-      let plans = (data || []).sort((a, b) => b.weight - a.weight);
-      const {
-        components = []
-      } = (0, _lodash.default)(window, 'blockletMeta', {}) || {};
-      const supported = components.every(x => (0, _lodash.default)(x, 'meta.capabilities.serverless', true));
-      plans.forEach(x => {
-        if ((0, _lodash.default)(x, 'extra.type') === 'serverless' && !supported) {
-          x.available = false;
-          x.reason = t('purchase.serverlessNotSupported');
-        } else {
-          x.available = true;
-        }
-      });
-      plans = plans.sort((a, b) => {
-        if (b.available && !a.available) {
-          return 1;
-        }
-        if (!b.available && a.available) {
-          return -1;
-        }
-        return 0;
-      });
-      setState({
-        plans,
-        paymentMethods,
-        paymentMethod: paymentMethods[0]._id,
-        loading: false
-      });
-      if (isPurchaseOnly) {
-        selectPlan();
-        return;
-      }
-      const metaUrl = params.get('blocklet_meta_url');
-      if (params.get('sessionId')) {
-        _util.launchSession.load(launchSessionAPI, routerPrefix, params.get('sessionId'), metaUrl, (err, launch) => {
-          selectPlan(launch);
-        });
-      } else if (metaUrl) {
-        _util.launchSession.create(launchSessionAPI, routerPrefix, metaUrl, (err, launch) => {
-          setState({
-            sessionId: launch._id
-          });
-          selectPlan(launch);
-        });
-      }
-    }).catch(err => {
-      setState({
-        error: (0, _formatError.default)(err)
-      });
-    });
-  }, []);
-  (0, _react.useEffect)(() => {
-    if (!state.sessionId) {
-      return;
-    }
-    if (state.sessionId !== params.get('sessionId')) {
-      params.set('sessionId', state.sessionId);
-      setParams(params, {
-        replace: true
-      });
-    }
-  }, [state.sessionId]);
-  (0, _react.useEffect)(() => {
-    var _state$plans;
-    if (!((_state$plans = state.plans) !== null && _state$plans !== void 0 && _state$plans.length) || typeof state.perPage === 'undefined') {
-      return;
-    }
-    const index = state.plans.findIndex(x => !!x.isRecommended && x.available);
-    const pageIndex = Math.floor(index / state.perPage);
-
-    // 如果推荐 Plan 不在第一页，则将推荐 Plan 放在第一个
-    if (pageIndex >= 1) {
-      const recommend = state.plans[index];
-      const copy = [...state.plans];
-      copy.splice(index, 1);
-      copy.unshift(recommend);
-      setState({
-        plans: copy
-      });
-    }
-  }, [state.perPage, state.plans]);
-  (0, _react.useEffect)(() => {
-    var _state$plans2;
-    if (!((_state$plans2 = state.plans) !== null && _state$plans2 !== void 0 && _state$plans2.length)) {
-      return;
-    }
-    if (Number.isNaN(width)) {
-      return;
-    }
-
-    // 最小得有1个
-    const tmp = Math.max(Math.floor(width / SLIDE_WIDTH) - 1, 1);
-    setState(getSlideConfig(tmp, state.plans.length));
-  }, [width, state.plans, isMobile]);
-  const handleSelect = planId => {
-    var _state$plans$find;
-    if (state.planId === planId) {
-      return;
-    }
-    if (((_state$plans$find = state.plans.find(x => x._id === planId)) === null || _state$plans$find === void 0 ? void 0 : _state$plans$find.available) === false) {
-      return;
-    }
-    setState({
-      planId
-    });
-  };
-  (0, _react.useEffect)(() => {
-    if (!state.planId) {
-      return;
-    }
-    if (state.planId !== params.get('planId')) {
-      params.set('planId', state.planId);
-      setParams(params, {
-        replace: true
-      });
-    }
-  }, [state.planId]);
-  (0, _react.useEffect)(() => {
-    if (!state.paymentMethod) {
-      return;
-    }
-    if (state.paymentMethod !== params.get('paymentMethod')) {
-      params.set('paymentMethod', state.paymentMethod);
-      setParams(params, {
-        replace: true
-      });
-    }
-  }, [state.paymentMethod]);
-  (0, _react.useEffect)(() => {
-    if (isPurchaseOnly) {
-      return;
-    }
-    if (!state.planId || !state.sessionId) {
-      return;
-    }
-    const plan = state.plans.find(x => x._id === state.planId);
-    const type = (0, _lodash.default)(plan, 'extra.type') || 'serverless';
-    _util.launchSession.select(launchSessionAPI, routerPrefix, state.sessionId, type, state.planId);
-  }, [state.planId, state.sessionId]);
-  const productFeatures = [];
-  if (!state.loading && ((_state$plans3 = state.plans) === null || _state$plans3 === void 0 ? void 0 : _state$plans3.length) > 0) {
-    // TODO: Pricing Table: 临时做法
-    try {
-      const {
-        features
-      } = state.plans[0];
-      if (features && features.length > 0) {
-        const tmp = JSON.parse(features[0].en);
-        tmp.forEach(item => {
-          productFeatures.push({
-            _id: item.featureId,
-            name: item.name,
-            type: item.type
-          });
-        });
-      }
-    } catch (error) {
-      console.error('parse product feature failed:', error);
-    }
-  }
-  const ensureLogin = () => {
-    return new Promise(resolve => {
-      if (!session.user) {
-        session.login(() => {
-          resolve();
-        });
-      } else {
-        resolve();
-      }
-    });
-  };
-  const handleRedeem = () => {
-    if (browser.wallet) {
-      // HACK: 钱包客户端中因为打开浏览器 Tab 的限制，所以在钱包客户端浏览器中使用 “登录 -> 兑换（购买）" 两步的流程
-      ensureLogin().then(() => {
-        var _session$user;
-        connectApi.open({
-          useSocket: false,
-          locale,
-          action: 'redeem',
-          prefix: "".concat(window.location.origin).concat((0, _urlJoin.default)(baseURL || '', _constant2.API_DID_PREFIX)),
-          onSuccess: handleRedeemed,
-          checkTimeout: 60 * 5000,
-          showDownload: false,
-          extraParams: {
-            planId: state.planId || state.plans[0]._id,
-            sessionId: state.sessionId,
-            forceSwitch: !(session !== null && session !== void 0 && session.user),
-            // HACK: 在 openPopup 阶段需要手动添加 sourceAppPid 字段
-            sourceAppPid: session === null || session === void 0 || (_session$user = session.user) === null || _session$user === void 0 ? void 0 : _session$user.sourceAppPid,
-            provider: 'wallet'
-          },
-          messages: {
-            title: t('redeem.dialog.title'),
-            scan: t('redeem.dialog.scan'),
-            confirm: t('redeem.dialog.confirm'),
-            success: t('redeem.dialog.success')
-          }
-        }, {
-          locale
-        });
-      });
-    } else {
-      var _session$user2;
-      connectApi.openPopup({
-        useSocket: false,
-        locale,
-        action: 'redeem',
-        prefix: "".concat(window.location.origin).concat((0, _urlJoin.default)(baseURL || '', _constant2.API_DID_PREFIX)),
-        onSuccess: handleRedeemed,
-        checkTimeout: 60 * 5000,
-        showDownload: false,
-        extraParams: {
-          planId: state.planId || state.plans[0]._id,
-          sessionId: state.sessionId,
-          forceSwitch: !(session !== null && session !== void 0 && session.user),
-          // HACK: 在 openPopup 阶段需要手动添加 sourceAppPid 字段
-          sourceAppPid: session === null || session === void 0 || (_session$user2 = session.user) === null || _session$user2 === void 0 ? void 0 : _session$user2.sourceAppPid,
-          provider: 'wallet'
-        },
-        messages: {
-          title: t('redeem.dialog.title'),
-          scan: t('redeem.dialog.scan'),
-          confirm: t('redeem.dialog.confirm'),
-          success: t('redeem.dialog.success')
-        },
-        baseUrl: window.location.origin
-      }, {
-        locale
-      });
-    }
-  };
-  const handleRedeemed = _ref3 => {
-    let {
-      sessionToken,
-      nftId,
-      type,
-      sessionId
-    } = _ref3;
-    if (type === _constant.NFT_TYPE_SERVERLESS) {
-      params.set('launchType', 'serverless');
-    }
-    if (sessionToken) {
-      storage.setToken(sessionToken);
-      session.refresh();
-    }
-    if (sessionId) {
-      params.set('sessionId', sessionId);
-    }
-    navigate({
-      pathname: (0, _urlJoin.default)(routerPrefix, "/launch/".concat(nftId)),
-      search: params.toString()
-    });
-  };
-  const plan = state.planId && state.plans ? state.plans.find(x => x._id === state.planId) : null;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Container, {
-    embed: embed,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_header.default, {
-      title: t('purchase.pageTitle'),
-      disableBack: disableBack
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_body.default, {
-      style: {
-        justifyContent: 'center'
-      },
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        style: {
-          flex: 1,
-          position: 'relative'
-        },
-        children: [state.error && /*#__PURE__*/(0, _jsxRuntime.jsx)(_launchResultMessage.default, {
-          variant: "error",
-          title: t('common.error'),
-          subTitle: state.error
-        }), !state.error && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: "container-inner",
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_compactLayout.default, {
-            bottom: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_footer.default, {
-              className: "footer",
-              children: [embed && isPurchaseOnly === false && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-                className: "footer-left",
-                children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
-                  onClick: handleRedeem,
-                  className: "redeem-button",
-                  variant: "outlined",
-                  children: t('purchase.redeem')
-                }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactRouterDom.Link, {
-                  className: "select-space",
-                  to: (0, _urlJoin.default)(routerPrefix, "/purchase/select".concat(window.location.search)),
-                  children: t('purchase.selectSpaceHint')
-                })]
-              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Button.default, {
-                component: _reactRouterDom.Link,
-                disabled: state.loading || !state.planId,
-                to: (0, _urlJoin.default)(routerPrefix, "/purchase/checkout?".concat(params.toString())),
-                className: "button-next",
-                variant: "contained",
-                children: plan ? t('purchase.hasPlan', {
-                  name: plan.name[locale]
-                }) : t('purchase.noPlan')
-              })]
-            }),
-            children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-              ref: planListRef,
-              className: "plan-list",
-              children: state.loading ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_Center.default, {
-                relative: "parent",
-                children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {})
-              }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-                children: [!isMobile && /*#__PURE__*/(0, _jsxRuntime.jsx)(_plan.default, {
-                  toc: true,
-                  productFeatures: productFeatures,
-                  paymentMethods: state.paymentMethods,
-                  paymentMethod: state.paymentMethod,
-                  onChangeMethod: paymentMethod => setState({
-                    paymentMethod
-                  }),
-                  className: "toc"
-                }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactSplide.Splide, {
-                  extensions: {
-                    Grid: _splideExtensionGrid.Grid
-                  },
-                  onPaginationMounted: splide => {
-                    const pageCount = Math.ceil(state.plans.length / splide.options.perPage);
-                    const showArrows = pageCount > 1;
-                    setState({
-                      arrows: showArrows
-                    });
-                    if (showArrows) {
-                      setTimeout(() => {
-                        setState({
-                          showMorePrompt: true
-                        });
-                        // 3s 后隐藏
-                        setTimeout(() => setState({
-                          showMorePrompt: false
-                        }), 3000);
-                      }, 1000);
-                    }
-                  },
-                  hasTrack: false,
-                  options: {
-                    rewind: true,
-                    pagination: true,
-                    arrows: state.arrows,
-                    classes: {
-                      pagination: 'splide__pagination splide__pagination-custom'
-                    },
-                    trimSpace: true,
-                    width: state.width,
-                    perPage: state.perPage,
-                    gap: state.gap
-                  },
-                  children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-                    className: "splide__arrows",
-                    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-                      className: "splide__arrow splide__arrow--prev",
-                      type: "button",
-                      disabled: "",
-                      "aria-label": "Previous slide",
-                      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(PrevIcon, {
-                        viewBox: "0 0 40 40"
-                      })
-                    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Tooltip.default, {
-                      open: state.showMorePrompt,
-                      title: t('purchase.morePlanPrompt'),
-                      placement: "top",
-                      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
-                        className: "splide__arrow splide__arrow--next",
-                        type: "button",
-                        "aria-label": "Next slide",
-                        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(NextIcon, {
-                          viewBox: "0 0 40 40"
-                        })
-                      })
-                    })]
-                  }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSplide.SplideTrack, {
-                    children: state.plans.map(x => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactSplide.SplideSlide, {
-                      style: {
-                        width: 'auto'
-                      },
-                      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_plan.default, {
-                        recommend: !!x.isRecommended,
-                        checked: x._id === state.planId,
-                        plan: x,
-                        paymentMethod: state.paymentMethod,
-                        paymentMethods: state.paymentMethods,
-                        onClick: () => handleSelect(x._id)
-                      })
-                    }, x._id))
-                  })]
-                })]
-              })
-            })
-          })
-        })]
-      })
-    }), session.user && /*#__PURE__*/(0, _jsxRuntime.jsx)(_inProgressSession.default, {}), connectHolder]
-  });
-}
-const Container = (0, _styled.default)(_layout.default)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  .container-inner {\n    position: absolute;\n    left: 0;\n    top: 0;\n    width: 100%;\n    height: 100%;\n  }\n\n  .plan-list {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n\n    @media (min-width: 900px) {\n      margin-top: 20px;\n    }\n\n    @media (min-width: 680px) and (max-width: 899px) {\n      justify-content: center;\n    }\n\n    .toc {\n      min-width: 180px;\n      margin-right: 20px;\n    }\n\n    button.splide__pagination__page.is-active {\n      background: #9397a1;\n    }\n  }\n\n  .splide__pagination-custom {\n    bottom: -24px;\n  }\n\n  .footer {\n    display: flex;\n    justify-content: ", ";\n    align-item: center;\n    margin-top: auto;\n    padding-top: 16px;\n    padding-bottom: ", ";\n\n    > * {\n      margin: 0 8px;\n      ", " {\n        margin: 0 16px;\n      }\n    }\n\n    @media (max-width: ", "px) {\n      flex-direction: column;\n      align-items: center;\n    }\n\n    .footer-left {\n      display: flex;\n      gap: 16px;\n      align-items: center;\n      justify-content: space-between;\n\n      .select-space {\n        order: 1;\n        color: #000;\n\n        &:hover {\n          text-decoration: underline !important;\n        }\n      }\n\n      .redeem-button {\n        order: 1;\n      }\n\n      @media (max-width: ", "px) {\n        width: 100%;\n        flex-direction: column;\n\n        .redeem-button {\n          width: 100%;\n          order: 2;\n        }\n      }\n    }\n\n    .button-next {\n      min-width: 200px;\n\n      @media (max-width: ", "px) {\n        width: 100%;\n        margin-top: 20px;\n      }\n    }\n  }\n"])), props => props.embed ? 'space-between' : 'flex-end', props => props.embed ? '0' : '16px', props => props.theme.breakpoints.up('md'), props => props.theme.breakpoints.values.sm, props => props.theme.breakpoints.values.sm, props => props.theme.breakpoints.values.sm);
-PurchasePage.propTypes = {
-  disableBack: _propTypes.default.bool
-};
-PurchasePage.defaultProps = {
-  disableBack: false
-};
-var _default = exports.default = PurchasePage;