feat-payment): PAYPAL-1682 made PDP wallet buttons container hidden i…

…n cases when the product is not purchasable or out of stock (#2267)
bigcommerce · Oct 3, 2022 · 77d6ec1 · 77d6ec1
1 parent 26db3c7
commit 77d6ec1
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 1 deletion.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ## Draft
 - Migrate Cornerstone to new "Hide Price From Guests" functionality [#2262](https://github.com/bigcommerce/cornerstone/pull/2262)
 - Add Accelerated buttons container into 'add to cart' popup on product details page [#2264](https://github.com/bigcommerce/cornerstone/pull/2264)
+- Made PDP wallet buttons container hidden in cases when the product is not purchasable or out of stock [#2267](https://github.com/bigcommerce/cornerstone/pull/2267)
 
 ## 6.6.1 (09-14-2022)
 

diff --git a/assets/js/theme/common/product-details-base.js b/assets/js/theme/common/product-details-base.js
@@ -187,6 +187,7 @@ export default class ProductDetailsBase {
                 $input: $('[name=qty\\[\\]]', $scope),
             },
             $bulkPricing: $('.productView-info-bulkPricing', $scope),
+            $walletButtons: $('[data-add-to-cart-wallet-buttons]', $scope),
         };
     }
 
@@ -345,9 +346,11 @@ export default class ProductDetailsBase {
         if (!data.purchasable || !data.instock) {
             viewModel.$addToCart.prop('disabled', true);
             viewModel.$increments.prop('disabled', true);
+            viewModel.$walletButtons.hide();
         } else {
             viewModel.$addToCart.prop('disabled', false);
             viewModel.$increments.prop('disabled', false);
+            viewModel.$walletButtons.show();
         }
     }
 

diff --git a/templates/components/products/add-to-cart.html b/templates/components/products/add-to-cart.html
@@ -54,7 +54,7 @@
                 <span class="product-status-message aria-description--hidden">{{lang 'products.adding_to_cart'}} {{lang 'category.add_cart_announcement'}}</span>
             </div>
             {{#if this.with_wallet_buttons}}
-                <div class="add-to-cart-wallet-buttons">
+                <div class="add-to-cart-wallet-buttons" data-add-to-cart-wallet-buttons>
                     {{> components/common/wallet-buttons}}
                 </div>
             {{/if}}