From 7d5a8d6acc8a88743d5fabf7df7e0b0c6affd84c Mon Sep 17 00:00:00 2001
From: Zenit Shkreli <69572953+zenit2001@users.noreply.github.com>
Date: Wed, 4 Dec 2024 11:16:19 +0100
Subject: [PATCH 1/2] feat: added support to card brands in adyen account page

---
 .../client/default/js/adyenAccount.js         | 60 +++++++++++--------
 .../default/account/payment/paymentForm.isml  |  1 +
 2 files changed, 35 insertions(+), 26 deletions(-)

diff --git a/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/adyenAccount.js b/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/adyenAccount.js
index 59f693060..cf9181d14 100644
--- a/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/adyenAccount.js
+++ b/src/cartridges/app_adyen_SFRA/cartridge/client/default/js/adyenAccount.js
@@ -1,4 +1,4 @@
-const { onFieldValid, onBrand } = require('./commons');
+const { onFieldValid, onBrand, getPaymentMethods } = require('./commons');
 const store = require('../../../store');
 
 let checkout;
@@ -10,20 +10,35 @@ store.checkoutConfiguration.amount = {
   currency: 'EUR',
 };
 
-store.checkoutConfiguration.paymentMethodsConfiguration = {
-  card: {
-    enableStoreDetails: false,
-    hasHolderName: true,
-    holderNameRequired: true,
-    installments: [],
-    onBrand,
-    onFieldValid,
-    onChange(state) {
-      store.isValid = state.isValid;
-      store.componentState = state;
+async function initializeStoreConfiguration() {
+  const paymentMethodsData = await getPaymentMethods();
+  const paymentMethodsResponse = paymentMethodsData.AdyenPaymentMethods;
+  const cardBrands = paymentMethodsResponse.paymentMethods
+    .filter((method) => method.type === 'scheme')
+    .flatMap((method) => method.brands || []);
+
+  store.checkoutConfiguration.paymentMethodsConfiguration = {
+    card: {
+      enableStoreDetails: false,
+      hasHolderName: true,
+      holderNameRequired: true,
+      installments: [],
+      onBrand,
+      onFieldValid,
+      brands: cardBrands,
+      onChange(state) {
+        store.isValid = state.isValid;
+        store.componentState = state;
+      },
     },
-  },
-};
+  };
+}
+
+async function initializeCardComponent() {
+  const cardNode = document.getElementById('card');
+  checkout = await AdyenCheckout(store.checkoutConfiguration);
+  card = checkout.create('card').mount(cardNode);
+}
 
 // Handle Payment action
 function handleAction(action) {
@@ -31,11 +46,8 @@ function handleAction(action) {
   $('#action-modal').modal({ backdrop: 'static', keyboard: false });
 }
 
-// confirm onAdditionalDetails event and paymentsDetails response
 store.checkoutConfiguration.onAdditionalDetails = (state) => {
-  const requestData = JSON.stringify({
-    data: state.data,
-  });
+  const requestData = JSON.stringify({ data: state.data });
   $.ajax({
     type: 'POST',
     url: window.paymentsDetailsURL,
@@ -57,12 +69,6 @@ store.checkoutConfiguration.onAdditionalDetails = (state) => {
   });
 };
 
-async function initializeCardComponent() {
-  const cardNode = document.getElementById('card');
-  checkout = await AdyenCheckout(store.checkoutConfiguration);
-  card = checkout.create('card').mount(cardNode);
-}
-
 let formErrorsExist = false;
 
 function submitAddCard() {
@@ -84,9 +90,11 @@ function submitAddCard() {
   });
 }
 
-initializeCardComponent();
+(async () => {
+  await initializeStoreConfiguration();
+  await initializeCardComponent();
+})();
 
-// Add Payment Button event handler
 $('button[value="add-new-payment"]').on('click', (event) => {
   if (store.isValid) {
     document.querySelector('#adyenStateData').value = JSON.stringify(
diff --git a/src/cartridges/app_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml b/src/cartridges/app_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
index c917ee659..864dbfddd 100644
--- a/src/cartridges/app_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
+++ b/src/cartridges/app_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
@@ -18,6 +18,7 @@
             };
             window.redirectUrl = "${URLUtils.url('PaymentInstruments-List')}";
             window.paymentsDetailsURL = "${URLUtils.https('Adyen-PaymentsDetails')}";
+            window.getPaymentMethodsURL = "${URLUtils.https('Adyen-GetPaymentMethods')}";
         </script>
         <form
             action="${URLUtils.url('PaymentInstruments-SavePayment', 'UUID', pdict.UUID)}"

From f2912406447780730540c4686957bb3cd9ebbdfd Mon Sep 17 00:00:00 2001
From: Zenit Shkreli <69572953+zenit2001@users.noreply.github.com>
Date: Wed, 4 Dec 2024 16:14:30 +0100
Subject: [PATCH 2/2] chore: clicking consent button if visible

---
 tests/playwright/pages/CheckoutPageSFRA5.mjs | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/tests/playwright/pages/CheckoutPageSFRA5.mjs b/tests/playwright/pages/CheckoutPageSFRA5.mjs
index 30e965d41..6cb40f553 100644
--- a/tests/playwright/pages/CheckoutPageSFRA5.mjs
+++ b/tests/playwright/pages/CheckoutPageSFRA5.mjs
@@ -104,6 +104,9 @@ export default class CheckoutPageSFRA5 {
     await this.successMessage.waitFor({ visible: true });
 
     await this.navigateToCheckout(locale);
+    if (this.consentButton.isVisible()) {
+		this.consentButton.click();
+	  }
     await this.checkoutGuest.click();
   };