Retrieve payment methods when new shipping address is selected

view/frontend/web/js/model/adyen-payment-service.js

@@ -7,8 +7,11 @@ define(
         'underscore',
         'Magento_Checkout/js/model/quote',
         'Adyen_Payment/js/model/adyen-method-list',
+        'Magento_Customer/js/model/customer',
+        'Magento_Checkout/js/model/url-builder',
+        'mage/storage'
     ],
-    function (_, quote, methodList) {
+    function (_, quote, methodList, customer, urlBuilder, storage) {
         'use strict';
 
         return {
@@ -25,6 +28,41 @@ define(
              */
             getAvailablePaymentMethods: function () {
                 return methodList();
+            },
+            /**
+             * Retrieve the list of available payment methods from the server
+             */
+            retrieveAvailablePaymentMethods: function (callback) {
+                var self = this;
+
+                // retrieve payment methods
+                var serviceUrl,
+                    payload;
+                if (customer.isLoggedIn()) {
+                    serviceUrl = urlBuilder.createUrl('/carts/mine/retrieve-adyen-payment-methods', {});
+                } else {
+                    serviceUrl = urlBuilder.createUrl('/guest-carts/:cartId/retrieve-adyen-payment-methods', {
+                        cartId: quote.getQuoteId()
+                    });
+                }
+
+                payload = {
+                    cartId: quote.getQuoteId(),
+                    shippingAddress: quote.shippingAddress()
+                };
+
+                storage.post(
+                    serviceUrl, JSON.stringify(payload)
+                ).done(
+                    function (response) {
+                        self.setPaymentMethods(response);
+                        callback();
+                    }
+                ).fail(
+                    function (response) {
+                        self.setPaymentMethods([]);
+                    }
+                )
             }
         };
     }

view/frontend/web/js/view/payment/method-renderer/adyen-hpp-method.js

@@ -90,28 +90,9 @@ define(
                 // reset variable:
                 adyenPaymentService.setPaymentMethods();
 
-                // retrieve payment methods
-                var serviceUrl,
-                    payload;
-                if (customer.isLoggedIn()) {
-                    serviceUrl = urlBuilder.createUrl('/carts/mine/retrieve-adyen-payment-methods', {});
-                } else {
-                    serviceUrl = urlBuilder.createUrl('/guest-carts/:cartId/retrieve-adyen-payment-methods', {
-                        cartId: quote.getQuoteId()
-                    });
-                }
-
-                payload = {
-                    cartId: quote.getQuoteId(),
-                    shippingAddress: quote.shippingAddress()
-                };
-
-                storage.post(
-                    serviceUrl, JSON.stringify(payload)
-                ).done(
-                    function (response) {
-                        adyenPaymentService.setPaymentMethods(response);
-                        if (JSON.stringify(response).indexOf("ratepay") > -1) {
+                adyenPaymentService.retrieveAvailablePaymentMethods(function() {
+                    let paymentMethods = adyenPaymentService.getAvailablePaymentMethods();
+                    if (JSON.stringify(paymentMethods).indexOf("ratepay") > -1) {
                         var ratePayId = window.checkoutConfig.payment.adyenHpp.ratePayId;
                         var dfValueRatePay = self.getRatePayDeviceIdentToken();
 
@@ -130,7 +111,7 @@ define(
 
                     // create component needs to be in initialize method
                     var messageComponents = {};
-                        _.map(response, function (value) {
+                    _.map(paymentMethods, function (value) {
 
                         var messageContainer = new Messages();
                         var name = 'messages-' + self.getBrandCodeFromPaymentMethod(value);
@@ -149,9 +130,10 @@ define(
                     });
                     self.messageComponents = messageComponents;
 
-                        fullScreenLoader.stopLoader();
-                    }
-                ).fail(function (error) {
+                    quote.shippingAddress.subscribe( function(address) {
+                        adyenPaymentService.retrieveAvailablePaymentMethods();
+                    });
+
                     fullScreenLoader.stopLoader();
                 });
             },