1

i'm doing an integration of adyen web dropin on vue 3, and the problem that i've got is that, i simply am not able to hide the stored payment methods that i get back from adyen and yes i have set the showStoredPaymentMethod option to false.

Here are the relevant bits, but let me know if you need any more info this is the configuration

const configuration = {
  translations: {
    fr_FR: {
      paybutton: t('profile.myBankCards.buttons.register'),
    },
  },

  paymentMethodsResponse: paymentMethods.data,
  showStoredPaymentMethod: false,
  removePaymentMethods: ['paypal'],
  clientKey: adyenConfig.test['client-key'],
  locale: 'fr_FR',
  environment: adyenConfig.test.environment,
  brands: ['visa'],
  onSubmit: async (state: any, dropin: any) => {
    dropin.setStatus('loading');
    ....
    ...
    ....
    }
}

 const checkout = await AdyenCheckout(configuration);
 checkout.create('dropin').mount('#dropInComponent').setComponentRef('dropInComponent');

The response i get from adyen is something like

{"paymentMethods":[{"brands":["cartebancaire","visa","mc","amex"],"name":"Carte bancaire","type":"scheme"},{"name":"Pr\u00e9l\u00e8vement SEPA","type":"sepadirectdebit"},{"configuration":{"merchantId":"50","gatewayMerchantId":"testo"},"name":"Google Pay","type":"paywithgoogle"},{"configuration":{"merchantId":"2DZC3JW2K5KD2","intent":"authorize"},"name":"PayPal","type":"paypal"}],"storedPaymentMethods":[{"brand":"visa","expiryMonth":"03","expiryYear":"2030","holderName":"testosimit","id":"J7CQ8HD3B3M84H82","lastFour":"0000","name":"VISA \/ Carte Bancaire","networkTxReference":"667856598604824","supportedShopperInteractions":["Ecommerce","ContAuth"],"type":"scheme"},{"brand":"visa","expiryMonth":"03","expiryYear":"2030","holderName":"Test0405","id":"K5WVN6D3B3M84H82","lastFour":"4305","name":"VISA \/ Carte Bancaire","networkTxReference":"419942531233304","supportedShopperInteractions":["Ecommerce","ContAuth"],"type":"scheme"},{"brand":"mc","expiryMonth":"03","expiryYear":"2030","holderName":"Test6","id":"KWQX9NF2B3M84H82","lastFour":"0004","name":"MasterCard","networkTxReference":"CL175QHK905030503","supportedShopperInteractions":["Ecommerce","ContAuth"],"type":"scheme"}]}

What have i tried well, just trying to change values of the options i have already put above. Also i do not know what to try more, there must be something minor which im missing.

Oten
  • 23
  • 2

1 Answers1

1

the showPaymentMethods property is part of the dropin, see docs

In your case, your code would look like:

const checkout = await AdyenCheckout(configuration);
checkout.create('dropin', { showStoredPaymentMethods: false }).mount('#dropInComponent').setComponentRef('dropInComponent');)

Hope this helped!

Kwok He
  • 91
  • 4
  • Keep in mind that the stored payment method will still be saved on the Adyen Platform unless you choose to disable it by making a DELETE request: https://docs.adyen.com/online-payments/tokenization/managing-tokens#disable-stored-details – Kwok He May 05 '23 at 13:21
  • 1
    Dude that did it, sad that i didn't see it before, anyway as for the stored payment method i actually need it afterwards, thanks a lot. – Oten May 05 '23 at 13:41