@hulkapps/app-manager-vue 2.1.1 → 2.1.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -40011,7 +40011,8 @@ var PSkeletonPage = __vue_component__$4;var script$2 = {
40011
40011
  PCardSection: PCardSection,
40012
40012
  PSkeletonPage: PSkeletonPage,
40013
40013
  PSkeletonBodyText: PSkeletonBodyText,
40014
- PSkeletonDisplayText: PSkeletonDisplayText
40014
+ PSkeletonDisplayText: PSkeletonDisplayText,
40015
+ PEmptyState: PEmptyState
40015
40016
  },
40016
40017
  props: ['shop_domain'],
40017
40018
  data: function data() {
@@ -40023,6 +40024,8 @@ var PSkeletonPage = __vue_component__$4;var script$2 = {
40023
40024
  shopify_plan: '',
40024
40025
  default_plan_id: null,
40025
40026
  onboard: true,
40027
+ choose_later: false,
40028
+ planLoading: false,
40026
40029
  subtitleContent: '',
40027
40030
  checkList: ["60 days free trial"],
40028
40031
  selectedPlan: 'monthly',
@@ -40110,7 +40113,7 @@ var PSkeletonPage = __vue_component__$4;var script$2 = {
40110
40113
  } : {}];
40111
40114
  },
40112
40115
  isCurrentPlan: function isCurrentPlan(plan) {
40113
- return this.shop.plan && (plan.id === this.shop.plan.id || !plan.is_custom && plan.base_plan === this.shop.plan.id);
40116
+ return !this.choose_later && this.shop.plan && (plan.id === this.shop.plan.id || !plan.is_custom && plan.base_plan === this.shop.plan.id);
40114
40117
  },
40115
40118
  isSamePlanInOtherInterval: function isSamePlanInOtherInterval(plan) {
40116
40119
  return this.shop.plan && plan.shopify_plans === this.shop.plan.shopify_plans;
@@ -40135,6 +40138,26 @@ var PSkeletonPage = __vue_component__$4;var script$2 = {
40135
40138
  return plan.price - plan.discount;
40136
40139
  }
40137
40140
  },
40141
+ headerClasses: function headerClasses(firstColumn) {
40142
+ return {
40143
+ 'Polaris-DataTable__Cell': true,
40144
+ 'Polaris-DataTable__Cell--header': true,
40145
+ 'Polaris-DataTable__Cell--verticalAlignMiddle': true,
40146
+ 'Polaris-DataTable__Cell--firstColumn': Boolean(firstColumn)
40147
+ };
40148
+ },
40149
+ groupBy: function groupBy(objectArray, property) {
40150
+ return objectArray.reduce(function (acc, obj) {
40151
+ var key = obj[property];
40152
+
40153
+ if (!acc[key]) {
40154
+ acc[key] = [];
40155
+ }
40156
+
40157
+ acc[key].push(obj);
40158
+ return acc;
40159
+ }, {});
40160
+ },
40138
40161
  getPlanUrl: function getPlanUrl(plan) {
40139
40162
  var _this = this;
40140
40163
 
@@ -40243,93 +40266,126 @@ var PSkeletonPage = __vue_component__$4;var script$2 = {
40243
40266
  }, _callee4);
40244
40267
  }))();
40245
40268
  },
40246
- headerClasses: function headerClasses(firstColumn) {
40247
- return {
40248
- 'Polaris-DataTable__Cell': true,
40249
- 'Polaris-DataTable__Cell--header': true,
40250
- 'Polaris-DataTable__Cell--verticalAlignMiddle': true,
40251
- 'Polaris-DataTable__Cell--firstColumn': Boolean(firstColumn)
40252
- };
40269
+ fetchFeatures: function fetchFeatures() {
40270
+ var _this5 = this;
40271
+
40272
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
40273
+ var _yield$axios$get$catc, data, _this5$features, _this5$features2, _this5$features3;
40274
+
40275
+ return regeneratorRuntime.wrap(function _callee5$(_context5) {
40276
+ while (1) {
40277
+ switch (_context5.prev = _context5.next) {
40278
+ case 0:
40279
+ _context5.next = 2;
40280
+ return axios.get("".concat(_this5.app_manager_config.baseUrl, "/api/app-manager/plan-features")).catch(function (error) {
40281
+ console.error(error);
40282
+ });
40283
+
40284
+ case 2:
40285
+ _yield$axios$get$catc = _context5.sent;
40286
+ data = _yield$axios$get$catc.data;
40287
+
40288
+ if (data.features.length) {
40289
+ _this5.features = data.features;
40290
+ _this5.features = (_this5$features = _this5.features) === null || _this5$features === void 0 ? void 0 : _this5$features.filter(function (item) {
40291
+ return item.hidden_feature !== true;
40292
+ });
40293
+ _this5.features = (_this5$features2 = _this5.features) === null || _this5$features2 === void 0 ? void 0 : _this5$features2.sort(function (featureA, featureB) {
40294
+ return parseInt(featureA.display_order) - parseInt(featureB.display_order);
40295
+ });
40296
+ _this5.features = (_this5$features3 = _this5.features) === null || _this5$features3 === void 0 ? void 0 : _this5$features3.sort(function (featureA, featureB) {
40297
+ return parseInt(featureA.group_order) - parseInt(featureB.group_order);
40298
+ });
40299
+ _this5.featuresByGroup = _this5.groupBy(_this5.features, 'group');
40300
+ }
40301
+
40302
+ case 5:
40303
+ case "end":
40304
+ return _context5.stop();
40305
+ }
40306
+ }
40307
+ }, _callee5);
40308
+ }))();
40253
40309
  },
40254
- groupBy: function groupBy(objectArray, property) {
40255
- return objectArray.reduce(function (acc, obj) {
40256
- var key = obj[property];
40310
+ fetchPlans: function fetchPlans() {
40311
+ var _this6 = this;
40257
40312
 
40258
- if (!acc[key]) {
40259
- acc[key] = [];
40260
- } // Add object to list for given key's value
40313
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee6() {
40314
+ var _yield$axios$get$catc2, data, _this6$plans, _this6$plan;
40261
40315
 
40316
+ return regeneratorRuntime.wrap(function _callee6$(_context6) {
40317
+ while (1) {
40318
+ switch (_context6.prev = _context6.next) {
40319
+ case 0:
40320
+ _context6.next = 2;
40321
+ return axios.get("".concat(_this6.app_manager_config.baseUrl, "/api/app-manager/plans"), {
40322
+ params: {
40323
+ 'shop_domain': _this6.shop_domain
40324
+ }
40325
+ }).catch(function (error) {
40326
+ console.error(error);
40327
+ });
40262
40328
 
40263
- acc[key].push(obj);
40264
- return acc;
40265
- }, {});
40266
- }
40267
- },
40268
- mounted: function mounted() {
40269
- var _this5 = this;
40329
+ case 2:
40330
+ _yield$axios$get$catc2 = _context6.sent;
40331
+ data = _yield$axios$get$catc2.data;
40270
40332
 
40271
- return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
40272
- var _this5$plan;
40333
+ if (data.plans.length) {
40334
+ _this6.plans = data.plans;
40335
+ _this6.plans = (_this6$plans = _this6.plans) === null || _this6$plans === void 0 ? void 0 : _this6$plans.sort(function (planA, planB) {
40336
+ return parseFloat(planA.price) - parseFloat(planB.price);
40337
+ });
40273
40338
 
40274
- var featuresData, plansData;
40275
- return regeneratorRuntime.wrap(function _callee5$(_context5) {
40276
- while (1) {
40277
- switch (_context5.prev = _context5.next) {
40278
- case 0:
40279
- _context5.next = 2;
40280
- return axios.get("".concat(_this5.app_manager_config.baseUrl, "/api/app-manager/plan-features")).catch(function (error) {
40281
- console.error(error);
40282
- });
40339
+ if (_this6.plans[0].store_base_plan) {
40340
+ _this6.subtitleContent = 'App plans are based on your existing shopify plan';
40341
+ }
40283
40342
 
40284
- case 2:
40285
- featuresData = _context5.sent;
40286
- _this5.features = featuresData.data.features;
40287
- _this5.features = _this5.features.filter(function (item) {
40288
- return item.hidden_feature !== true;
40289
- });
40290
- _this5.features = _this5.features.sort(function (featureA, featureB) {
40291
- return parseInt(featureA.display_order) - parseInt(featureB.display_order);
40292
- });
40293
- _this5.features = _this5.features.sort(function (featureA, featureB) {
40294
- return parseInt(featureA.group_order) - parseInt(featureB.group_order);
40295
- });
40296
- _this5.featuresByGroup = _this5.groupBy(_this5.features, 'group');
40297
- _context5.next = 10;
40298
- return axios.get("".concat(_this5.app_manager_config.baseUrl, "/api/app-manager/plans"), {
40299
- params: {
40300
- 'shop_domain': _this5.shop_domain
40301
- }
40302
- }).catch(function (error) {
40303
- console.error(error);
40304
- });
40343
+ _this6.plan = data.plan;
40305
40344
 
40306
- case 10:
40307
- plansData = _context5.sent;
40308
- _this5.plans = plansData.data.plans;
40309
- _this5.plans = _this5.plans.sort(function (planA, planB) {
40310
- return parseFloat(planA.price) - parseFloat(planB.price);
40311
- });
40345
+ if (((_this6$plan = _this6.plan) === null || _this6$plan === void 0 ? void 0 : _this6$plan.interval) === 'ANNUAL') {
40346
+ _this6.selectedPlan = 'annually';
40347
+ }
40312
40348
 
40313
- if (_this5.plans && _this5.plans[0].store_base_plan) {
40314
- _this5.subtitleContent = 'App plans are based on your existing shopify plan';
40315
- }
40349
+ _this6.shopify_plan = data.shopify_plan;
40350
+ _this6.default_plan_id = data.default_plan_id;
40351
+ _this6.onboard = !_this6.plan;
40352
+ _this6.choose_later = data.choose_later;
40353
+ }
40316
40354
 
40317
- _this5.shopify_plan = plansData.data.shopify_plan;
40318
- _this5.plan = plansData.data.plan;
40355
+ case 5:
40356
+ case "end":
40357
+ return _context6.stop();
40358
+ }
40359
+ }
40360
+ }, _callee6);
40361
+ }))();
40362
+ }
40363
+ },
40364
+ mounted: function mounted() {
40365
+ var _this7 = this;
40319
40366
 
40320
- if (((_this5$plan = _this5.plan) === null || _this5$plan === void 0 ? void 0 : _this5$plan.interval) === 'ANNUAL') {
40321
- _this5.selectedPlan = 'annually';
40322
- }
40367
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee7() {
40368
+ return regeneratorRuntime.wrap(function _callee7$(_context7) {
40369
+ while (1) {
40370
+ switch (_context7.prev = _context7.next) {
40371
+ case 0:
40372
+ _this7.planLoading = true;
40373
+ _context7.next = 3;
40374
+ return _this7.fetchFeatures();
40323
40375
 
40324
- _this5.default_plan_id = plansData.data.default_plan_id;
40325
- _this5.onboard = !_this5.plan;
40376
+ case 3:
40377
+ _context7.next = 5;
40378
+ return _this7.fetchPlans();
40326
40379
 
40327
- case 19:
40380
+ case 5:
40381
+ _this7.planLoading = false;
40382
+
40383
+ case 6:
40328
40384
  case "end":
40329
- return _context5.stop();
40385
+ return _context7.stop();
40330
40386
  }
40331
40387
  }
40332
- }, _callee5);
40388
+ }, _callee7);
40333
40389
  }))();
40334
40390
  }
40335
40391
  };/* script */
@@ -40343,9 +40399,9 @@ var __vue_render__$2 = function __vue_render__() {
40343
40399
 
40344
40400
  var _c = _vm._self._c || _h;
40345
40401
 
40346
- return !_vm.plans.length ? _c('PSkeletonPage', {
40402
+ return _vm.planLoading ? _c('PSkeletonPage', {
40347
40403
  attrs: {
40348
- "title": "Skeleton Page",
40404
+ "title": "Plans",
40349
40405
  "fullWidth": false,
40350
40406
  "primaryAction": "",
40351
40407
  "secondaryActions": 2,
@@ -40407,7 +40463,12 @@ var __vue_render__$2 = function __vue_render__() {
40407
40463
  attrs: {
40408
40464
  "sectioned": ""
40409
40465
  }
40410
- }, [_c('PSkeletonBodyText')], 1)], 1)], 1)], 1) : _c('PPage', {
40466
+ }, [_c('PSkeletonBodyText')], 1)], 1)], 1)], 1) : !this.planLoading && this.plans.length === 0 ? _c('PEmptyState', {
40467
+ attrs: {
40468
+ "heading": "No Plans",
40469
+ "image": "https://cdn.shopify.com/s/files/1/0262/4071/2726/files/emptystate-files.png"
40470
+ }
40471
+ }) : _c('PPage', {
40411
40472
  staticClass: "app-manager-plan-page custom-title",
40412
40473
  attrs: {
40413
40474
  "title": "Choose plan",
@@ -40698,7 +40759,7 @@ var __vue_render__$2 = function __vue_render__() {
40698
40759
  on: {
40699
40760
  "click": _vm.activePlan
40700
40761
  }
40701
- }, [_vm._v(_vm._s('I will choose the plan later'))])], 1)], 1) : _vm._e()], 2), _vm._v(" "), _c('PlanBanners')], 1)], 1);
40762
+ }, [_vm._v(_vm._s('I will choose the plan later'))])], 1)], 1) : _vm._e(), _vm._v(" "), _c('PlanBanners')], 2)], 1)], 1);
40702
40763
  };
40703
40764
 
40704
40765
  var __vue_staticRenderFns__$2 = [];
@@ -40706,7 +40767,7 @@ var __vue_staticRenderFns__$2 = [];
40706
40767
 
40707
40768
  var __vue_inject_styles__$2 = function __vue_inject_styles__(inject) {
40708
40769
  if (!inject) return;
40709
- inject("data-v-45a1de2b_0", {
40770
+ inject("data-v-c6c44804_0", {
40710
40771
  source: "@import url(https://fonts.googleapis.com/css2?family=Satisfy&display=swap);.app-manager .app-manager-plan-page .plan-table td:last-child>[data-v-5a078dbb],.app-manager .app-manager-plan-page .plan-table td:last-child>[data-v-7d902277]{float:none}.app-manager .app-manager-plan-page .active{background:#f0f8f5}.app-manager .app-manager-plan-page .plan-table td:last-child>[data-v-0d1b0d63]{float:none}.app-manager .app-manager-plan-page .plan-table td{border:.01px solid #ececee!important;border-collapse:collapse!important}.app-manager .app-manager-plan-page .plan-table .Polaris-DataTable__ScrollContainer{border-radius:12px;overflow:visible}.app-manager .app-manager-plan-page .plan-table table{border-collapse:collapse!important}.app-manager .app-manager-plan-page .custom-plan table{border-collapse:collapse!important}.app-manager .app-manager-plan-page .custom-plan table thead .first-column{border-radius:12px 0 0 0;border-top:0!important;border-left:0!important}.app-manager .app-manager-plan-page .custom-plan table thead .plan-heading.last-column{text-align:left!important;border-radius:0 12px 0 0;border-top:0!important}.app-manager .app-manager-plan-page .custom-plan table thead .plan-heading{background-color:#fff;box-shadow:rgba(23,24,24,.05) 1px 0 8px,rgba(0,0,0,.15) 0 0 2px}.app-manager .app-manager-plan-page .custom-plan table tbody tr:first-child{background-color:#fff;box-shadow:0 0 5px rgba(23,24,24,.05),0 1px 2px rgba(0,0,0,.15);border-radius:12px 0 0 0;overflow:hidden}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:first-child:last-child){background-color:#fff;overflow:hidden}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:first-child:last-child){background-color:#fff;box-shadow:0 0 5px rgba(23,24,24,.05),0 1px 2px rgba(0,0,0,.15);overflow:hidden}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:nth-last-child(2)){background-color:#fff;overflow:hidden}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:nth-last-child(2)){border-bottom:0}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child{border-bottom:0;background-color:transparent!important;box-shadow:none!important}.app-manager .app-manager-plan-page .custom-plan table tbody tr:not(:last-child){pointer-events:none}.app-manager .app-manager-plan-page .custom-plan table thead tr td{pointer-events:none}.app-manager .app-manager-plan-page .custom-plan table tbody tr:first-child td:first-child{overflow:hidden;border-radius:12px 0 0 0}.app-manager .app-manager-plan-page .custom-plan table tbody tr:nth-last-child(2){overflow:hidden;border-bottom-right-radius:12px;border-bottom-left-radius:12px}.app-manager .app-manager-plan-page .custom-plan table tbody tr:nth-last-child(2) td:first-child{overflow:hidden;border-bottom:0!important;border-radius:0 0 0 12px}.app-manager .app-manager-plan-page .custom-plan table tbody tr:nth-last-child(2) td:last-child{overflow:hidden;border-radius:0 0 12px}.app-manager .app-manager-plan-page .custom-plan table tbody tr td:first-child{border-left:0!important;border-top:0!important;padding-left:20px}.app-manager .app-manager-plan-page .custom-plan table tbody tr td:last-child{border-right:0!important;border-bottom:0!important;text-align:center!important}.app-manager .app-manager-plan-page .custom-plan table thead tr td:last-child{border-right:0!important;border-bottom:0!important;text-align:center!important}.app-manager .app-manager-plan-page .custom-plan table tbody td:not(:first-child){text-align:center!important}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child td:last-child{background:0 0;border-radius:0 0 12px 0}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child td{border:0!important;background:0 0}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child td:hover{border:0!important;background:0 0}.app-manager .app-manager-plan-page .custom-plan tbody tr:last-child td.Polaris-DataTable__Cell--verticalAlignTop{background:0 0!important}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child{background:0 0;opacity:1}.app-manager .app-manager-plan-page .custom-plan table tbody tr:last-child td:first-child{visibility:hidden}.app-manager .app-manager-plan-page .plan-heading{padding-top:30px}.app-manager .app-manager-plan-page .custom-plan .Polaris-Layout__Section{max-width:calc(100% - 2rem)!important}.app-manager .app-manager-plan-page .later-link{text-align:center;clear:both;padding-top:15px}.app-manager .app-manager-plan-page .plan-badge ul{text-align:center;padding-top:2rem;border-top:.1rem solid #e1e3e5}.app-manager .app-manager-plan-page .plan-badge ul li{list-style:none;display:inline-block;padding-right:25px}.app-manager .app-manager-plan-page .plan-badge ul li img{max-width:133px}.app-manager .app-manager-plan-page .btn-group .Polaris-ButtonGroup__Item{margin-left:0!important;z-index:unset!important}.app-manager .app-manager-plan-page.custom-title .Polaris-HorizontalDivider{background-color:#e2e3e4}.app-manager .app-manager-plan-page .Polaris-Page__Content hr{border:1px solid #e2e3e4}.app-manager .app-manager-plan-page .app-manager-group-row{background:0 0!important;padding:16px 16px 16px 20px!important}.app-manager .app-manager-plan-page .feature__type__array{vertical-align:middle!important;word-spacing:999px;white-space:pre-line!important}.app-manager .app-manager-plan-page .Polaris-DataTable__Table{table-layout:fixed!important}.app-manager .app-manager-plan-page td{vertical-align:middle!important}.app-manager .app-manager-plan-page td.feature__class{word-wrap:break-word!important;white-space:normal!important}",
40711
40772
  map: undefined,
40712
40773
  media: undefined
@@ -40718,7 +40779,7 @@ var __vue_inject_styles__$2 = function __vue_inject_styles__(inject) {
40718
40779
  var __vue_scope_id__$2 = undefined;
40719
40780
  /* module identifier */
40720
40781
 
40721
- var __vue_module_identifier__$2 = "data-v-45a1de2b";
40782
+ var __vue_module_identifier__$2 = "data-v-c6c44804";
40722
40783
  /* functional template */
40723
40784
 
40724
40785
  var __vue_is_functional_template__$2 = false;
@@ -40761,7 +40822,8 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
40761
40822
  PCard: PCard,
40762
40823
  PSkeletonDisplayText: PSkeletonDisplayText,
40763
40824
  PSkeletonBodyText: PSkeletonBodyText,
40764
- PSkeletonPage: PSkeletonPage
40825
+ PSkeletonPage: PSkeletonPage,
40826
+ PEmptyState: PEmptyState
40765
40827
  },
40766
40828
  props: ['shop_domain'],
40767
40829
  data: function data() {
@@ -40769,12 +40831,14 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
40769
40831
  slideLength: 0,
40770
40832
  perPage: 0,
40771
40833
  currentSlide: 0,
40834
+ planLoading: false,
40772
40835
  plan: {},
40773
40836
  plans: [],
40774
40837
  features: [],
40775
40838
  shopify_plan: '',
40776
40839
  default_plan_id: null,
40777
40840
  onboard: true,
40841
+ choose_later: false,
40778
40842
  subtitleContent: '',
40779
40843
  checkList: ["60 days free trial"],
40780
40844
  selectedPlan: 'monthly',
@@ -40879,7 +40943,10 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
40879
40943
  var lastSlideClassName = '.slide-' + last;
40880
40944
  element = document.querySelector(lastSlideClassName);
40881
40945
  element.classList.add('last-slide');
40882
- document.querySelector('.VueCarousel-navigation-button.VueCarousel-navigation-prev').style.left = -document.querySelector('.Polaris-ResourceList__ResourceListWrapper.features').offsetWidth + 'px';
40946
+
40947
+ if (document.querySelector('.VueCarousel-navigation-button.VueCarousel-navigation-prev')) {
40948
+ document.querySelector('.VueCarousel-navigation-button.VueCarousel-navigation-prev').style.left = -document.querySelector('.Polaris-ResourceList__ResourceListWrapper.features').offsetWidth + 'px';
40949
+ }
40883
40950
  },
40884
40951
  activePlanStyle: function activePlanStyle(plan) {
40885
40952
  return [plan.shopify_plans.includes(this.shop.shopify_plan) || !plan.store_base_plan ? {
@@ -40891,7 +40958,7 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
40891
40958
  return plan.shopify_plans.includes(this.shop.shopify_plan) || !plan.store_base_plan ? 'active-plan' : '';
40892
40959
  },
40893
40960
  isCurrentPlan: function isCurrentPlan(plan) {
40894
- return this.shop.plan && (plan.id === this.shop.plan.id || !plan.is_custom && plan.base_plan === this.shop.plan.id);
40961
+ return !this.choose_later && this.shop.plan && (plan.id === this.shop.plan.id || !plan.is_custom && plan.base_plan === this.shop.plan.id);
40895
40962
  },
40896
40963
  isSamePlanInOtherInterval: function isSamePlanInOtherInterval(plan) {
40897
40964
  return this.shop.plan && plan.shopify_plans === this.shop.plan.shopify_plans;
@@ -41017,6 +41084,16 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
41017
41084
  _this4.selectedPlan = value;
41018
41085
 
41019
41086
  _this4.$nextTick(function () {
41087
+ var elements = document.querySelectorAll('.plan__price');
41088
+ var maxHeight = 0;
41089
+ elements.forEach(function (item) {
41090
+ if (maxHeight < item.offsetHeight) {
41091
+ maxHeight = item.offsetHeight;
41092
+ }
41093
+ });
41094
+ elements.forEach(function (item) {
41095
+ item.style.minHeight = maxHeight + 'px';
41096
+ });
41020
41097
  _this4.slideLength = _this4.selectedPlan === 'monthly' ? _this4.monthlyPlan.length : _this4.yearlyPlan.length;
41021
41098
  _this4.perPage = _this4.slideLength >= 4 ? 4 : _this4.slideLength; // calculate and reset height of rows
41022
41099
 
@@ -41077,6 +41154,96 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
41077
41154
  }, _callee4);
41078
41155
  }))();
41079
41156
  },
41157
+ fetchFeatures: function fetchFeatures() {
41158
+ var _this5 = this;
41159
+
41160
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
41161
+ var _yield$axios$get$catc, data, _this5$features, _this5$features2;
41162
+
41163
+ return regeneratorRuntime.wrap(function _callee5$(_context5) {
41164
+ while (1) {
41165
+ switch (_context5.prev = _context5.next) {
41166
+ case 0:
41167
+ _context5.next = 2;
41168
+ return axios.get("".concat(_this5.app_manager_config.baseUrl, "/api/app-manager/plan-features")).catch(function (error) {
41169
+ console.error(error);
41170
+ });
41171
+
41172
+ case 2:
41173
+ _yield$axios$get$catc = _context5.sent;
41174
+ data = _yield$axios$get$catc.data;
41175
+
41176
+ if (data.features.length) {
41177
+ _this5.features = data.features;
41178
+ _this5.features = (_this5$features = _this5.features) === null || _this5$features === void 0 ? void 0 : _this5$features.filter(function (item) {
41179
+ return item.hidden_feature !== true;
41180
+ });
41181
+ _this5.features = (_this5$features2 = _this5.features) === null || _this5$features2 === void 0 ? void 0 : _this5$features2.sort(function (featureA, featureB) {
41182
+ return parseInt(featureA.display_order) - parseInt(featureB.display_order);
41183
+ });
41184
+ }
41185
+
41186
+ case 5:
41187
+ case "end":
41188
+ return _context5.stop();
41189
+ }
41190
+ }
41191
+ }, _callee5);
41192
+ }))();
41193
+ },
41194
+ fetchPlans: function fetchPlans() {
41195
+ var _this6 = this;
41196
+
41197
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee6() {
41198
+ var _yield$axios$get$catc2, data, _this6$plans, _this6$plan;
41199
+
41200
+ return regeneratorRuntime.wrap(function _callee6$(_context6) {
41201
+ while (1) {
41202
+ switch (_context6.prev = _context6.next) {
41203
+ case 0:
41204
+ _context6.next = 2;
41205
+ return axios.get("".concat(_this6.app_manager_config.baseUrl, "/api/app-manager/plans"), {
41206
+ params: {
41207
+ 'shop_domain': _this6.shop_domain
41208
+ }
41209
+ }).catch(function (error) {
41210
+ console.error(error);
41211
+ });
41212
+
41213
+ case 2:
41214
+ _yield$axios$get$catc2 = _context6.sent;
41215
+ data = _yield$axios$get$catc2.data;
41216
+
41217
+ if (data.plans.length) {
41218
+ _this6.plans = data.plans;
41219
+ _this6.plans = (_this6$plans = _this6.plans) === null || _this6$plans === void 0 ? void 0 : _this6$plans.sort(function (planA, planB) {
41220
+ return parseFloat(planA.price) - parseFloat(planB.price);
41221
+ });
41222
+
41223
+ if (_this6.plans[0].store_base_plan) {
41224
+ _this6.subtitleContent = 'App plans are based on your existing shopify plan';
41225
+ }
41226
+
41227
+ _this6.plan = data.plan;
41228
+
41229
+ if (((_this6$plan = _this6.plan) === null || _this6$plan === void 0 ? void 0 : _this6$plan.interval) === 'ANNUAL') {
41230
+ _this6.selectedPlan = 'annually';
41231
+ }
41232
+
41233
+ _this6.shopify_plan = data.shopify_plan;
41234
+ _this6.default_plan_id = data.default_plan_id;
41235
+ _this6.onboard = !_this6.plan;
41236
+ _this6.choose_later = data.choose_later;
41237
+ }
41238
+
41239
+ case 5:
41240
+ case "end":
41241
+ return _context6.stop();
41242
+ }
41243
+ }
41244
+ }, _callee6);
41245
+ }))();
41246
+ },
41080
41247
  headerClasses: function headerClasses(firstColumn) {
41081
41248
  return {
41082
41249
  'Polaris-DataTable__Cell': true,
@@ -41087,66 +41254,32 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
41087
41254
  }
41088
41255
  },
41089
41256
  mounted: function mounted() {
41090
- var _this5 = this;
41091
-
41092
- return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5() {
41093
- var _this5$plan;
41257
+ var _this7 = this;
41094
41258
 
41095
- var featuresData, plansData;
41096
- return regeneratorRuntime.wrap(function _callee5$(_context5) {
41259
+ return _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee7() {
41260
+ return regeneratorRuntime.wrap(function _callee7$(_context7) {
41097
41261
  while (1) {
41098
- switch (_context5.prev = _context5.next) {
41262
+ switch (_context7.prev = _context7.next) {
41099
41263
  case 0:
41100
- _context5.next = 2;
41101
- return axios.get("".concat(_this5.app_manager_config.baseUrl, "/api/app-manager/plan-features")).catch(function (error) {
41102
- console.error(error);
41103
- });
41264
+ _this7.planLoading = true;
41265
+ _context7.next = 3;
41266
+ return _this7.fetchFeatures();
41104
41267
 
41105
- case 2:
41106
- featuresData = _context5.sent;
41107
- _this5.features = featuresData.data.features;
41108
- _this5.features = _this5.features.filter(function (item) {
41109
- return item.hidden_feature !== true;
41110
- });
41111
- _this5.features = _this5.features.sort(function (featureA, featureB) {
41112
- return parseInt(featureA.display_order) - parseInt(featureB.display_order);
41113
- });
41114
- _context5.next = 8;
41115
- return axios.get("".concat(_this5.app_manager_config.baseUrl, "/api/app-manager/plans"), {
41116
- params: {
41117
- 'shop_domain': _this5.shop_domain
41118
- }
41119
- }).catch(function (error) {
41120
- console.error(error);
41121
- });
41268
+ case 3:
41269
+ _context7.next = 5;
41270
+ return _this7.fetchPlans();
41122
41271
 
41123
- case 8:
41124
- plansData = _context5.sent;
41125
- _this5.plans = plansData.data.plans;
41126
- _this5.plans = _this5.plans.sort(function (planA, planB) {
41127
- return parseFloat(planA.price) - parseFloat(planB.price);
41128
- });
41129
-
41130
- if (_this5.plans && _this5.plans[0].store_base_plan) {
41131
- _this5.subtitleContent = 'App plans are based on your existing shopify plan';
41132
- }
41133
-
41134
- _this5.shopify_plan = plansData.data.shopify_plan;
41135
- _this5.plan = plansData.data.plan;
41136
-
41137
- if (((_this5$plan = _this5.plan) === null || _this5$plan === void 0 ? void 0 : _this5$plan.interval) === 'ANNUAL') {
41138
- _this5.selectedPlan = 'annually';
41139
- }
41140
-
41141
- _this5.default_plan_id = plansData.data.default_plan_id;
41142
- _this5.onboard = !_this5.plan;
41272
+ case 5:
41273
+ _this7.planLoading = false;
41143
41274
 
41144
- _this5.$nextTick(function () {
41275
+ _this7.$nextTick(function () {
41145
41276
  // calculate height of cell
41146
41277
  setTimeout(function () {
41147
41278
  var elements = document.querySelectorAll('.plan__price');
41148
41279
  var maxHeight = 0;
41149
41280
  elements.forEach(function (item) {
41281
+ item.style.minHeight = 'unset';
41282
+
41150
41283
  if (maxHeight < item.offsetHeight) {
41151
41284
  maxHeight = item.offsetHeight;
41152
41285
  }
@@ -41155,7 +41288,7 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
41155
41288
  item.style.minHeight = maxHeight + 'px';
41156
41289
  });
41157
41290
 
41158
- _this5.features.forEach(function (feature) {
41291
+ _this7.features.forEach(function (feature) {
41159
41292
  var className = feature.value_type + '__type__' + feature.slug;
41160
41293
  elements = document.querySelectorAll('.' + className);
41161
41294
  maxHeight = 0;
@@ -41179,9 +41312,9 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
41179
41312
  } // add first-slide and last-slide
41180
41313
 
41181
41314
 
41182
- _this5.slideLength = _this5.selectedPlan === 'monthly' ? _this5.monthlyPlan.length : _this5.yearlyPlan.length;
41183
- _this5.perPage = _this5.slideLength >= 4 ? 4 : _this5.slideLength;
41184
- var pagesCount = _this5.slideLength;
41315
+ _this7.slideLength = _this7.selectedPlan === 'monthly' ? _this7.monthlyPlan.length : _this7.yearlyPlan.length;
41316
+ _this7.perPage = _this7.slideLength >= 4 ? 4 : _this7.slideLength;
41317
+ var pagesCount = _this7.slideLength;
41185
41318
  setTimeout(function () {
41186
41319
  var element = document.querySelector('.slide-0');
41187
41320
 
@@ -41204,12 +41337,12 @@ var AppManagerGroupPlan = __vue_component__$3;var vueCarousel_min = createCommon
41204
41337
  }, 100);
41205
41338
  });
41206
41339
 
41207
- case 18:
41340
+ case 7:
41208
41341
  case "end":
41209
- return _context5.stop();
41342
+ return _context7.stop();
41210
41343
  }
41211
41344
  }
41212
- }, _callee5);
41345
+ }, _callee7);
41213
41346
  }))();
41214
41347
  }
41215
41348
  };/* script */
@@ -41223,9 +41356,9 @@ var __vue_render__$1 = function __vue_render__() {
41223
41356
 
41224
41357
  var _c = _vm._self._c || _h;
41225
41358
 
41226
- return !_vm.plans.length ? _c('PSkeletonPage', {
41359
+ return _vm.planLoading ? _c('PSkeletonPage', {
41227
41360
  attrs: {
41228
- "title": "Skeleton Page",
41361
+ "title": "Plans",
41229
41362
  "fullWidth": false,
41230
41363
  "primaryAction": "",
41231
41364
  "secondaryActions": 2,
@@ -41287,7 +41420,12 @@ var __vue_render__$1 = function __vue_render__() {
41287
41420
  attrs: {
41288
41421
  "sectioned": ""
41289
41422
  }
41290
- }, [_c('PSkeletonBodyText')], 1)], 1)], 1)], 1) : _c('PPage', {
41423
+ }, [_c('PSkeletonBodyText')], 1)], 1)], 1)], 1) : !this.planLoading && this.plans.length === 0 ? _c('PEmptyState', {
41424
+ attrs: {
41425
+ "heading": "No Plans",
41426
+ "image": "https://cdn.shopify.com/s/files/1/0262/4071/2726/files/emptystate-files.png"
41427
+ }
41428
+ }) : _c('PPage', {
41291
41429
  staticClass: "app-manager-plan-page-slider custom-title",
41292
41430
  attrs: {
41293
41431
  "title": "Choose plan",
@@ -41511,7 +41649,7 @@ var __vue_render__$1 = function __vue_render__() {
41511
41649
  "pressed": true
41512
41650
  }
41513
41651
  }, [_vm._v("\n " + _vm._s('Not applicable') + "\n ")])], 1)], 2)])]);
41514
- })], 2)]], 2), _vm._v(" "), _c('PlanBanners')], 1), _vm._v(" "), _vm.onboard && !_vm.shop.has_plan ? _c('PStack', {
41652
+ })], 2)]], 2)], 1), _vm._v(" "), _vm.onboard && !_vm.shop.has_plan ? _c('PStack', {
41515
41653
  staticClass: "choose-plan-btn",
41516
41654
  attrs: {
41517
41655
  "alignment": "center",
@@ -41529,7 +41667,7 @@ var __vue_render__$1 = function __vue_render__() {
41529
41667
  on: {
41530
41668
  "click": _vm.activePlan
41531
41669
  }
41532
- }, [_vm._v(_vm._s('I will choose the plan later'))])], 1)], 1) : _vm._e()], 1);
41670
+ }, [_vm._v(_vm._s('I will choose the plan later'))])], 1)], 1) : _vm._e(), _vm._v(" "), _c('PlanBanners')], 1);
41533
41671
  };
41534
41672
 
41535
41673
  var __vue_staticRenderFns__$1 = [];
@@ -41537,8 +41675,8 @@ var __vue_staticRenderFns__$1 = [];
41537
41675
 
41538
41676
  var __vue_inject_styles__$1 = function __vue_inject_styles__(inject) {
41539
41677
  if (!inject) return;
41540
- inject("data-v-88ac6e0e_0", {
41541
- source: "@import url(https://fonts.googleapis.com/css2?family=Satisfy&display=swap);.app-manager .app-manager-plan-page-slider ul{list-style:none;margin:0;padding:0}.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li,.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li,.app-manager .app-manager-plan-page-slider .plan__price{padding:16px 16px 16px 20px}.app-manager .app-manager-plan-page-slider .Polaris-Layout.custom-plan .VueCarousel .plan__price,.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li:not(:last-child),.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li{border-top:1px solid #ddd;border-right:1px solid #ddd;background:#fff}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li{border-right:none;border-left:1px solid #ddd}.app-manager .app-manager-plan-page-slider .plan__price{min-height:121px}.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li:nth-last-child(2),.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:last-child{border-bottom:1px solid #ddd}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:first-child{border-top-left-radius:12px}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:last-child{border-bottom-left-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide ul li:not(:last-child){border-left:1px solid #ddd}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide .plan__price{border-left:1px solid #ddd;box-shadow:none;border-top-left-radius:12px;overflow:hidden}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide ul li:nth-last-child(2){border-bottom-right-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide .plan__price{border-right:1px solid #ddd;box-shadow:none;border-top-right-radius:12px;overflow:hidden}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide{border-top-right-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide{border-top-left-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel .VueCarousel-inner li{text-align:center}.app-manager .app-manager-plan-page-slider .VueCarousel-navigation-button{color:#257f60}.app-manager .app-manager-plan-page-slider .btn-group .Polaris-ButtonGroup__Item{margin-left:0!important;z-index:unset!important}.app-manager .app-manager-plan-page-slider .feature__list,.app-manager .app-manager-plan-page-slider .feature__type__array{display:flex;align-items:center;word-spacing:999px;justify-content:center}.app-manager .app-manager-plan-page-slider .feature__type__array.feature__class{justify-content:left}",
41678
+ inject("data-v-15fc23fd_0", {
41679
+ source: "@import url(https://fonts.googleapis.com/css2?family=Satisfy&display=swap);.app-manager .app-manager-plan-page-slider ul{list-style:none;margin:0;padding:0}.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li,.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li,.app-manager .app-manager-plan-page-slider .plan__price{padding:16px 16px 16px 20px}.app-manager .app-manager-plan-page-slider .Polaris-Layout.custom-plan .VueCarousel .plan__price,.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li:not(:last-child),.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li{border-top:1px solid #ddd;border-right:1px solid #ddd;background:#fff}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li{border-right:none;border-left:1px solid #ddd}.app-manager .app-manager-plan-page-slider .Polaris-Layout__Section .VueCarousel-slide li:nth-last-child(2),.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:last-child{border-bottom:1px solid #ddd}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:first-child{border-top-left-radius:12px}.app-manager .app-manager-plan-page-slider .Polaris-ResourceList__ResourceListWrapper.features li:last-child{border-bottom-left-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide ul li:not(:last-child){border-left:1px solid #ddd}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide .plan__price{border-left:1px solid #ddd;box-shadow:none;border-top-left-radius:12px;overflow:hidden}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide ul li:nth-last-child(2){border-bottom-right-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide .plan__price{border-right:1px solid #ddd;box-shadow:none;border-top-right-radius:12px;overflow:hidden}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.last-slide{border-top-right-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel-inner .VueCarousel-slide.first-slide{border-top-left-radius:12px}.app-manager .app-manager-plan-page-slider .VueCarousel .VueCarousel-inner li{text-align:center}.app-manager .app-manager-plan-page-slider .VueCarousel-navigation-button{color:#257f60}.app-manager .app-manager-plan-page-slider .btn-group .Polaris-ButtonGroup__Item{margin-left:0!important;z-index:unset!important}.app-manager .app-manager-plan-page-slider .feature__list,.app-manager .app-manager-plan-page-slider .feature__type__array{display:flex;align-items:center;word-spacing:999px;justify-content:center}.app-manager .app-manager-plan-page-slider .feature__type__array.feature__class{justify-content:left}",
41542
41680
  map: undefined,
41543
41681
  media: undefined
41544
41682
  });
@@ -41549,7 +41687,7 @@ var __vue_inject_styles__$1 = function __vue_inject_styles__(inject) {
41549
41687
  var __vue_scope_id__$1 = undefined;
41550
41688
  /* module identifier */
41551
41689
 
41552
- var __vue_module_identifier__$1 = "data-v-88ac6e0e";
41690
+ var __vue_module_identifier__$1 = "data-v-15fc23fd";
41553
41691
  /* functional template */
41554
41692
 
41555
41693
  var __vue_is_functional_template__$1 = false;