feat(payments): PAYPAL-1345 adding button settings to the page builder

bigcommerce · Aug 22, 2022 · 928882a · 928882a
1 parent 83d17dd
commit 928882a
Show file tree

Hide file tree

Showing 4 changed files with 203 additions and 39 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Bump webpack-bundle-analyzer [#2229]https://github.com/bigcommerce/cornerstone/pull/2229
 - Make screen reader say all errors then each error while tabbing. [#2230]https://github.com/bigcommerce/cornerstone/pull/2230
 - Clarify customer order pagination. [#2241]https://github.com/bigcommerce/cornerstone/pull/2241
+- Add smart buttons attributes for various payment providers in Page builder [#2212]https://github.com/bigcommerce/cornerstone/pull/2212
 
 ## 6.5.0 (06-24-2022)
 - Category icons do not appear in Search Form [#2221]https://github.com/bigcommerce/cornerstone/pull/2221

diff --git a/config.json b/config.json
@@ -84,6 +84,7 @@
     "show_accept_klarna": false,
     "show_product_details_tabs": true,
     "show_product_reviews": true,
+    "show_quick_payment_buttons": false,
     "show_custom_fields_tabs": false,
     "show_product_weight": true,
     "show_product_dimensions": false,
@@ -352,7 +353,12 @@
     "checkout-paymentbuttons-paypal-color": "black",
     "checkout-paymentbuttons-paypal-shape": "rect",
     "checkout-paymentbuttons-paypal-size": "large",
-    "checkout-paymentbuttons-paypal-label": "pay"
+    "checkout-paymentbuttons-paypal-label": "pay",
+    "paymentbuttons-number-of-buttons": 1,
+    "googlepay-button-color": "black",
+    "afterpay-button-color": "black-mint",
+    "amazon-button-color": "Gold",
+    "masterpass-button-color": "black"
   },
   "read_only_files": [
     "/assets/scss/components/citadel",

diff --git a/schema.json b/schema.json
@@ -905,25 +905,6 @@
         "force_reload": true,
         "id": "show_accept_googlepay"
       },
-      {
-        "type": "select",
-        "label": "i18n.ApplePayColor",
-        "id": "applePay-button",
-        "options": [
-          {
-            "value": "black",
-            "label": "i18n.BlackWhiteText"
-          },
-          {
-            "value": "white",
-            "label": "i18n.WhiteBlackText"
-          },
-          {
-            "value": "white-border",
-            "label": "i18n.WhiteBlackTextWithBorder"
-          }
-        ]
-      },
       {
         "type": "checkbox",
         "label": "i18n.ShowKlarna",
@@ -1495,6 +1476,12 @@
         "label": "i18n.WishlistDropdownBackground",
         "id": "dropdown--wishList-backgroundColor"
       },
+      {
+        "type": "checkbox",
+        "label": "i18n.ShowQuickPaymentButtons",
+        "force_reload": true,
+        "id": "show_quick_payment_buttons"
+      },
       {
         "type": "heading",
         "content": "i18n.NumberOfProductsDisplayed"
@@ -2836,12 +2823,34 @@
       },
       {
         "type": "heading",
-        "content": "i18n.SmartPaypalButton"
+        "content": "i18n.QuickPaymentButtons"
+      },
+      {
+        "type": "select",
+        "label": "i18n.NumberOfButtonsAlwaysVisible",
+        "force_reload": true,
+        "id": "paymentbuttons-number-of-buttons",
+        "options": [
+          {
+            "value": 1,
+            "label": "1"
+          },
+          {
+            "value": 2,
+            "label": "2"
+          }
+        ]
+      },
+      {
+        "type": "heading",
+        "content": "i18n.SmartPaypalButton",
+        "enable": "payPalProvidersEnabled"
       },
       {
         "type": "select",
         "label": "i18n.ButtonColor",
         "id": "paymentbuttons-paypal-color",
+        "enable": "payPalProvidersEnabled",
         "force_reload": true,
         "options": [
           {
@@ -2870,6 +2879,7 @@
         "type": "select",
         "label": "i18n.ButtonShape",
         "id": "paymentbuttons-paypal-shape",
+        "enable": "payPalProvidersEnabled",
         "force_reload": true,
         "options": [
           {
@@ -2886,6 +2896,7 @@
         "type": "select",
         "label": "i18n.ButtonContent",
         "id": "paymentbuttons-paypal-label",
+        "enable": "payPalProvidersEnabled",
         "force_reload": true,
         "options": [
           {
@@ -2910,6 +2921,7 @@
         "type": "select",
         "label": "i18n.DisplayStyle",
         "id": "paymentbuttons-paypal-layout",
+        "enable": "payPalProvidersEnabled",
         "force_reload": true,
         "options": [
           {
@@ -2924,12 +2936,14 @@
       },
       {
         "type": "heading",
-        "content": "i18n.CheckoutPayPalButton"
+        "content": "i18n.CheckoutPayPalButton",
+        "enable": "payPalProvidersEnabled"
       },
       {
         "type": "select",
         "label": "i18n.ButtonColor",
         "id": "checkout-paymentbuttons-paypal-color",
+        "enable": "payPalProvidersEnabled",
         "force_reload": true,
         "options": [
           {
@@ -2958,6 +2972,7 @@
         "type": "select",
         "label": "i18n.ButtonShape",
         "id": "checkout-paymentbuttons-paypal-shape",
+        "enable": "payPalProvidersEnabled",
         "force_reload": true,
         "options": [
           {
@@ -2974,6 +2989,7 @@
         "type": "select",
         "label": "i18n.ButtonSize",
         "id": "checkout-paymentbuttons-paypal-size",
+        "enable": "payPalProvidersEnabled",
         "force_reload": true,
         "options": [
           {
@@ -2994,6 +3010,7 @@
         "type": "select",
         "label": "i18n.ButtonContent",
         "id": "checkout-paymentbuttons-paypal-label",
+        "enable": "payPalProvidersEnabled",
         "force_reload": true,
         "options": [
           {
@@ -3013,6 +3030,127 @@
             "label": "i18n.PayPal"
           }
         ]
+      },
+      {
+        "type": "heading",
+        "content": "i18n.GooglePaySettings",
+        "enable": "googleProvidersEnabled"
+      },
+      {
+        "type": "select",
+        "label": "i18n.ButtonColor",
+        "id": "googlepay-button-color",
+        "enable": "googleProvidersEnabled",
+        "options": [
+          {
+            "value": "black",
+            "label": "i18n.BlackWhiteText"
+          },
+          {
+            "value": "white",
+            "label": "i18n.WhiteBlackText"
+          }
+        ]
+      },
+      {
+        "type": "heading",
+        "content": "i18n.ApplePaySettings",
+        "enable": "appleProvidersEnabled"
+      },
+      {
+        "type": "select",
+        "label": "i18n.ButtonColor",
+        "id": "applePay-button",
+        "enable": "appleProvidersEnabled",
+        "options": [
+          {
+            "value": "black",
+            "label": "i18n.BlackWhiteText"
+          },
+          {
+            "value": "white",
+            "label": "i18n.WhiteBlackText"
+          },
+          {
+            "value": "white-border",
+            "label": "i18n.WhiteBlackTextWithBorder"
+          }
+        ]
+      },
+      {
+        "type": "heading",
+        "content": "i18n.AfterPaySettings",
+        "enable": "afterpayProvidersEnabled"
+      },
+      {
+        "type": "select",
+        "label": "i18n.ButtonColor",
+        "id": "afterpay-button-color",
+        "enable": "afterpayProvidersEnabled",
+        "options": [
+          {
+            "value": "black-mint",
+            "label": "i18n.BlackOnMintText"
+          },
+          {
+            "value": "mint-black",
+            "label": "i18n.MintOnBlackText"
+          },
+          {
+            "value": "white",
+            "label": "i18n.BlackWhiteText"
+          },
+          {
+            "value": "black",
+            "label": "i18n.WhiteBlackText"
+          }
+        ]
+      },
+      {
+        "type": "heading",
+        "content": "i18n.AmazonSettings",
+        "enable": "amazonProvidersEnabled"
+      },
+      {
+        "type": "select",
+        "label": "i18n.ButtonColor",
+        "id": "amazon-button-color",
+        "enable": "amazonProvidersEnabled",
+        "options": [
+          {
+            "value": "Gold",
+            "label": "i18n.Gold"
+          },
+          {
+            "value": "LightGray",
+            "label": "i18n.LightGray"
+          },
+          {
+            "value": "DarkGray",
+            "label": "i18n.DarkGray"
+          }
+        ]
+      },
+      {
+        "type": "heading",
+        "content": "i18n.MasterpassSettings",
+        "enable": "masterpassProvidersEnabled"
+      },
+      {
+        "type": "select",
+        "label": "i18n.ButtonColor",
+        "id": "masterpass-button-color",
+        "enable": "masterpassProvidersEnabled",
+        "options": [
+          {
+            "value": "black",
+            "label": "i18n.BlackWhiteText"
+          },
+          {
+            "value": "white",
+            "label": "i18n.WhiteBlackText"
+          }
+        ]
       }
     ]
   },

diff --git a/schemaTranslations.json b/schemaTranslations.json
@@ -1990,23 +1990,6 @@
     "da": "Vis Google Pay",
     "no": "Vis Google Pay"
   },
-  "i18n.ApplePayColor": {
-    "default": "Apple Pay color",
-    "fr": "Couleur Apple Pay",
-    "it": "Colore Apple Pay",
-    "uk": "Колір Apple Pay",
-    "zh": "Apple 支付颜色",
-    "de": "Apple Pay-Farbe",
-    "es": "Color de Apple Pay",
-    "nl": "Kleur Apple Pay",
-    "pt": "Cor do Apple Pay",
-    "sv": "Apple Pay-färg",
-    "es-MX": "Color de Apple Pay",
-    "pt-BR": "Cor do Apple Pay",
-    "es-419": "Color de Apple Pay",
-    "da": "Apple Pay-farve",
-    "no": "Apple Pay-farge"
-  },
   "i18n.BlackWhiteText": {
     "default": "Black (white text)",
     "fr": "Noir text blanc",
@@ -5195,5 +5178,41 @@
     "es-419": "Tamaño del contenedor de botones",
     "da": "Størrelse på knapbeholder",
     "no": "Størrelse på knappbeholder"
+  },
+  "i18n.AfterPaySettings": {
+    "default": "After Pay Button"
+  },
+  "i18n.ApplePaySettings": {
+    "default": "Apple Pay Button"
+  },
+  "i18n.BlackOnMintText": {
+    "default": "Black on Mint"
+  },
+  "i18n.MintOnBlackText": {
+    "default": "Mint on Black"
+  },
+  "i18n.AmazonSettings": {
+    "default": "Amazon Button"
+  },
+  "i18n.LightGray": {
+    "default": "Light Gray"
+  },
+  "i18n.DarkGray": {
+    "default": "Dark Gray"
+  },
+  "i18n.GooglePaySettings": {
+    "default": "Google Pay Button"
+  },
+  "i18n.MasterpassSettings": {
+    "default": "Masterpass Button"
+  },
+  "i18n.ShowQuickPaymentButtons": {
+    "default": "Show quick payment buttons"
+  },
+  "i18n.QuickPaymentButtons": {
+    "default": "Quick payment buttons"
+  },
+  "i18n.NumberOfButtonsAlwaysVisible": {
+    "default": "Number of buttons always visible"
   }
 }