ryon-reactnative-googlepay | Stripe Developers | Page 1

thick mossBOT Nov 15, 2023, 9:35 PM

#

Hello! We'll be with you shortly. Below are links to other discussions we've had with you in the past week in case you want to review that information. If your question is related to one of these previous discussions, please provide a comprehensive summary of the current state and what you need help with now. We help many users simultaneously, so a summary allows us to resolve your issue as soon as possible.

ryon-reactnative-savedcards, 1 day ago, 90 messages

ashen juniper Nov 15, 2023, 9:39 PM

#

Hey there, is this happening with all payments or this specific test card or what other cases?

#

Are there any errors logged that you can share?

wise yarrow Nov 15, 2023, 9:41 PM

#

Only test cards that fail. Before we go further I got to thinking after I submitted my request for help. Let me try something server side first

ashen juniper Nov 15, 2023, 9:45 PM

#

Alright, sure -- I was going to also ask for details of your integration here. Once you poke at things, share how you're initializing the Payment Sheet and confirming the payment (plus any of the relevant server code you mentioned).

thick mossBOT Nov 15, 2023, 9:47 PM

#

safe marsh Nov 15, 2023, 9:49 PM

#

ryon-reactnative-googlepay

wise yarrow Nov 15, 2023, 10:03 PM

#

I have found exactly where the error is but I am not sure how to stop the payment sheet processing. Here is my code. Look at the last IF block where I attempt to handle a situation where a intentID was not returned from the server (indicating an error of sorts). I show the message in a toast to the user. Code: https://pastebin.com/m44S1Rqd

safe marsh Nov 15, 2023, 10:06 PM

#

I don't really understand the question I'm sorry. Why aren't you checking before calling initPaymentSheet?

wise yarrow Nov 15, 2023, 10:10 PM

#

I am using this method https://stripe.com/docs/payments/accept-a-payment-deferred

safe marsh Nov 15, 2023, 10:10 PM

#

But that doesn't require an intentId at all

#

Like our code there does const { error } = await initPaymentSheet({

#

I must be misunderstanding something in your setup. Why do you call initPaymentSheet twice?

wise yarrow Nov 15, 2023, 10:12 PM

#

I only called it once. And I didnt pass an intentID. Maybe I showed wrong code?

safe marsh Nov 15, 2023, 10:12 PM

#

I don't know you sahred almost 200 lines of code and asked me to look at the last if

#

    let { intentID, intentSecret, message } = await initPaymentIntent(``` I don't understand what this means

#

Which part of our doc are you following that gives you this? There are like sub tabs of sub tabs so maybe you didn't link to the correct place in the docs?

wise yarrow Nov 15, 2023, 10:15 PM

#

Ahhh. Sorry about that. Actually that is a server call to setup the payment intent. From the sever I get the intentID and intent Secret.

I later pass the intent secret to
intentCreationCallback({ clientSecret: intentSecret });

safe marsh Nov 15, 2023, 10:17 PM

#

Ah my bad the name is just so close

#

So I don't really understand your question overall I'm sorry

wise yarrow Nov 15, 2023, 10:18 PM

#

My fault bad naming conventions.
uhh... In a case where the card is declined. The payment sheet is stuck on processing. I am not sure if need to do some manual call to cancel the process or...

#

Maybe I need to pass in an error? Just saw this https://stripe.dev/stripe-react-native/api-reference/modules/PaymentSheet.html#IntentCreationCallbackParams
IntentCreationCallbackParams
IntentCreationCallbackParams: { clientSecret: string; error?: never } | { clientSecret?: never; error: IntentCreationError }

#

Dangit
// Call the intentCreationCallback with the client secret or error
intentCreationCallback({clientSecret})

It said so in the docs

safe marsh Nov 15, 2023, 10:22 PM

#

looking

wise yarrow Nov 15, 2023, 10:23 PM

#

Check the https://stripe.com/docs/payments/accept-a-payment-deferred?platform=react-native&type=payment#initialize-paymentsheet. The last section. It said return client secret or error. I didn't read

safe marsh Nov 15, 2023, 10:23 PM

#

to be fair it's so hard to notice

#

I don't get why we don't have a clear example of handleConfirmation()

wise yarrow Nov 15, 2023, 10:25 PM

#

Yeah. It would be good to show the cases. One look at it and I thought it only took an intent secret.
I think when error is passed the lib will handle it and stop the process. Let me try it now

#

I did this and it crashed intentCreationCallback({ error: message });
Isn't that how its done?

past siren Nov 15, 2023, 10:36 PM

#

👋 hopping in here to take a look as well - where are you pulling message from? What type is it?

safe marsh Nov 15, 2023, 10:37 PM

#

it's a string from their own call to their server

#

@wise yarrow can you share the code for initPaymentIntent?

wise yarrow Nov 15, 2023, 10:39 PM

#

Message is what is returned from our server when the payment was declined. This specific one is "Your card was declined."

#

Code for initPaymentIntent - https://pastebin.com/eSdVkW44

past siren Nov 15, 2023, 10:48 PM

#

You mentioned that it crashed - were you able to see what was in the logs? I'm guessing it's failing because you're passing in a string instead of an IntentCreationError type for message

wise yarrow Nov 15, 2023, 10:49 PM

#

Yeah I figure but how do i structire a IntentCreationError message?

ERROR Your app just crashed. See the error below.
com.facebook.react.bridge.UnexpectedNativeTypeException: Value for error cannot be cast from String to ReadableNativeMap
com.facebook.react.bridge.ReadableNativeMap.checkInstance(ReadableNativeMap.java:143)
com.facebook.react.bridge.ReadableNativeMap.getNullableValue(ReadableNativeMap.java:131)
com.facebook.react.bridge.ReadableNativeMap.getMap(ReadableNativeMap.java:175)
com.facebook.react.bridge.ReadableNativeMap.getMap(ReadableNativeMap.java:23)
com.reactnativestripesdk.PaymentSheetFragment$onViewCreated$createIntentCallback$1.onCreateIntent(PaymentSheetFragment.kt:151)
com.reactnativestripesdk.PaymentSheetFragment$onViewCreated$createIntentCallback$1$onCreateIntent$1.invokeSuspend(Unknown Source:16)
kotlin.coroutines.jvm.internal.BaseContinuationImpl.resumeWith(ContinuationImpl.kt:33)
kotlinx.coroutines.DispatchedTask.run(DispatchedTask.kt:106)
android.os.Handler.handleCallback(Handler.java:942)
android.os.Handler.dispatchMessage(Handler.java:99)
android.os.Looper.loopOnce(Looper.java:226)
android.os.Looper.loop(Looper.java:313)
android.app.ActivityThread.main(ActivityThread.java:8762)
java.lang.reflect.Method.invoke(Native Method)
com.android.internal.os.RuntimeInit$MethodAndArgsCaller.run(RuntimeInit.java:604)
com.android.internal.os.ZygoteInit.main(ZygoteInit.java:1067)

past siren Nov 15, 2023, 10:54 PM

#

I don't have a react native integration handy with me right now, but I think it'd be something like this?

intentCreationCallback({ error: {code:'Failed', message: message} });

wise yarrow Nov 15, 2023, 10:56 PM

#

Testing

#

It seems to work. The error message does not appear though. It just shows "Something went wrong"

past siren Nov 15, 2023, 11:01 PM

#

Hmm... Do you still get the same behavior if you try and hardcode a string for message?

wise yarrow Nov 15, 2023, 11:03 PM

#

I think I know what to do.
It takes these params
export interface StripeError<T> {
code: T;
message: string;
localizedMessage?: string;
declineCode?: string;
stripeErrorCode?: string;
type?: ErrorType;
}

I console logged the full error response from stripe on the server and I see all these. I am going to forward all these parameters and use them in the app and see if it reads better. Will update

#

#

Anyidea what this one would be? stripeErrorCode

past siren Nov 15, 2023, 11:11 PM

#

I believe it's the code (so from the screenshot it'd be card_declined)

wise yarrow Nov 15, 2023, 11:11 PM

#

So declineCode and stripeErrorCode would be same thing hmm

past siren Nov 15, 2023, 11:12 PM

#

They're different in the screenshot right? the declineCode is generic_decline and the stripeErrorCode would be card_declined?

wise yarrow Nov 15, 2023, 11:13 PM

#

Shux... I saw it and went on to say something else. sorry

past siren Nov 15, 2023, 11:13 PM

#

no worries!

wise yarrow Nov 15, 2023, 11:15 PM

#

My server response now looks like this
{
code: 'card_declined',
message: 'Your card was declined.',
localizedMessage: 'Your card was declined.',
declineCode: 'generic_decline',
stripeErrorCode: 'card_declined',
type: 'StripeCardError'
}

code and stripeErrorCode is the same

past siren Nov 15, 2023, 11:18 PM

#

OH! Sorry I think I led you astray a bit (we have code multiple places and they mean different things so it got a bit mixed up). The code you get from your server response should be used as the stripeErrorCode when you're constructing StripeError, but the StripeError.code should be Failed (I believe this is necesary to match the IntentCreationError type (https://github.com/stripe/stripe-react-native/blob/e1fb2b57a520150b4297764dfaad9a8396e507da/src/types/PaymentSheet.ts#L315)
So you likely want this:

{
  code: 'Failed',
  message: 'Your card was declined.',
  localizedMessage: 'Your card was declined.',
  declineCode: 'generic_decline',
  stripeErrorCode: 'card_declined',
  type: 'StripeCardError'
}

wise yarrow Nov 15, 2023, 11:21 PM

#

Thank you. testing

#

I think that works. Shows "Your card was declined in tiny red text" Ill see if I can make that more prominent
https://i.is.cc/1AYSNeZ.jpg

Pasteboard — Uploaded Image

Super simple and lightning fast image sharing. Upload clipboard images with Copy & Paste and image files with Drag & Drop

past siren Nov 15, 2023, 11:26 PM

#

yay! Glad you were able to get it working!

wise yarrow Nov 15, 2023, 11:42 PM

#

Yeah! Thank you very much. I recommend editing the docs so its a little easier to understand the usage.

past siren Nov 15, 2023, 11:42 PM

#

Totally agree! I had recently struggled to get this working with our iOS sdk and the docs were pretty much the same there and hard to follow

#

I'll flag to some folks internally to improve it

wise yarrow Nov 15, 2023, 11:45 PM

#

Ah. That reminds me I should test this on iOS, the lib been action funny over there.
Thanks again Karbi have a great evening

#ryon-reactnative-googlepay