Fixed checkbox state not persisted in wizard

closes https://github.com/TryGhost/Team/issues/676

The checkbox state for portal plans was not stored between wizard pages and kept switching back to original state.

ghost/admin/app/components/gh-launch-wizard/finalise.js

@@ -23,11 +23,11 @@ export default class GhLaunchWizardFinaliseComponent extends Component {
             const yearlyPrice = updatedProduct.get('stripePrices').find(d => d.nickname === 'Yearly');
             const portalPlans = this.settings.get('portalPlans') || [];
             let allowedPlans = [...portalPlans];
-            if (data.isMonthlyChecked && monthlyPrice) {
+            if (data.isMonthlyChecked && monthlyPrice && !allowedPlans.includes(monthlyPrice.id)) {
                 allowedPlans.push(monthlyPrice.id);
             }
 
-            if (data.isYearlyChecked && yearlyPrice) {
+            if (data.isYearlyChecked && yearlyPrice && !allowedPlans.includes(yearlyPrice.id)) {
                 allowedPlans.push(yearlyPrice.id);
             }
             this.settings.set('portalPlans', allowedPlans);

ghost/admin/app/components/gh-launch-wizard/set-pricing.hbs

@@ -127,7 +127,7 @@
     {{/if}}
 
     <div class="gh-launch-wizard-nav-buttons">
-        <button type="button" class="gh-btn gh-btn-outline gh-btn-icon-dark gh-btn-large w-30" {{on "click" @backStep}}><span>{{svg-jar "arrow-left-tail"}}</span></button>
+        <button type="button" class="gh-btn gh-btn-outline gh-btn-icon-dark gh-btn-large w-30" {{on "click" this.backStep}}><span>{{svg-jar "arrow-left-tail"}}</span></button>
 
         {{!-- TODO: reset "failed" state automatically --}}
         <GhTaskButton

ghost/admin/app/components/gh-launch-wizard/set-pricing.js

@@ -64,11 +64,22 @@ export default class GhLaunchWizardSetPricingComponent extends Component {
     constructor() {
         super(...arguments);
         const storedData = this.args.getData();
-        if (storedData && storedData.product) {
+        if (storedData) {
-            this.updatePricesFromProduct(storedData.product);
+            if (storedData.product) {
-        } else {
+                this.updatePricesFromProduct(storedData.product);
-            this.stripeMonthlyAmount = 5;
+            } else {
-            this.stripeYearlyAmount = 50;
+                this.stripeMonthlyAmount = 5;
+                this.stripeYearlyAmount = 50;
+            }
+            if (storedData.isMonthlyChecked !== undefined) {
+                this.isMonthlyChecked = storedData.isMonthlyChecked;
+            }
+            if (storedData.isYearlyChecked !== undefined) {
+                this.isYearlyChecked = storedData.isYearlyChecked;
+            }
+            if (storedData.isFreeChecked !== undefined) {
+                this.isFreeChecked = storedData.isFreeChecked;
+            }
         }
         this.updatePreviewUrl();
         this.loadingProduct = true;
@@ -95,6 +106,22 @@ export default class GhLaunchWizardSetPricingComponent extends Component {
         this.args.updatePreview('');
     }
 
+    @action
+    backStep() {
+        const product = this.getProduct();
+        const data = this.args.getData() || {};
+        this.args.storeData({
+            ...data,
+            product,
+            isFreeChecked: this.isFreeChecked,
+            isMonthlyChecked: this.isMonthlyChecked,
+            isYearlyChecked: this.isYearlyChecked,
+            monthlyAmount: this.stripeMonthlyAmount,
+            yearlyAmount: this.stripeYearlyAmount
+        });
+        this.args.backStep();
+    }
+
     @action
     setStripePlansCurrency(event) {
         const newCurrency = event.value;
@@ -150,8 +177,11 @@ export default class GhLaunchWizardSetPricingComponent extends Component {
         this.args.storeData({
             ...data,
             product,
+            isFreeChecked: this.isFreeChecked,
             isMonthlyChecked: this.isMonthlyChecked,
-            isYearlyChecked: this.isYearlyChecked
+            isYearlyChecked: this.isYearlyChecked,
+            monthlyAmount: this.stripeMonthlyAmount,
+            yearlyAmount: this.stripeYearlyAmount
         });
         this.args.nextStep();
     }