From 6bccd2a866ccac5e7a7e0a1d701736c231bc5d82 Mon Sep 17 00:00:00 2001
From: Matteo Pagliazzi <matteopagliazzi@gmail.com>
Date: Mon, 11 Mar 2019 18:23:47 +0100
Subject: [PATCH] New Payments Buttons (#11045)

* start implementing separate amazon button component

* wio

* switch amazon to new flow

* adjust amazon pay button size

* design buttons and add them to the settings page

* abstract css

* fixes and buy gems modal

* group plans css

* new buttons for gifts, fix padding in settings

* gift modal styles

* final style fixes
---
 .../client/assets/images/paypal-checkout.png  | Bin 0 -> 2859 bytes
 .../assets/images/paypal-checkout@2x.png      | Bin 0 -> 7934 bytes
 .../assets/images/paypal-checkout@3x.png      | Bin 0 -> 14241 bytes
 website/client/assets/scss/index.scss         |   1 +
 website/client/assets/scss/payments.scss      |  40 ++++++
 .../client/assets/svg/credit-card-icon.svg    |   3 +
 .../group-plans/createGroupModalPages.vue     |  35 ++----
 .../client/components/groups/groupPlan.vue    |  75 +++---------
 .../components/payments/amazonButton.vue      | 102 ++++++++++++++++
 .../components/payments/amazonModal.vue       | 114 ++++--------------
 .../components/payments/buyGemsModal.vue      |  78 ++++--------
 .../components/payments/sendGemsModal.vue     |  32 +++--
 .../components/settings/subscription.vue      |  34 +++---
 website/client/mixins/payments.js             |  24 +++-
 website/common/locales/en/npc.json            |   2 +-
 15 files changed, 288 insertions(+), 252 deletions(-)
 create mode 100755 website/client/assets/images/paypal-checkout.png
 create mode 100755 website/client/assets/images/paypal-checkout@2x.png
 create mode 100755 website/client/assets/images/paypal-checkout@3x.png
 create mode 100644 website/client/assets/scss/payments.scss
 create mode 100644 website/client/assets/svg/credit-card-icon.svg
 create mode 100644 website/client/components/payments/amazonButton.vue

diff --git a/website/client/assets/images/paypal-checkout.png b/website/client/assets/images/paypal-checkout.png
new file mode 100755
index 0000000000000000000000000000000000000000..684c06ba13fdc7ca26a9f2e196732b8dfd209bdf
GIT binary patch
literal 2859
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
JPDHLkV1je1e_;Rs

literal 0
HcmV?d00001

diff --git a/website/client/assets/images/paypal-checkout@2x.png b/website/client/assets/images/paypal-checkout@2x.png
new file mode 100755
index 0000000000000000000000000000000000000000..b6669e177bc00872dc9e928c46116365ac915164
GIT binary patch
literal 7934
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

literal 0
HcmV?d00001

diff --git a/website/client/assets/images/paypal-checkout@3x.png b/website/client/assets/images/paypal-checkout@3x.png
new file mode 100755
index 0000000000000000000000000000000000000000..71342566b1cd2c314c6a5d4c78d6064bd8e7b9ec
GIT binary patch
literal 14241
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
S3FJ|8hXIpUldF+65B-1J<<Lz4

literal 0
HcmV?d00001

diff --git a/website/client/assets/scss/index.scss b/website/client/assets/scss/index.scss
index f8408b2812..de1f6b5021 100644
--- a/website/client/assets/scss/index.scss
+++ b/website/client/assets/scss/index.scss
@@ -36,3 +36,4 @@
 @import './animals';
 @import './iconalert';
 @import './tiers';
+@import './payments';
diff --git a/website/client/assets/scss/payments.scss b/website/client/assets/scss/payments.scss
new file mode 100644
index 0000000000..51f3666fda
--- /dev/null
+++ b/website/client/assets/scss/payments.scss
@@ -0,0 +1,40 @@
+.payments-column {
+  display: flex;
+  flex-direction: column;
+  width: 296px;
+  justify-content: center;
+
+  &.payments-disabled {
+    opacity: 0.64;
+
+    .btn, .btn:hover, .btn:active {
+      box-shadow: none;
+    }
+  }
+
+  .payment-item {
+    margin-bottom: 12px;
+    display: flex;
+
+    &.payment-button {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+
+      .credit-card-icon {
+        width: 21.3px;
+        height: 16px;
+        margin-right: 8.7px;
+      }
+
+      &.paypal-checkout {
+        background: #009cde;
+
+        img {
+          width: 157px;
+          height: 21px;
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/website/client/assets/svg/credit-card-icon.svg b/website/client/assets/svg/credit-card-icon.svg
new file mode 100644
index 0000000000..85aabce066
--- /dev/null
+++ b/website/client/assets/svg/credit-card-icon.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="22" height="16" viewBox="0 0 22 16">
+    <path fill="#FFF" fill-rule="nonzero" d="M0 13.872V5.333h21.333v8.539c0 1.176-.747 2.128-1.67 2.128H1.67C.747 16 0 15.047 0 13.872zM19.664 0c.922 0 1.67.918 1.67 2.053v.614H0v-.614C0 .918.747 0 1.67 0h17.994z"/>
+</svg>
diff --git a/website/client/components/group-plans/createGroupModalPages.vue b/website/client/components/group-plans/createGroupModalPages.vue
index e0971792a8..8e480a9c11 100644
--- a/website/client/components/group-plans/createGroupModalPages.vue
+++ b/website/client/components/group-plans/createGroupModalPages.vue
@@ -22,11 +22,11 @@
       button.btn.btn-primary.btn-lg.btn-block(@click="createGroup()", :disabled="!newGroupIsReady") {{ $t('createGroupPlan') }}
   .col-12(v-if='activePage === PAGES.PAY')
     h2 {{ $t('choosePaymentMethod') }}
-    .payment-providers
-      .box.payment-button(@click='pay(PAYMENTS.STRIPE)')
-        .svg-icon.credit-card-icon(v-html="icons.creditCard")
-      .box.payment-button.amazon(@click='pay(PAYMENTS.AMAZON)')
-        .svg-icon.amazon-pay-icon(v-html="icons.amazonpay")
+    .payments-column
+      button.purchase.btn.btn-primary.payment-button.payment-item(@click='pay(PAYMENTS.STRIPE)') 
+        .svg-icon.credit-card-icon(v-html="icons.creditCardIcon")
+        | {{ $t('card') }}
+      amazon-button.payment-item(:amazon-data="pay(PAYMENTS.AMAZON)")
 </template>
 
 <style lang="scss" scoped>
@@ -65,40 +65,29 @@
     opacity: 0.7;
   }
 
-  .amazon-pay-icon {
-    width: 150px;
-  }
-
-  .credit-card-icon {
-    width: 150px;
-    color: #4e4a57;
-  }
-
   .btn-block {
     margin-bottom: 1em;
   }
-
-  .payment-button.amazon {
-    margin-bottom: 2em;
-  }
 </style>
 
 <script>
 import * as Analytics from 'client/libs/analytics';
 import { mapState } from 'client/libs/store';
 import paymentsMixin from '../../mixins/payments';
+import amazonButton from 'client/components/payments/amazonButton';
 
-import amazonpay from 'assets/svg/amazonpay.svg';
-import creditCard from 'assets/svg/credit-card.svg';
+import creditCardIcon from 'assets/svg/credit-card-icon.svg';
 
 export default {
   mixins: [paymentsMixin],
+  components: {
+    amazonButton,
+  },
   data () {
     return {
       amazonPayments: {},
       icons: Object.freeze({
-        amazonpay,
-        creditCard,
+        creditCardIcon,
       }),
       PAGES: {
         CREATE_GROUP: 'create-group',
@@ -159,7 +148,7 @@ export default {
         this.showStripe(paymentData);
       } else if (this.paymentMethod === this.PAYMENTS.AMAZON) {
         paymentData.type = 'subscription';
-        this.amazonPaymentsInit(paymentData);
+        return paymentData;
       }
     },
   },
diff --git a/website/client/components/groups/groupPlan.vue b/website/client/components/groups/groupPlan.vue
index 9e92d0aa58..8d30345589 100644
--- a/website/client/components/groups/groupPlan.vue
+++ b/website/client/components/groups/groupPlan.vue
@@ -48,14 +48,11 @@ div
 
           .box.payment-providers
             h3 Choose your payment method
-            .box.payment-button(@click='pay(PAYMENTS.STRIPE)')
-              div
-                .svg-icon.credit-card-icon(v-html="icons.group")
-                p.credit-card Credit Card
-              p Powered by Stripe
-            .box.payment-button(@click='pay(PAYMENTS.AMAZON)')
-              .svg-icon.amazon-pay-icon(v-html="icons.amazonpay")
-
+            .payments-column
+              button.purchase.btn.btn-primary.payment-button.payment-item(@click='pay(PAYMENTS.STRIPE)') 
+                .svg-icon.credit-card-icon(v-html="icons.creditCardIcon")
+                | {{ $t('card') }}
+              amazon-button.payment-item(:amazon-data="pay(PAYMENTS.AMAZON)")
     .container.col-6.offset-3.create-option(v-if='!upgradingGroup._id')
       .row
         h1.col-12.text-center.purple-header Create your Group today!
@@ -99,13 +96,13 @@ div
       .form-group
         button.btn.btn-primary.btn-lg.btn-block(@click="createGroup()", :disabled="!newGroupIsReady") {{ $t('createGroupPlan') }}
     .col-12(v-if='activePage === PAGES.PAY')
-      .payment-providers
+      .text-center
         h3 Choose your payment method
-        .box.payment-button(@click='pay(PAYMENTS.STRIPE)')
-          p Credit Card
-          p Powered by Stripe
-        .box.payment-button(@click='pay(PAYMENTS.AMAZON)')
-          | Amazon Pay
+        .payments-column.mx-auto
+          button.purchase.btn.btn-primary.payment-button.payment-item(@click='pay(PAYMENTS.STRIPE)') 
+            .svg-icon.credit-card-icon(v-html="icons.creditCardIcon")
+            | {{ $t('card') }}
+          amazon-button.payment-item(:amazon-data="pay(PAYMENTS.AMAZON)")
 </template>
 
 <style lang="scss" scoped>
@@ -130,12 +127,6 @@ div
       color: #fff;
     }
 
-    .payment-button {
-      display: block;
-      margin: 0 auto;
-      margin-bottom: 1em;
-    }
-
     .plus .svg-icon{
       width: 24px;
     }
@@ -143,26 +134,6 @@ div
     .payment-providers {
       width: 350px;
     }
-
-    .credit-card {
-      font-size: 20px;
-      font-weight: bold;
-      margin-bottom: 0;
-      margin-top: .5em;
-      display: inline-block;
-    }
-
-    .credit-card-icon {
-      width: 25px;
-      display: inline-block;
-      margin-right: .5em;
-    }
-
-    .amazon-pay-icon {
-      width: 150px;
-      margin: 0 auto;
-      margin-top: .5em;
-    }
   }
 
   .header {
@@ -316,35 +287,25 @@ div
       vertical-align: bottom;
     }
   }
-
-  .payment-button {
-    width: 200px;
-    height: 80px;
-    margin-bottom: .5em;
-    padding: .5em;
-    display: block;
-  }
-
-  .payment-button:hover {
-    cursor: pointer;
-  }
 </style>
 
 <script>
 import paymentsMixin from '../../mixins/payments';
 import { mapState } from 'client/libs/store';
-import group from 'assets/svg/group.svg';
-import amazonpay from 'assets/svg/amazonpay.svg';
 import positiveIcon from 'assets/svg/positive.svg';
+import creditCardIcon from 'assets/svg/credit-card-icon.svg';
+import amazonButton from 'client/components/payments/amazonButton';
 
 export default {
   mixins: [paymentsMixin],
+  components: {
+    amazonButton,
+  },
   data () {
     return {
       amazonPayments: {},
       icons: Object.freeze({
-        group,
-        amazonpay,
+        creditCardIcon,
         positiveIcon,
       }),
       PAGES: {
@@ -413,7 +374,7 @@ export default {
         this.showStripe(paymentData);
       } else if (this.paymentMethod === this.PAYMENTS.AMAZON) {
         paymentData.type = 'subscription';
-        this.amazonPaymentsInit(paymentData);
+        return paymentData;
       }
     },
   },
diff --git a/website/client/components/payments/amazonButton.vue b/website/client/components/payments/amazonButton.vue
new file mode 100644
index 0000000000..13ac2fecd5
--- /dev/null
+++ b/website/client/components/payments/amazonButton.vue
@@ -0,0 +1,102 @@
+<template lang="pug">
+  .amazon-pay-button(:id="buttonId")
+</template>
+
+<script>
+import axios from 'axios';
+import { mapState } from 'client/libs/store';
+import uuid from 'uuid';
+import paymentsMixin from 'client/mixins/payments';
+
+const AMAZON_PAYMENTS = process.env.AMAZON_PAYMENTS; // eslint-disable-line
+
+export default {
+  mixins: [paymentsMixin],
+  data () {
+    return { // @TODO what needed here? can be moved to mixin?
+      amazonPayments: {
+        modal: null,
+        type: null,
+        gift: null,
+        loggedIn: false,
+        paymentSelected: false,
+        billingAgreementId: '',
+        recurringConsent: false,
+        orderReferenceId: null,
+        subscription: null,
+        coupon: null,
+      },
+      isAmazonSetup: false,
+      amazonButtonEnabled: false,
+      groupToCreate: null, // creating new group
+      group: null, // upgrading existing group
+      buttonId: null,
+    };
+  },
+  props: {
+    amazonData: Object,
+  },
+  computed: {
+    ...mapState({user: 'user.data'}),
+    ...mapState(['isAmazonReady']),
+    amazonPaymentsCanCheckout () {
+      if (this.amazonPayments.type === 'single') {
+        return this.amazonPayments.paymentSelected === true;
+      } else if (this.amazonPayments.type === 'subscription') {
+        return this.amazonPayments.paymentSelected && this.amazonPayments.recurringConsent;
+      }
+      return false;
+    },
+  },
+  beforeMount () {
+    this.buttonId = `AmazonPayButton-${uuid.v4()}`;
+  },
+  mounted () {
+    this.amazonPaymentsInit(this.amazonData); // TOOD clone
+    if (this.isAmazonReady) return this.setupAmazon();
+
+    this.$store.watch(state => state.isAmazonReady, (isAmazonReady) => {
+      if (isAmazonReady) return this.setupAmazon();
+    });
+  },
+  methods: {
+    setupAmazon () {
+      if (this.isAmazonSetup) return false;
+      this.isAmazonSetup = true;
+      this.showButton();
+    },
+    showButton () {
+      window.OffAmazonPayments.Button( // eslint-disable-line new-cap
+        this.buttonId, // ID of the button
+        AMAZON_PAYMENTS.SELLER_ID,
+        {
+          type: 'PwA',
+          color: 'Gold',
+          size: 'large',
+          agreementType: 'BillingAgreement',
+          onSignIn: async (contract) => { // @TODO send to modal
+            this.amazonPayments.billingAgreementId = contract.getAmazonBillingAgreementId();
+
+            this.$set(this.amazonPayments, 'loggedIn', true);
+
+            this.$root.$emit('habitica::pay-with-amazon', this.amazonPayments);
+          },
+          authorization: () => {
+            window.amazon.Login.authorize({
+              scope: 'payments:widget',
+              popup: true,
+            }, function amazonSuccess (response) {
+              if (response.error) return alert(response.error);
+
+              const url = '/amazon/verifyAccessToken';
+              axios.post(url, response).catch((e) => {
+                alert(e.message);
+              });
+            });
+          },
+          onError: this.amazonOnError, // @TODO port here
+        });
+    },
+  },
+};
+</script>
diff --git a/website/client/components/payments/amazonModal.vue b/website/client/components/payments/amazonModal.vue
index 13380db0b5..823aae5e85 100644
--- a/website/client/components/payments/amazonModal.vue
+++ b/website/client/components/payments/amazonModal.vue
@@ -1,7 +1,6 @@
 <template lang="pug">
   b-modal#amazon-payment(title="Amazon", :hide-footer="true", size='md')
     h2.text-center Continue with Amazon
-    #AmazonPayButton
     #AmazonPayWallet(v-if="amazonPayments.loggedIn", style="width: 400px; height: 228px;")
     template(v-if="amazonPayments.loggedIn && amazonPayments.type === 'subscription'")
       br
@@ -19,7 +18,7 @@
     margin-bottom: 12px;
   }
 
-  #AmazonPayButton, #AmazonPayWallet, #AmazonPayRecurring {
+  #AmazonPayWallet, #AmazonPayRecurring {
     margin: 0 auto;
   }
 
@@ -54,7 +53,6 @@ export default {
         subscription: null,
         coupon: null,
       },
-      OffAmazonPayments: {},
       isAmazonSetup: false,
       amazonButtonEnabled: false,
       groupToCreate: null, // creating new group
@@ -74,12 +72,6 @@ export default {
     },
   },
   mounted () {
-    if (this.isAmazonReady) return this.setupAmazon();
-
-    this.$store.watch(state => state.isAmazonReady, (isAmazonReady) => {
-      if (isAmazonReady) return this.setupAmazon();
-    });
-
     this.$root.$on('habitica::pay-with-amazon', (amazonPaymentsData) => {
       if (!amazonPaymentsData) return;
 
@@ -90,67 +82,30 @@ export default {
       this.amazonPayments = Object.assign({}, amazonPayments, amazonPaymentsData);
 
       this.$root.$emit('bv::show::modal', 'amazon-payment');
+
+      this.$nextTick(async () => {
+        if (this.amazonPayments.type === 'subscription') {
+          this.amazonInitWidgets();
+        } else {
+          let url = '/amazon/createOrderReferenceId';
+          let response = await axios.post(url, {
+            billingAgreementId: this.amazonPayments.billingAgreementId,
+          });
+
+          if (response.status <= 400) {
+            this.amazonPayments.orderReferenceId = response.data.data.orderReferenceId;
+            this.amazonInitWidgets();
+          } else {
+            alert(response.message);
+          }
+        }
+      });
     });
   },
   destroyed () {
     this.$root.$off('habitica::pay-with-amazon');
   },
   methods: {
-    setupAmazon () {
-      if (this.isAmazonSetup) return false;
-      this.isAmazonSetup = true;
-      this.OffAmazonPayments = window.OffAmazonPayments;
-      this.showButton();
-    },
-    showButton () {
-      // @TODO: prevent modal close form clicking outside
-      let amazonButton = this.OffAmazonPayments.Button( // eslint-disable-line
-        'AmazonPayButton',
-        AMAZON_PAYMENTS.SELLER_ID,
-        {
-          type: 'PwA',
-          color: 'Gold',
-          size: 'small',
-          agreementType: 'BillingAgreement',
-          onSignIn: async (contract) => {
-            this.amazonPayments.billingAgreementId = contract.getAmazonBillingAgreementId();
-
-            this.$set(this.amazonPayments, 'loggedIn', true);
-
-            if (this.amazonPayments.type === 'subscription') {
-              this.amazonInitWidgets();
-            } else {
-              let url = '/amazon/createOrderReferenceId';
-              let response = await axios.post(url, {
-                billingAgreementId: this.amazonPayments.billingAgreementId,
-              });
-
-              if (response.status <= 400) {
-                this.amazonPayments.orderReferenceId = response.data.data.orderReferenceId;
-                this.amazonInitWidgets();
-                return;
-              }
-
-              alert(response.message);
-            }
-          },
-          authorization: () => {
-            window.amazon.Login.authorize({
-              scope: 'payments:widget',
-              popup: true,
-            }, function amazonSuccess (response) {
-              if (response.error) return alert(response.error);
-
-              let url = '/amazon/verifyAccessToken';
-              axios.post(url, response)
-                .catch((e) => {
-                  alert(e.message);
-                });
-            });
-          },
-          onError: this.amazonOnError,
-        });
-    },
     amazonInitWidgets () {
       let walletParams = {
         sellerId: AMAZON_PAYMENTS.SELLER_ID, // @TODO: Import
@@ -167,15 +122,14 @@ export default {
         walletParams.onReady = (billingAgreement) => {
           this.amazonPayments.billingAgreementId = billingAgreement.getAmazonBillingAgreementId();
 
-          new this.OffAmazonPayments.Widgets.Consent({
+          new window.OffAmazonPayments.Widgets.Consent({
             sellerId: AMAZON_PAYMENTS.SELLER_ID,
             amazonBillingAgreementId: this.amazonPayments.billingAgreementId,
             design: {
               designMode: 'responsive',
             },
             onReady: (consent) => {
-              let getConsent = consent.getConsentStatus;
-              this.$set(this.amazonPayments, 'recurringConsent', getConsent ? Boolean(getConsent()) : false);
+              this.$set(this.amazonPayments, 'recurringConsent', consent.getConsentStatus ? Boolean(consent.getConsentStatus()) : false);
               this.$set(this, 'amazonButtonEnabled', true);
             },
             onConsent: (consent) => {
@@ -189,7 +143,7 @@ export default {
         walletParams.amazonOrderReferenceId = this.amazonPayments.orderReferenceId;
       }
 
-      new this.OffAmazonPayments.Widgets.Wallet(walletParams).bind('AmazonPayWallet');
+      new window.OffAmazonPayments.Widgets.Wallet(walletParams).bind('AmazonPayWallet');
     },
     storePaymentStatusAndReload (url) {
       let paymentType;
@@ -305,30 +259,6 @@ export default {
     amazonOnPaymentSelect () {
       this.$set(this.amazonPayments, 'paymentSelected', true);
     },
-    amazonOnError (error) {
-      alert(error.getErrorMessage());
-      this.reset();
-    },
-    reset () {
-      // @TODO: Ensure we are using all of these
-      // some vars are set in the payments mixin. We should try to edit in one place
-      this.amazonPayments.modal = null;
-      this.amazonPayments.type = null;
-      this.amazonPayments.loggedIn = false;
-
-      // Gift
-      this.amazonPayments.gift = null;
-      this.amazonPayments.giftReceiver = null;
-
-      this.amazonPayments.billingAgreementId = null;
-      this.amazonPayments.orderReferenceId = null;
-      this.amazonPayments.paymentSelected = false;
-      this.amazonPayments.recurringConsent = false;
-      this.amazonPayments.subscription = null;
-      this.amazonPayments.coupon = null;
-      this.amazonPayments.groupToCreate = null;
-      this.amazonPayments.group = null;
-    },
   },
 };
 </script>
diff --git a/website/client/components/payments/buyGemsModal.vue b/website/client/components/payments/buyGemsModal.vue
index 1d98396be6..74538611dc 100644
--- a/website/client/components/payments/buyGemsModal.vue
+++ b/website/client/components/payments/buyGemsModal.vue
@@ -44,16 +44,13 @@
               button.btn.btn-primary(@click='gemAmount === 20 ? gemAmount = 0 : gemAmount = 20') {{gemAmount === 20 ? $t('selected') : '$5.00'}}
         .row.text-center
           h2.mx-auto.text-payment {{ $t('choosePaymentMethod') }}
-        .card-deck
-          .card.text-center.payment-method(@click='showStripe({})')
-            .card-body
-              .mx-auto(v-html='icons.creditCard', style='"height: 56px; width: 159px; margin-top: 1em;"')
-          .card.text-center.payment-method
-            a.card-body.paypal(@click="openPaypal(paypalCheckoutLink, 'gems')")
-              img(src='~assets/images/paypal.png')
-          .card.text-center.payment-method(@click="amazonPaymentsInit({type: 'single'})")
-            .card-body.amazon
-              img(src='~assets/images/amazon-payments.png')
+        .payments-column
+          button.purchase.btn.btn-primary.payment-button.payment-item(@click='showStripe()') 
+            .svg-icon.credit-card-icon(v-html="icons.creditCardIcon")
+            | {{ $t('card') }}
+          button.btn.payment-item.paypal-checkout.payment-button(@click="openPaypal(paypalCheckoutLink, 'gems')")
+            img(src='~assets/images/paypal-checkout.png', srcset="~assets/images/paypal-checkout@3x.png 3x ~assets/images/paypal-checkout@2x.png 2x", :alt="$t('paypal')")
+          amazon-button.payment-item(:amazon-data="{type: 'single'}")
         .row.text-center
           .svg-icon.mx-auto(v-html='icons.heart', style='"height: 24px; width: 24px;"')
         .row.text-center.text-outtro
@@ -127,16 +124,14 @@
             h2.mx-auto.text-payment(v-once) {{ $t('choosePaymentMethod') }}
           .row.text-center
             a.mx-auto(v-once) {{ $t('haveCouponCode') }}
-          .card-deck(v-if='subscriptionPlan')
-            .card.text-center.payment-method
-              .card-body(@click='showStripe({subscription: subscriptionPlan})')
-                .mx-auto(v-html='icons.creditCard', style='"height: 56px; width: 159px; margin-top: 1em;"')
-            .card.text-center.payment-method
-              a.card-body.paypal(@click="openPaypal(paypalSubscriptionLink, 'subscription')")
-                img(src='~assets/images/paypal.png')
-            .card.text-center.payment-method
-              .card-body.amazon(@click="amazonPaymentsInit({type: 'subscription', subscription: subscriptionPlan})")
-                img(src='~assets/images/amazon-payments.png')
+          .payments-column(v-if='subscriptionPlan')
+            button.purchase.btn.btn-primary.payment-button.payment-item(@click='showStripe({subscription: subscriptionPlan})') 
+              .svg-icon.credit-card-icon(v-html="icons.creditCardIcon")
+              | {{ $t('card') }}
+            button.btn.payment-item.paypal-checkout.payment-button(@click="openPaypal(paypalSubscriptionLink, 'subscription')")
+              img(src='~assets/images/paypal-checkout.png', srcset="~assets/images/paypal-checkout@3x.png 3x ~assets/images/paypal-checkout@2x.png 2x", :alt="$t('paypal')")
+            amazon-button.payment-item(:amazon-data="{type: 'subscription', subscription: subscriptionPlan}")
+
           .row.text-center
             .svg-icon.mx-auto(v-html='icons.heart', style='"height: 24px; width: 24px;"')
           .row.text-center.text-outtro
@@ -162,6 +157,11 @@
 <style lang="scss" scoped>
   @import '~client/assets/scss/colors.scss';
 
+
+  .payments-column {
+    margin: 0 auto;
+  }
+
   a.mx-auto {
     color: #2995cd;
   }
@@ -174,10 +174,6 @@
     font-size: 16px;
   }
 
-  .amazon {
-    padding-top: 1.8em;
-  }
-
   .benefits {
     font-size: 14px;
   }
@@ -194,19 +190,6 @@
     justify-content: center;
   }
 
-  .card {
-    margin: 1em;
-    border-radius: 2px;
-    box-shadow: 0 2px 2px 0 rgba(26, 24, 29, 0.16), 0 1px 4px 0 rgba(26, 24, 29, 0.12);
-  }
-
-  .card.active {
-    border-color: #24cc8f;
-    button {
-      background-color: #24cc8f;
-    }
-  }
-
   .divider {
     width: 80%;
     height: 1px;
@@ -272,18 +255,6 @@
     cursor: pointer;
   }
 
-  .payment-method {
-    background-color: #e1e0e3;
-  }
-
-  .payment-method:hover {
-    cursor: pointer;
-  }
-
-  .paypal {
-    padding-top: 1.3em;
-  }
-
   .spacer {
     height: 4em;
   }
@@ -328,7 +299,6 @@
     color: #4e4a57;
     font-size: 24px;
     margin: 1em;
-    opacity: 0.64;
   }
 </style>
 
@@ -339,7 +309,7 @@
   import paymentsMixin from 'client/mixins/payments';
 
   import checkIcon from 'assets/svg/check.svg';
-  import creditCard from 'assets/svg/credit-card.svg';
+  import creditCardIcon from 'assets/svg/credit-card-icon.svg';
   import heart from 'assets/svg/health.svg';
   import logo from 'assets/svg/habitica-logo.svg';
 
@@ -348,10 +318,13 @@
   import fortyTwoGems from 'assets/svg/42-gems.svg';
   import eightyFourGems from 'assets/svg/84-gems.svg';
 
+  import amazonButton from 'client/components/payments/amazonButton';
+
   export default {
     mixins: [paymentsMixin],
     components: {
       planGemLimits,
+      amazonButton,
     },
     computed: {
       ...mapState({user: 'user.data'}),
@@ -373,7 +346,7 @@
         icons: Object.freeze({
           logo,
           check: checkIcon,
-          creditCard,
+          creditCardIcon,
           fourGems,
           heart,
           twentyOneGems,
@@ -383,7 +356,6 @@
         gemAmount: 0,
         subscriptionPlan: '',
         selectedPage: 'subscribe',
-        amazonPayments: {},
         planGemLimits,
       };
     },
diff --git a/website/client/components/payments/sendGemsModal.vue b/website/client/components/payments/sendGemsModal.vue
index b03f521f57..d5244a67f7 100644
--- a/website/client/components/payments/sendGemsModal.vue
+++ b/website/client/components/payments/sendGemsModal.vue
@@ -1,6 +1,6 @@
 <template lang="pug">
-b-modal#send-gems(:title="title", :hide-footer="true", size='lg', @hide='onHide()')
-  .modal-body(v-if='userReceivingGems')
+b-modal#send-gems(:title="title", :hide-footer="true", size='md', @hide='onHide()')
+  div(v-if='userReceivingGems')
     .panel.panel-default(
       :class="gift.type === 'gems' ? 'panel-primary' : 'transparent'",
       @click='gift.type = "gems"'
@@ -32,7 +32,7 @@ b-modal#send-gems(:title="title", :hide-footer="true", size='lg', @hide='onHide(
       h3.panel-heading {{ $t('subscription') }}
       .panel-body
         .row
-          .col-md-4
+          .col-md-12
             .form-group
               .radio(v-for='block in subscriptionBlocks', v-if="block.target !== 'group' && block.canSubscribe === true")
                 label
@@ -48,11 +48,13 @@ b-modal#send-gems(:title="title", :hide-footer="true", size='lg', @hide='onHide(
       @click="sendGift()",
       :disabled="sendingInProgress"
     ) {{ $t("send") }}
-    template(v-else)
-      button.btn.btn-primary(@click='showStripe({gift, uuid: userReceivingGems._id, receiverName})') {{ $t('card') }}
-      button.btn.btn-warning(@click='openPaypalGift({gift: gift, giftedTo: userReceivingGems._id, receiverName})') PayPal
-      button.btn.btn-success(@click="amazonPaymentsInit({type: 'single', gift, giftedTo: userReceivingGems._id, receiverName})") Amazon Payments
-    button.btn.btn-secondary(@click='close()') {{$t('cancel')}}
+    .payments-column.mx-auto(v-else, :class="{'payments-disabled': !gift.subscription.key}")
+      button.purchase.btn.btn-primary.payment-button.payment-item(@click='showStripe({gift, uuid: userReceivingGems._id, receiverName})', :disabled="!gift.subscription.key") 
+        .svg-icon.credit-card-icon(v-html="icons.creditCardIcon")
+        | {{ $t('card') }}
+      button.btn.payment-item.paypal-checkout.payment-button(@click="openPaypalGift({gift: gift, giftedTo: userReceivingGems._id, receiverName})", :disabled="!gift.subscription.key")
+        img(src='~assets/images/paypal-checkout.png', srcset="~assets/images/paypal-checkout@3x.png 3x ~assets/images/paypal-checkout@2x.png 2x", :alt="$t('paypal')")
+      amazon-button.payment-item.mb-0(:amazon-data="{type: 'single', gift, giftedTo: userReceivingGems._id, receiverName}")
 </template>
 
 <style lang="scss">
@@ -78,6 +80,12 @@ b-modal#send-gems(:title="title", :hide-footer="true", size='lg', @hide='onHide(
   }
 </style>
 
+<style lang="scss" scoped>
+input[type="radio"] {
+  margin-right: 4px;
+}
+</style>
+
 <script>
 import toArray from 'lodash/toArray';
 import omitBy from 'lodash/omitBy';
@@ -86,12 +94,17 @@ import { mapState } from 'client/libs/store';
 import planGemLimits from '../../../common/script/libs/planGemLimits';
 import paymentsMixin from 'client/mixins/payments';
 import notificationsMixin from 'client/mixins/notifications';
+import amazonButton from 'client/components/payments/amazonButton';
+import creditCardIcon from 'assets/svg/credit-card-icon.svg';
 
 // @TODO: EMAILS.TECH_ASSISTANCE_EMAIL, load from config
 const TECH_ASSISTANCE_EMAIL = 'admin@habitica.com';
 
 export default {
   mixins: [paymentsMixin, notificationsMixin],
+  components: {
+    amazonButton,
+  },
   data () {
     return {
       planGemLimits,
@@ -110,6 +123,9 @@ export default {
       },
       sendingInProgress: false,
       userReceivingGems: null,
+      icons: Object.freeze({
+        creditCardIcon,
+      }),
     };
   },
   computed: {
diff --git a/website/client/components/settings/subscription.vue b/website/client/components/settings/subscription.vue
index b76747c523..c883c48f70 100644
--- a/website/client/components/settings/subscription.vue
+++ b/website/client/components/settings/subscription.vue
@@ -73,15 +73,13 @@
 
         .subscribe-pay(v-if='!hasSubscription || hasCanceledSubscription')
           h3 {{ $t('subscribeUsing') }}
-          .row.text-center
-            .col-md-4
-              button.purchase.btn.btn-primary(@click='showStripe({subscription:subscription.key, coupon:subscription.coupon})', :disabled='!subscription.key') {{ $t('card') }}
-            .col-md-4
-              a.purchase(@click="openPaypal(paypalPurchaseLink, 'subscription')", :disabled='!subscription.key')
-                img(src='https://www.paypalobjects.com/webstatic/en_US/i/buttons/pp-acceptance-small.png', :alt="$t('paypal')")
-            .col-md-4
-              a.btn.btn-secondary.purchase(@click="payWithAmazon()")
-                img(src='https://payments.amazon.com/gp/cba/button', :alt="$t('amazonPayments')")
+          .payments-column
+            button.purchase.btn.btn-primary.payment-button.payment-item(@click='showStripe({subscription:subscription.key, coupon:subscription.coupon})', :disabled='!subscription.key') 
+              .svg-icon.credit-card-icon(v-html="icons.creditCardIcon")
+              | {{ $t('card') }}
+            button.btn.payment-item.paypal-checkout.payment-button(@click="openPaypal(paypalPurchaseLink, 'subscription')", :disabled='!subscription.key')
+              img(src='~assets/images/paypal-checkout.png', srcset="~assets/images/paypal-checkout@3x.png 3x ~assets/images/paypal-checkout@2x.png 2x", :alt="$t('paypal')")
+            amazon-button.payment-item(:amazon-data="{type: 'subscription', subscription: this.subscription.key, coupon: this.subscription.coupon}")
     .row
       .col-6
         h2(v-once) {{ $t('giftSubscription') }}
@@ -92,7 +90,7 @@
         h4(v-once) {{ $t('giftSubscriptionText4') }}
 </template>
 
-<style scoped>
+<style scoped lang="scss">
   .badge.badge-success {
     color: #fff;
   }
@@ -115,8 +113,14 @@ import planGemLimits from '../../../common/script/libs/planGemLimits';
 import paymentsMixin from '../../mixins/payments';
 import notificationsMixin from '../../mixins/notifications';
 
+import amazonButton from 'client/components/payments/amazonButton';
+import creditCardIcon from 'assets/svg/credit-card-icon.svg';
+
 export default {
   mixins: [paymentsMixin, notificationsMixin],
+  components: {
+    amazonButton,
+  },
   data () {
     return {
       loading: false,
@@ -137,6 +141,9 @@ export default {
         PAYPAL: 'Paypal',
         GIFT: 'Gift',
       },
+      icons: Object.freeze({
+        creditCardIcon,
+      }),
     };
   },
   computed: {
@@ -240,13 +247,6 @@ export default {
     },
   },
   methods: {
-    payWithAmazon () {
-      this.amazonPaymentsInit({
-        type: 'subscription',
-        subscription: this.subscription.key,
-        coupon: this.subscription.coupon,
-      });
-    },
     async applyCoupon (coupon) {
       const response = await axios.post(`/api/v4/coupons/validate/${coupon}`);
 
diff --git a/website/client/mixins/payments.js b/website/client/mixins/payments.js
index 84c653a45f..9fc28dda27 100644
--- a/website/client/mixins/payments.js
+++ b/website/client/mixins/payments.js
@@ -251,8 +251,30 @@ export default {
 
       this.amazonPayments.gift = data.gift;
       this.amazonPayments.type = data.type;
+    },
+    amazonOnError (error) {
+      alert(error.getErrorMessage());
+      this.reset();
+    },
+    reset () {
+      // @TODO: Ensure we are using all of these
+      // some vars are set in the payments mixin. We should try to edit in one place
+      this.amazonPayments.modal = null;
+      this.amazonPayments.type = null;
+      this.amazonPayments.loggedIn = false;
 
-      this.$root.$emit('habitica::pay-with-amazon', this.amazonPayments);
+      // Gift
+      this.amazonPayments.gift = null;
+      this.amazonPayments.giftReceiver = null;
+
+      this.amazonPayments.billingAgreementId = null;
+      this.amazonPayments.orderReferenceId = null;
+      this.amazonPayments.paymentSelected = false;
+      this.amazonPayments.recurringConsent = false;
+      this.amazonPayments.subscription = null;
+      this.amazonPayments.coupon = null;
+      this.amazonPayments.groupToCreate = null;
+      this.amazonPayments.group = null;
     },
     async cancelSubscription (config) {
       if (config && config.group && !confirm(this.$t('confirmCancelGroupPlan'))) return;
diff --git a/website/common/locales/en/npc.json b/website/common/locales/en/npc.json
index be80194f06..4f7e73ac20 100644
--- a/website/common/locales/en/npc.json
+++ b/website/common/locales/en/npc.json
@@ -112,7 +112,7 @@
   "donationDesc": "20 Gems, Donation to Habitica",
   "payWithCard": "Pay with Card",
   "payNote": "Note: PayPal sometimes takes a long time to clear. We recommend paying with card.",
-  "card": "Credit Card (using Stripe)",
+  "card": "Credit Card",
   "amazonInstructions": "Click the button to pay using Amazon Payments",
   "paymentMethods": "Purchase using",
   "paymentSuccessful": "Your payment was successful!",