Checkout Extensions - Determine selected payment method

[jacobherrera]

I'm working on a Checkout UI extension to be used in conjunction with a custom payment method. The store supports both Credit Cards and this custom payment method. The goal is that when the customer selects the custom payment method, an event is fired or picked up from the Checkout UI extension rendered on the screen and a textbox would be displayed to allow the user to enter the data needed for the custom payment method. There isn't much support around payments in the Checkout extension points API. 

The general approach follows the Delivery instructions example. The goal is that instead of a checkbox, the visibility be driven by the custom payment method radio button.

[NathanStone]

We are looking for this exact functionality on our store. Have you had any success that you can share in this post?

[vixnguyen]

Hi Jacobherrera,

In your case, you can use useSubscription with useExtensionApi to watch changes. It's working as your expectation. Please try!

const { selectedPaymentOptions } = useExtensionApi();

const _selectedPaymentOptions = useSubscription(selectedPaymentOptions);

useEffect(() => {

     // handle logic here when having changes on selectedPaymentOptions

}, [selectedPaymentOptions]);

Regards,

[garyrgilbert]

That only gives you the type of payment method it is and not the payment method name.

So for example if you had two manual payment methods, you would not be able to determine which is which since the handle returned is not the actual name of the payment method as it is show in admin or in a payment function.

Cheers,

Gary

[Mladen_Terzic]

Hey man, were you able to find a workaround here? 

[garyrgilbert]

No workaround that I know of. 

they do not want us to know the name of the payment method because that might allow us to do something they do not want us to.

[bhumika_dvb]

@jacobherrera  found any workaround here? I'm looking for same issue for our app.