From 51909a318690e2fa07f495312b85ba0c62b80b9a Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Fri, 13 Aug 2021 11:27:53 -0400
Subject: [PATCH 01/21] Create Premium Radio Buttons

---
 .../step-1/branded-checkout-step-1.tpl.html   | 29 +++++++++++++++++++
 src/common/app.config.js                      |  8 +++--
 2 files changed, 35 insertions(+), 2 deletions(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index 999882d6e..31843229f 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -38,6 +38,35 @@ <h3 class="panel-name" translate>{{'PAYMENT'}}</h3>
       </checkout-step-2>
     </div>
   </div>
+  <div class="panel" ng-if="$ctrl.premiumCode">
+    <div class="panel-body">
+      <h3 class="panel-name" translate>{{'PREMIUM'}}</h3>
+      <div class="row">
+        <div class="col-sm-4">
+          <div class="row">
+            <label class="radio-inline">
+              <input
+                type="radio"
+                name="premiumSelect"
+                ng-model="$ctrl.premiumSelected"
+                ng-value="true">
+                {{$ctrl.premiumName}}
+            </label>
+          </div>
+          <div class="row">
+            <label class="radio-inline">
+              <input
+                type="radio"
+                name="premiumSelect"
+                ng-model="$ctrl.premiumSelected"
+                ng-value="false">
+                <translate>{{'NO_THANK_YOU'}}</translate>
+            </label>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
   <div class="panel">
     <div class="panel-body text-right">
       <button class="btn btn-primary"
diff --git a/src/common/app.config.js b/src/common/app.config.js
index e8b786b1a..4ce842e8d 100644
--- a/src/common/app.config.js
+++ b/src/common/app.config.js
@@ -283,7 +283,9 @@ const appConfig = /* @ngInject */ function (envServiceProvider, $compileProvider
     GIFT_SUMMARY: 'Gift Summary',
     FIRST_GIFT: 'First Gift:',
     ANNUAL_GIFT_TOTAL: 'Annual Gift Total:',
-    FREQUENCY_GIFT_TOTAL: '{{frequency}} Gift Total:'
+    FREQUENCY_GIFT_TOTAL: '{{frequency}} Gift Total:',
+    PREMIUM: 'Premium',
+    NO_THANK_YOU: 'Thank you, but please do not send me the resources.'
   })
 
   $translateProvider.translations('es', {
@@ -490,7 +492,9 @@ const appConfig = /* @ngInject */ function (envServiceProvider, $compileProvider
     GIFT_SUMMARY: 'Gift Summary',
     FIRST_GIFT: 'First Gift:',
     ANNUAL_GIFT_TOTAL: 'Annual Gift Total:',
-    FREQUENCY_GIFT_TOTAL: '{{frequency}} Gift Total:'
+    FREQUENCY_GIFT_TOTAL: '{{frequency}} Gift Total:',
+    PREMIUM: 'Premium',
+    NO_THANK_YOU: 'Thank you, but please do not send me the resources.'
   })
   $translateProvider.preferredLanguage('en')
 }

From fd45ac66acfbf2ca522c722e30a3e8ccc2ce7676 Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Tue, 17 Aug 2021 08:27:40 -0400
Subject: [PATCH 02/21] Pass Properties to Premium Select

---
 src/app/branded/branded-checkout.component.js               | 2 ++
 src/app/branded/branded-checkout.tpl.html                   | 4 +++-
 src/app/branded/step-1/branded-checkout-step-1.component.js | 6 +++++-
 3 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/src/app/branded/branded-checkout.component.js b/src/app/branded/branded-checkout.component.js
index 34b456e1f..78321d9b6 100644
--- a/src/app/branded/branded-checkout.component.js
+++ b/src/app/branded/branded-checkout.component.js
@@ -130,6 +130,8 @@ export default angular
       frequency: '@',
       day: '@',
       apiUrl: '@',
+      premiumCode: '@',
+      premiumName: '@',
       donorDetailsVariable: '@donorDetails',
       defaultPaymentType: '@',
       hidePaymentTypeOptions: '@',
diff --git a/src/app/branded/branded-checkout.tpl.html b/src/app/branded/branded-checkout.tpl.html
index 229a4a924..ddd843476 100644
--- a/src/app/branded/branded-checkout.tpl.html
+++ b/src/app/branded/branded-checkout.tpl.html
@@ -15,7 +15,9 @@
           hide-payment-type-options="$ctrl.hidePaymentTypeOptions"
           show-cover-fees="$ctrl.showCoverFees"
           next="$ctrl.next()"
-          on-payment-failed="$ctrl.onPaymentFailed($event.donorDetails)">
+          on-payment-failed="$ctrl.onPaymentFailed($event.donorDetails)"
+          premium-code="$ctrl.premiumCode"
+          premium-name="$ctrl.premiumName">
         </branded-checkout-step-1>
         <branded-checkout-step-2
           ng-if="$ctrl.checkoutStep === 'review'"
diff --git a/src/app/branded/step-1/branded-checkout-step-1.component.js b/src/app/branded/step-1/branded-checkout-step-1.component.js
index 26895b40a..96311cc97 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.component.js
+++ b/src/app/branded/step-1/branded-checkout-step-1.component.js
@@ -27,6 +27,8 @@ class BrandedCheckoutStep1Controller {
     this.resetSubmission()
     this.initItemConfig()
     this.initCart()
+
+    this.premiumSelected = false
   }
 
   initItemConfig () {
@@ -182,6 +184,8 @@ export default angular
       hidePaymentTypeOptions: '<',
       showCoverFees: '<',
       next: '&',
-      onPaymentFailed: '&'
+      onPaymentFailed: '&',
+      premiumCode: '<',
+      premiumName: '<'
     }
   })

From 7b20a316c6db757c449ee543972d7af1d01b18ce Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Tue, 17 Aug 2021 08:29:54 -0400
Subject: [PATCH 03/21] Render Premium Image

---
 src/app/branded/branded-checkout.component.js               | 1 +
 src/app/branded/branded-checkout.tpl.html                   | 3 ++-
 src/app/branded/step-1/branded-checkout-step-1.component.js | 3 ++-
 src/app/branded/step-1/branded-checkout-step-1.tpl.html     | 3 +++
 4 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/app/branded/branded-checkout.component.js b/src/app/branded/branded-checkout.component.js
index 78321d9b6..459e3d0ca 100644
--- a/src/app/branded/branded-checkout.component.js
+++ b/src/app/branded/branded-checkout.component.js
@@ -132,6 +132,7 @@ export default angular
       apiUrl: '@',
       premiumCode: '@',
       premiumName: '@',
+      premiumImageUrl: '@',
       donorDetailsVariable: '@donorDetails',
       defaultPaymentType: '@',
       hidePaymentTypeOptions: '@',
diff --git a/src/app/branded/branded-checkout.tpl.html b/src/app/branded/branded-checkout.tpl.html
index ddd843476..4167ee881 100644
--- a/src/app/branded/branded-checkout.tpl.html
+++ b/src/app/branded/branded-checkout.tpl.html
@@ -17,7 +17,8 @@
           next="$ctrl.next()"
           on-payment-failed="$ctrl.onPaymentFailed($event.donorDetails)"
           premium-code="$ctrl.premiumCode"
-          premium-name="$ctrl.premiumName">
+          premium-name="$ctrl.premiumName"
+          premium-image-url="$ctrl.premiumImageUrl">
         </branded-checkout-step-1>
         <branded-checkout-step-2
           ng-if="$ctrl.checkoutStep === 'review'"
diff --git a/src/app/branded/step-1/branded-checkout-step-1.component.js b/src/app/branded/step-1/branded-checkout-step-1.component.js
index 96311cc97..cb868b31a 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.component.js
+++ b/src/app/branded/step-1/branded-checkout-step-1.component.js
@@ -186,6 +186,7 @@ export default angular
       next: '&',
       onPaymentFailed: '&',
       premiumCode: '<',
-      premiumName: '<'
+      premiumName: '<',
+      premiumImageUrl: '<'
     }
   })
diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index 31843229f..abe557c45 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -64,6 +64,9 @@ <h3 class="panel-name" translate>{{'PREMIUM'}}</h3>
             </label>
           </div>
         </div>
+        <div class="col-sm-4">
+          <img ng-src="{{$ctrl.premiumImageUrl}}" style="width: 200px; height: 200px" />
+        </div>
       </div>
     </div>
   </div>

From 7b712c88b0397cb439cf7c9d54b7b4d25052370b Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Fri, 13 Aug 2021 13:13:37 -0400
Subject: [PATCH 04/21] Store Premium Selection in ItemConfig

---
 src/app/branded/branded-checkout.component.js         |  2 ++
 src/app/branded/branded-checkout.tpl.html             |  3 ++-
 .../step-1/branded-checkout-step-1.component.js       | 11 ++++++++++-
 .../branded/step-1/branded-checkout-step-1.tpl.html   |  6 ++++--
 4 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/app/branded/branded-checkout.component.js b/src/app/branded/branded-checkout.component.js
index 459e3d0ca..250de988c 100644
--- a/src/app/branded/branded-checkout.component.js
+++ b/src/app/branded/branded-checkout.component.js
@@ -49,6 +49,8 @@ class BrandedCheckoutController {
       this.fireAnalyticsEvents('contact', 'payment')
     }, angular.noop)
     this.$translate.use(this.language || 'en')
+
+    this.itemConfig = {}
   }
 
   formatDonorDetails () {
diff --git a/src/app/branded/branded-checkout.tpl.html b/src/app/branded/branded-checkout.tpl.html
index 4167ee881..7ff99f1ab 100644
--- a/src/app/branded/branded-checkout.tpl.html
+++ b/src/app/branded/branded-checkout.tpl.html
@@ -18,7 +18,8 @@
           on-payment-failed="$ctrl.onPaymentFailed($event.donorDetails)"
           premium-code="$ctrl.premiumCode"
           premium-name="$ctrl.premiumName"
-          premium-image-url="$ctrl.premiumImageUrl">
+          premium-image-url="$ctrl.premiumImageUrl"
+          item-config="$ctrl.itemConfig">
         </branded-checkout-step-1>
         <branded-checkout-step-2
           ng-if="$ctrl.checkoutStep === 'review'"
diff --git a/src/app/branded/step-1/branded-checkout-step-1.component.js b/src/app/branded/step-1/branded-checkout-step-1.component.js
index cb868b31a..41500fa06 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.component.js
+++ b/src/app/branded/step-1/branded-checkout-step-1.component.js
@@ -150,6 +150,14 @@ class BrandedCheckoutStep1Controller {
     }
   }
 
+  onSelectPremiumOption () {
+    if (this.premiumSelected) {
+      this.itemConfig['premium-code'] = this.premiumCode
+    } else {
+      this.itemConfig['premium-code'] = undefined
+    }
+  }
+
   checkSuccessfulSubmission () {
     if (every(this.submission, 'completed')) {
       if (every(this.submission, { error: false })) {
@@ -187,6 +195,7 @@ export default angular
       onPaymentFailed: '&',
       premiumCode: '<',
       premiumName: '<',
-      premiumImageUrl: '<'
+      premiumImageUrl: '<',
+      itemConfig: '='
     }
   })
diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index abe557c45..0c1543de5 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -49,7 +49,8 @@ <h3 class="panel-name" translate>{{'PREMIUM'}}</h3>
                 type="radio"
                 name="premiumSelect"
                 ng-model="$ctrl.premiumSelected"
-                ng-value="true">
+                ng-value="true"
+                ng-change="$ctrl.onSelectPremiumOption()">
                 {{$ctrl.premiumName}}
             </label>
           </div>
@@ -59,7 +60,8 @@ <h3 class="panel-name" translate>{{'PREMIUM'}}</h3>
                 type="radio"
                 name="premiumSelect"
                 ng-model="$ctrl.premiumSelected"
-                ng-value="false">
+                ng-value="false"
+                ng-change="$ctrl.onSelectPremiumOption()">
                 <translate>{{'NO_THANK_YOU'}}</translate>
             </label>
           </div>

From abcd22a5b2d6c4e2a008a48d9f01b98828d6ef41 Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Tue, 17 Aug 2021 08:37:16 -0400
Subject: [PATCH 05/21] Display Premium on Checkout

---
 src/app/branded/branded-checkout.tpl.html        |  4 +++-
 .../step-2/branded-checkout-step-2.component.js  |  4 +++-
 .../step-2/branded-checkout-step-2.tpl.html      |  4 +++-
 src/app/checkout/step-3/step-3.component.js      |  4 +++-
 src/app/checkout/step-3/step-3.tpl.html          | 16 ++++++++++++++++
 5 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/src/app/branded/branded-checkout.tpl.html b/src/app/branded/branded-checkout.tpl.html
index 7ff99f1ab..399ca6d54 100644
--- a/src/app/branded/branded-checkout.tpl.html
+++ b/src/app/branded/branded-checkout.tpl.html
@@ -24,7 +24,9 @@
         <branded-checkout-step-2
           ng-if="$ctrl.checkoutStep === 'review'"
           next="$ctrl.next()"
-          previous="$ctrl.previous()">
+          previous="$ctrl.previous()"
+          premium-name="$ctrl.premiumName"
+          item-config="$ctrl.itemConfig">
         </branded-checkout-step-2>
         <thank-you-summary
           ng-if="$ctrl.checkoutStep === 'thankYou'"
diff --git a/src/app/branded/step-2/branded-checkout-step-2.component.js b/src/app/branded/step-2/branded-checkout-step-2.component.js
index 1a8cd7243..648555696 100644
--- a/src/app/branded/step-2/branded-checkout-step-2.component.js
+++ b/src/app/branded/step-2/branded-checkout-step-2.component.js
@@ -49,6 +49,8 @@ export default angular
     templateUrl: template,
     bindings: {
       previous: '&',
-      next: '&'
+      next: '&',
+      premiumName: '<',
+      itemConfig: '<'
     }
   })
diff --git a/src/app/branded/step-2/branded-checkout-step-2.tpl.html b/src/app/branded/step-2/branded-checkout-step-2.tpl.html
index e7f601150..3972cbb94 100644
--- a/src/app/branded/step-2/branded-checkout-step-2.tpl.html
+++ b/src/app/branded/step-2/branded-checkout-step-2.tpl.html
@@ -4,7 +4,9 @@ <h3 class="panel-name" translate>{{'REVIEW'}}</h3>
     <div class="alert alert-danger" role="alert" ng-if="$ctrl.errorLoadingCart" translate="RETRY_LOAD" translate-value-retryLoadFunction="{{$ctrl.loadCart()}}"></div>
     <checkout-step-3
       cart-data="$ctrl.cartData"
-      change-step="$ctrl.changeStep(newStep)">
+      change-step="$ctrl.changeStep(newStep)"
+      premium-name="$ctrl.premiumName"
+      branded-checkout-item="$ctrl.itemConfig">
     </checkout-step-3>
   </div>
 </div>
diff --git a/src/app/checkout/step-3/step-3.component.js b/src/app/checkout/step-3/step-3.component.js
index a6f766b07..80297c4d3 100644
--- a/src/app/checkout/step-3/step-3.component.js
+++ b/src/app/checkout/step-3/step-3.component.js
@@ -189,6 +189,8 @@ export default angular
       onSubmitBtnChangeState: '&',
       onSubmitted: '&',
       onSubmittingOrder: '&',
-      submittingOrder: '<'
+      submittingOrder: '<',
+      premiumName: '<',
+      brandedCheckoutItem: '<'
     }
   })
diff --git a/src/app/checkout/step-3/step-3.tpl.html b/src/app/checkout/step-3/step-3.tpl.html
index c9ed4a77c..919d0164a 100644
--- a/src/app/checkout/step-3/step-3.tpl.html
+++ b/src/app/checkout/step-3/step-3.tpl.html
@@ -146,6 +146,22 @@
     </div>
   </div>
 
+  <div class="mb" ng-if="!!$ctrl.brandedCheckoutItem['premium-code']">
+    <div class="panel panel-default">
+      <div class="panel-heading">
+        <translate>{{'PREMIUM'}}</translate>
+        <button id="changePremiumButton" class="btn btn-default btn-panel-head pull-right" ng-click="$ctrl.changeStep({newStep: 'premium'})" translate>{{'CHANGE'}}</button>
+      </div>
+      <div class="panel-body">
+        <div class="row">
+          <div class="col-md-12">
+            {{$ctrl.premiumName}}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
   <div class="mb">
     <div class="panel panel-default">
       <div class="panel-heading">

From c0eab9c13db02ab8692da5004f8fc66459737693 Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Tue, 10 Aug 2021 10:06:38 -0400
Subject: [PATCH 06/21] Update README

---
 README.md | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/README.md b/README.md
index fad73e2cb..ef44404fe 100644
--- a/README.md
+++ b/README.md
@@ -78,6 +78,9 @@ The `<branded-checkout>` element is where the branded checkout Angular app will
 - `designation-number` - the designation number you would like donors to give to - **Required**
 - `campaign-page` - the campaign page you would like to use, used for suggested amounts - *Optional*
 - `campaign-code` - the campaign code you would like to use - *Optional*
+- `premium-code` - the premium code you would like to use - *Optional* - make sure you use the proper premium code associated with the campaign
+- `premium-name` - the name of the premium offered to donors - *optional*
+- `premium-image-url` - the custom image to appear when selecting a premium - *optional*
 - `tsys-device` - the device name that corresponds to the TSYS Merchant Account which will be used for tokenizing your site's credit cards with TSYS - **Required** - Will be provided by DPS when adding your domain to the TSYS whitelist. `cru` is the default and corresponds with Cru's main TSYS Merchant ID
 - `amount` - defaults the gift's amount - *Optional*
 - `frequency` - defaults the gift's frequency - *Optional* - can be one of the following values:

From 4555d6f1f6d02d99ba31a4c6bdf6b7b2b4b54998 Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Wed, 11 Aug 2021 15:16:45 -0400
Subject: [PATCH 07/21] add tests

---
 .../step-1/branded-checkout-step-1.spec.js    | 23 +++++++++++++++++++
 1 file changed, 23 insertions(+)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.spec.js b/src/app/branded/step-1/branded-checkout-step-1.spec.js
index f08f41e03..e81faa748 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.spec.js
+++ b/src/app/branded/step-1/branded-checkout-step-1.spec.js
@@ -271,6 +271,29 @@ describe('branded checkout step 1', () => {
     })
   })
 
+  describe('onSelectPremiumOption', () => {
+    beforeEach(() => {
+      $ctrl.initItemConfig()
+      $ctrl.premiumCode = '112233'
+    })
+
+    it('premium selected', () => {
+      $ctrl.premiumSelected = true
+
+      $ctrl.onSelectPremiumOption()
+
+      expect($ctrl.itemConfig['premium-code']).toEqual($ctrl.premiumCode)
+    })
+
+    it('premium deselected', () => {
+      $ctrl.premiumSelected = false
+
+      $ctrl.onSelectPremiumOption()
+
+      expect($ctrl.itemConfig['premium-code']).toEqual(undefined)
+    })
+  })
+
   describe('checkSuccessfulSubmission', () => {
     beforeEach(() => {
       $ctrl.resetSubmission()

From a7b0d416047fd0e42d05b679af0fe317f4dc5be4 Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Fri, 20 Aug 2021 13:37:05 -0400
Subject: [PATCH 08/21] Change "Premium" header to "Choose a Resource"

---
 src/app/branded/step-1/branded-checkout-step-1.tpl.html | 2 +-
 src/app/checkout/step-3/step-3.tpl.html                 | 2 +-
 src/common/app.config.js                                | 4 ++--
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index 0c1543de5..b1490cdbf 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -40,7 +40,7 @@ <h3 class="panel-name" translate>{{'PAYMENT'}}</h3>
   </div>
   <div class="panel" ng-if="$ctrl.premiumCode">
     <div class="panel-body">
-      <h3 class="panel-name" translate>{{'PREMIUM'}}</h3>
+      <h3 class="panel-name" translate>{{'CHOOSE_RESOURCE'}}</h3>
       <div class="row">
         <div class="col-sm-4">
           <div class="row">
diff --git a/src/app/checkout/step-3/step-3.tpl.html b/src/app/checkout/step-3/step-3.tpl.html
index 919d0164a..027fd7c16 100644
--- a/src/app/checkout/step-3/step-3.tpl.html
+++ b/src/app/checkout/step-3/step-3.tpl.html
@@ -149,7 +149,7 @@
   <div class="mb" ng-if="!!$ctrl.brandedCheckoutItem['premium-code']">
     <div class="panel panel-default">
       <div class="panel-heading">
-        <translate>{{'PREMIUM'}}</translate>
+        <translate>{{'CHOOSE_RESOURCE'}}</translate>
         <button id="changePremiumButton" class="btn btn-default btn-panel-head pull-right" ng-click="$ctrl.changeStep({newStep: 'premium'})" translate>{{'CHANGE'}}</button>
       </div>
       <div class="panel-body">
diff --git a/src/common/app.config.js b/src/common/app.config.js
index 4ce842e8d..b2ba12123 100644
--- a/src/common/app.config.js
+++ b/src/common/app.config.js
@@ -284,7 +284,7 @@ const appConfig = /* @ngInject */ function (envServiceProvider, $compileProvider
     FIRST_GIFT: 'First Gift:',
     ANNUAL_GIFT_TOTAL: 'Annual Gift Total:',
     FREQUENCY_GIFT_TOTAL: '{{frequency}} Gift Total:',
-    PREMIUM: 'Premium',
+    CHOOSE_RESOURCE: 'Choose a Resource',
     NO_THANK_YOU: 'Thank you, but please do not send me the resources.'
   })
 
@@ -493,7 +493,7 @@ const appConfig = /* @ngInject */ function (envServiceProvider, $compileProvider
     FIRST_GIFT: 'First Gift:',
     ANNUAL_GIFT_TOTAL: 'Annual Gift Total:',
     FREQUENCY_GIFT_TOTAL: '{{frequency}} Gift Total:',
-    PREMIUM: 'Premium',
+    CHOOSE_RESOURCE: 'Choose a Resource',
     NO_THANK_YOU: 'Thank you, but please do not send me the resources.'
   })
   $translateProvider.preferredLanguage('en')

From 90024555ada4129cbc1b5aa13418c6d06dbb395d Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Fri, 20 Aug 2021 14:50:03 -0400
Subject: [PATCH 09/21] Add Single Quotes Around Premium Name

---
 src/app/branded/step-1/branded-checkout-step-1.tpl.html | 2 +-
 src/app/checkout/step-3/step-3.tpl.html                 | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index b1490cdbf..592d5b462 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -51,7 +51,7 @@ <h3 class="panel-name" translate>{{'CHOOSE_RESOURCE'}}</h3>
                 ng-model="$ctrl.premiumSelected"
                 ng-value="true"
                 ng-change="$ctrl.onSelectPremiumOption()">
-                {{$ctrl.premiumName}}
+                '{{$ctrl.premiumName}}'
             </label>
           </div>
           <div class="row">
diff --git a/src/app/checkout/step-3/step-3.tpl.html b/src/app/checkout/step-3/step-3.tpl.html
index 027fd7c16..5cf54a3a9 100644
--- a/src/app/checkout/step-3/step-3.tpl.html
+++ b/src/app/checkout/step-3/step-3.tpl.html
@@ -155,7 +155,7 @@
       <div class="panel-body">
         <div class="row">
           <div class="col-md-12">
-            {{$ctrl.premiumName}}
+            '{{$ctrl.premiumName}}'
           </div>
         </div>
       </div>

From 222c4610649a491c27867331a88cc36f416a3483 Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Fri, 20 Aug 2021 15:10:15 -0400
Subject: [PATCH 10/21] Fix Image Aspect Ratio

---
 src/app/branded/step-1/branded-checkout-step-1.tpl.html | 4 ++--
 src/assets/scss/_checkout.scss                          | 4 ++++
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index 592d5b462..a137e3106 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -42,7 +42,7 @@ <h3 class="panel-name" translate>{{'PAYMENT'}}</h3>
     <div class="panel-body">
       <h3 class="panel-name" translate>{{'CHOOSE_RESOURCE'}}</h3>
       <div class="row">
-        <div class="col-sm-4">
+        <div class="col-sm-3">
           <div class="row">
             <label class="radio-inline">
               <input
@@ -67,7 +67,7 @@ <h3 class="panel-name" translate>{{'CHOOSE_RESOURCE'}}</h3>
           </div>
         </div>
         <div class="col-sm-4">
-          <img ng-src="{{$ctrl.premiumImageUrl}}" style="width: 200px; height: 200px" />
+          <img class="premium-thumbnail" ng-src="{{$ctrl.premiumImageUrl}}" />
         </div>
       </div>
     </div>
diff --git a/src/assets/scss/_checkout.scss b/src/assets/scss/_checkout.scss
index cd4fb388e..d1defb4a7 100644
--- a/src/assets/scss/_checkout.scss
+++ b/src/assets/scss/_checkout.scss
@@ -218,3 +218,7 @@
 .cover-fees-text {
   margin-left: 5px;
 }
+
+.premium-thumbnail {
+  width: 200px;
+}

From 0adf54ff8154c2cf0ebd167efaae5b06f2b86388 Mon Sep 17 00:00:00 2001
From: Robert Eldredge <robert.eldredge@cru.org>
Date: Thu, 26 Aug 2021 16:27:58 -0400
Subject: [PATCH 11/21] Persist Premium Code

---
 .../step-1/branded-checkout-step-1.component.js       | 11 +++++++++--
 .../branded/step-1/branded-checkout-step-1.spec.js    |  6 ++++++
 2 files changed, 15 insertions(+), 2 deletions(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.component.js b/src/app/branded/step-1/branded-checkout-step-1.component.js
index 41500fa06..b6eb7884c 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.component.js
+++ b/src/app/branded/step-1/branded-checkout-step-1.component.js
@@ -27,11 +27,11 @@ class BrandedCheckoutStep1Controller {
     this.resetSubmission()
     this.initItemConfig()
     this.initCart()
-
-    this.premiumSelected = false
   }
 
   initItemConfig () {
+    this.defaultItemConfig = angular.copy(this.itemConfig)
+
     this.itemConfig = {}
     this.itemConfig['campaign-code'] = this.campaignCode
     if (this.itemConfig['campaign-code'] &&
@@ -60,6 +60,13 @@ class BrandedCheckoutStep1Controller {
     }
     this.itemConfig['recurring-day-of-month'] = this.day
     this.itemConfig.frequency = this.frequency
+
+    this.premiumSelected = false
+
+    if (this.defaultItemConfig && this.defaultItemConfig['premium-code']) {
+      this.itemConfig['premium-code'] = this.defaultItemConfig['premium-code']
+      this.premiumSelected = true
+    }
   }
 
   initCart () {
diff --git a/src/app/branded/step-1/branded-checkout-step-1.spec.js b/src/app/branded/step-1/branded-checkout-step-1.spec.js
index e81faa748..40668d45b 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.spec.js
+++ b/src/app/branded/step-1/branded-checkout-step-1.spec.js
@@ -84,6 +84,12 @@ describe('branded checkout step 1', () => {
       $ctrl.initItemConfig()
       expect($ctrl.itemConfig['campaign-code']).toEqual('')
     })
+
+    it('should persist premium-code in item config', () => {
+      $ctrl.itemConfig = { 'premium-code': '112233' }
+      $ctrl.initItemConfig()
+      expect($ctrl.itemConfig['premium-code']).toEqual('112233')
+    })
   })
 
   describe('initCart', () => {

From 53eb864f359180644e3bf3ad69bc0833aeb63dee Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Wed, 13 Nov 2024 10:02:49 -0800
Subject: [PATCH 12/21] Removing quotes from premium name and dedentation

---
 src/app/branded/step-1/branded-checkout-step-1.tpl.html | 4 ++--
 src/app/checkout/step-3/step-3.tpl.html                 | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index dd929ddf8..0feb41e54 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -57,7 +57,7 @@ <h3 class="panel-name" translate>{{'CHOOSE_RESOURCE'}}</h3>
                 ng-model="$ctrl.premiumSelected"
                 ng-value="true"
                 ng-change="$ctrl.onSelectPremiumOption()">
-                '{{$ctrl.premiumName}}'
+              {{$ctrl.premiumName}}
             </label>
           </div>
           <div class="row">
@@ -68,7 +68,7 @@ <h3 class="panel-name" translate>{{'CHOOSE_RESOURCE'}}</h3>
                 ng-model="$ctrl.premiumSelected"
                 ng-value="false"
                 ng-change="$ctrl.onSelectPremiumOption()">
-                <translate>{{'NO_THANK_YOU'}}</translate>
+              <translate>{{'NO_THANK_YOU'}}</translate>
             </label>
           </div>
         </div>
diff --git a/src/app/checkout/step-3/step-3.tpl.html b/src/app/checkout/step-3/step-3.tpl.html
index f5fc157e7..1b5a3c19c 100644
--- a/src/app/checkout/step-3/step-3.tpl.html
+++ b/src/app/checkout/step-3/step-3.tpl.html
@@ -159,7 +159,7 @@
       <div class="panel-body">
         <div class="row">
           <div class="col-md-12">
-            '{{$ctrl.premiumName}}'
+            {{$ctrl.premiumName}}
           </div>
         </div>
       </div>

From 6b748ab820ab1a22ad0eb06d2b9f27781ea8d45c Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Wed, 13 Nov 2024 14:03:55 -0800
Subject: [PATCH 13/21] Fix spelling in readme

---
 README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 6902ba1ca..a8feb8bbe 100644
--- a/README.md
+++ b/README.md
@@ -81,8 +81,8 @@ The `<branded-checkout>` element is where the branded checkout Angular app will
 - `campaign-page` - the campaign page you would like to use, used for suggested amounts - *Optional*
 - `campaign-code` - the campaign code you would like to use - *Optional*
 - `premium-code` - the premium code you would like to use - *Optional* - make sure you use the proper premium code associated with the campaign
-- `premium-name` - the name of the premium offered to donors - *optional*
-- `premium-image-url` - the custom image to appear when selecting a premium - *optional*
+- `premium-name` - the name of the premium offered to donors - *Optional*
+- `premium-image-url` - the custom image to appear when selecting a premium - *Optional*
 - `tsys-device` - the device name that corresponds to the TSYS Merchant Account which will be used for tokenizing your site's credit cards with TSYS - **Required** - Will be provided by DPS when adding your domain to the TSYS whitelist. `cru` is the default and corresponds with Cru's main TSYS Merchant ID
 - `amount` - defaults the gift's amount - *Optional*
 - `frequency` - defaults the gift's frequency - *Optional* - can be one of the following values:

From 28fdab3a20ba85fc7b757099e0b5a72cd2b47de8 Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Wed, 13 Nov 2024 14:04:14 -0800
Subject: [PATCH 14/21] Add itemConfig binding

---
 src/app/branded/branded-checkout.component.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/app/branded/branded-checkout.component.js b/src/app/branded/branded-checkout.component.js
index ecf6b8648..df6118070 100644
--- a/src/app/branded/branded-checkout.component.js
+++ b/src/app/branded/branded-checkout.component.js
@@ -180,6 +180,7 @@ export default angular
       premiumCode: '@',
       premiumName: '@',
       premiumImageUrl: '@',
+      itemConfig: '=',
       donorDetailsVariable: '@donorDetails',
       defaultPaymentType: '@',
       hidePaymentTypeOptions: '@',

From e623f0a2471f2fdc577878a49550c5bb635ff121 Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Wed, 13 Nov 2024 14:04:57 -0800
Subject: [PATCH 15/21] Use uppercase for PREMIUM_CODE

---
 .../branded/step-1/branded-checkout-step-1.component.js   | 8 ++++----
 src/app/branded/step-1/branded-checkout-step-1.spec.js    | 8 ++++----
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.component.js b/src/app/branded/step-1/branded-checkout-step-1.component.js
index 33081d72d..e9393effa 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.component.js
+++ b/src/app/branded/step-1/branded-checkout-step-1.component.js
@@ -65,8 +65,8 @@ class BrandedCheckoutStep1Controller {
 
     this.premiumSelected = false
 
-    if (this.defaultItemConfig && this.defaultItemConfig['premium-code']) {
-      this.itemConfig['premium-code'] = this.defaultItemConfig['premium-code']
+    if (this.defaultItemConfig && this.defaultItemConfig.PREMIUM_CODE) {
+      this.itemConfig.PREMIUM_CODE = this.defaultItemConfig.PREMIUM_CODE
       this.premiumSelected = true
     }
   }
@@ -162,9 +162,9 @@ class BrandedCheckoutStep1Controller {
 
   onSelectPremiumOption () {
     if (this.premiumSelected) {
-      this.itemConfig['premium-code'] = this.premiumCode
+      this.itemConfig.PREMIUM_CODE = this.premiumCode
     } else {
-      this.itemConfig['premium-code'] = undefined
+      this.itemConfig.PREMIUM_CODE = undefined
     }
   }
 
diff --git a/src/app/branded/step-1/branded-checkout-step-1.spec.js b/src/app/branded/step-1/branded-checkout-step-1.spec.js
index 343295260..f9cbcfb84 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.spec.js
+++ b/src/app/branded/step-1/branded-checkout-step-1.spec.js
@@ -86,9 +86,9 @@ describe('branded checkout step 1', () => {
     })
 
     it('should persist premium-code in item config', () => {
-      $ctrl.itemConfig = { 'premium-code': '112233' }
+      $ctrl.itemConfig = { PREMIUM_CODE: '112233' }
       $ctrl.initItemConfig()
-      expect($ctrl.itemConfig['premium-code']).toEqual('112233')
+      expect($ctrl.itemConfig.PREMIUM_CODE).toEqual('112233')
     })
   })
 
@@ -294,7 +294,7 @@ describe('branded checkout step 1', () => {
 
       $ctrl.onSelectPremiumOption()
 
-      expect($ctrl.itemConfig['premium-code']).toEqual($ctrl.premiumCode)
+      expect($ctrl.itemConfig.PREMIUM_CODE).toEqual($ctrl.premiumCode)
     })
 
     it('premium deselected', () => {
@@ -302,7 +302,7 @@ describe('branded checkout step 1', () => {
 
       $ctrl.onSelectPremiumOption()
 
-      expect($ctrl.itemConfig['premium-code']).toEqual(undefined)
+      expect($ctrl.itemConfig.PREMIUM_CODE).toEqual(undefined)
     })
   })
 

From 52c09ae5ed58b746f1af825342c78459cce31cf3 Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Tue, 26 Nov 2024 11:23:23 -0800
Subject: [PATCH 16/21] Add premium variables to the code example

---
 README.md | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index a8feb8bbe..30be80954 100644
--- a/README.md
+++ b/README.md
@@ -59,7 +59,10 @@ Add the following code to your page where appropriate. See the [Branded checkout
     on-order-completed="$event.$window.onOrderCompleted($event.purchase)"
     on-order-failed="$event.$window.onOrderFailed($event.donorDetails)"
     radio-station-api-url="https://api.domain.com/getStations"
-    radio-station-radius="100">
+    radio-station-radius="100"
+    premium-code="BOOKS01"
+    premium-name="Books"
+    premium-image-url="https://api.images.com/">
 </branded-checkout>
 
 <script src="https://give-static.cru.org/branded-checkout.v2.js"></script>

From 7b0c611e8bec0b4076ee8ec88edb4468ecf7d7b4 Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Tue, 26 Nov 2024 11:25:17 -0800
Subject: [PATCH 17/21] Only show div if premium image is provided

---
 src/app/branded/step-1/branded-checkout-step-1.tpl.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index 0feb41e54..314cca592 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -72,7 +72,7 @@ <h3 class="panel-name" translate>{{'CHOOSE_RESOURCE'}}</h3>
             </label>
           </div>
         </div>
-        <div class="col-sm-4">
+        <div ng-if="$ctrl.premiumImageUrl" class="col-sm-4">
           <img class="premium-thumbnail" ng-src="{{$ctrl.premiumImageUrl}}" />
         </div>
       </div>

From 56d3d44a76bb2a095cfb5227c1a45e0256542797 Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Tue, 26 Nov 2024 12:11:34 -0800
Subject: [PATCH 18/21] Update example image source

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 30be80954..a740872b3 100644
--- a/README.md
+++ b/README.md
@@ -62,7 +62,7 @@ Add the following code to your page where appropriate. See the [Branded checkout
     radio-station-radius="100"
     premium-code="BOOKS01"
     premium-name="Books"
-    premium-image-url="https://api.images.com/">
+    premium-image-url="https://api.images.com/img.png">
 </branded-checkout>
 
 <script src="https://give-static.cru.org/branded-checkout.v2.js"></script>

From d3a51670dbb73776ff26a6b459feca1b2b162c9d Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Fri, 6 Dec 2024 12:51:46 -0800
Subject: [PATCH 19/21] Remove itemConfig binding

---
 src/app/branded/branded-checkout.component.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/app/branded/branded-checkout.component.js b/src/app/branded/branded-checkout.component.js
index df6118070..ecf6b8648 100644
--- a/src/app/branded/branded-checkout.component.js
+++ b/src/app/branded/branded-checkout.component.js
@@ -180,7 +180,6 @@ export default angular
       premiumCode: '@',
       premiumName: '@',
       premiumImageUrl: '@',
-      itemConfig: '=',
       donorDetailsVariable: '@donorDetails',
       defaultPaymentType: '@',
       hidePaymentTypeOptions: '@',

From 5cf1da1e9b787cd4b7afdba61d1323a01bee53e7 Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Tue, 10 Dec 2024 10:00:29 -0800
Subject: [PATCH 20/21] Fix premium not showing on review page

---
 src/app/checkout/step-3/step-3.tpl.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/app/checkout/step-3/step-3.tpl.html b/src/app/checkout/step-3/step-3.tpl.html
index 1b5a3c19c..ee414ee52 100644
--- a/src/app/checkout/step-3/step-3.tpl.html
+++ b/src/app/checkout/step-3/step-3.tpl.html
@@ -150,7 +150,7 @@
     </div>
   </div>
 
-  <div class="mb" ng-if="!!$ctrl.brandedCheckoutItem['premium-code']">
+  <div class="mb" ng-if="$ctrl.brandedCheckoutItem.PREMIUM_CODE">
     <div class="panel panel-default">
       <div class="panel-heading">
         <translate>{{'CHOOSE_RESOURCE'}}</translate>

From 8a2b47af812826f307f3956337fb046fec13ebd2 Mon Sep 17 00:00:00 2001
From: Caleb Alldrin <caleb.alldrin@cru.org>
Date: Fri, 13 Dec 2024 12:43:33 -0800
Subject: [PATCH 21/21] Set radio buttons to be aligned left

---
 src/app/branded/step-1/branded-checkout-step-1.tpl.html         | 2 +-
 .../paymentMethods/bankAccountForm/bankAccountForm.tpl.html     | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/app/branded/step-1/branded-checkout-step-1.tpl.html b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
index 314cca592..5e208a36e 100644
--- a/src/app/branded/step-1/branded-checkout-step-1.tpl.html
+++ b/src/app/branded/step-1/branded-checkout-step-1.tpl.html
@@ -47,7 +47,7 @@ <h3 class="panel-name" translate>{{'PAYMENT'}}</h3>
   <div class="panel" ng-if="$ctrl.premiumCode">
     <div class="panel-body">
       <h3 class="panel-name" translate>{{'CHOOSE_RESOURCE'}}</h3>
-      <div class="row">
+      <div class="row text-left">
         <div class="col-sm-3">
           <div class="row">
             <label class="radio-inline">
diff --git a/src/common/components/paymentMethods/bankAccountForm/bankAccountForm.tpl.html b/src/common/components/paymentMethods/bankAccountForm/bankAccountForm.tpl.html
index 42ab8601b..8e2d28655 100644
--- a/src/common/components/paymentMethods/bankAccountForm/bankAccountForm.tpl.html
+++ b/src/common/components/paymentMethods/bankAccountForm/bankAccountForm.tpl.html
@@ -24,7 +24,7 @@ <h4 class="panel-title visible" translate>{{'BANK_ACCOUNT_PAYMENT'}}</h4>
         </div>
       </div>
       <div class="col-sm-6">
-        <div class="form-group form-group-default form-group-inline" ng-class="{'has-error': ($ctrl.bankPaymentForm.accountType | showErrors)}">
+        <div class="form-group form-group-default form-group-inline text-left" ng-class="{'has-error': ($ctrl.bankPaymentForm.accountType | showErrors)}">
           <label class="label-block" translate>{{'ACCOUNT_TYPE'}}</label>
           <label class="radio-inline">
             <input type="radio" name="accountType" ng-model="$ctrl.bankPayment.accountType" value="Checking" required> <translate>{{'CHECKING'}}</translate>