hassan_code

[cunning anvil]

👋 Welcome to your new thread!

⏲️ We'll be here soon! Typically we respond in a few minutes, but sometimes we might take a bit longer if the server is busy or if you have a particularly tricky question.

⏱️ We close idle threads, which makes them read-only. Once a thread is closed it won't be reopened, but you can always start a new thread if you have another question.

🔗 This thread will always be available, even after it's closed. You can find it again using Discord's search, or you can save this link: https://discord.com/channels/841573134531821608/1376897335459708979

📝 Have more to share? Add more details, code, screenshots, videos, etc. below.

[fallow sable]

👋 happy to help

[dense widget]

const applePayParams =
Platform.OS === "ios"
? {
merchantCountryCode: "US",
cartItems: [
{
label:
interval === "month"
? "Mealtyme Monthly Subscription"
: "Mealtyme Annual Subscription",
amount: interval === "month" ? "9.99" : "99.99",
paymentType: "Recurring" as const,
intervalUnit: (interval === "month" ? "month" : "year") as
| "month"
| "year",
intervalCount: 1,
},
],

        }
      : undefined;

const googlePayParams =
Platform.OS === "android"
? {
merchantCountryCode: "US",
currencyCode: "USD",
testEnv: DEV,
label:
interval === "month"
? "Monthly Subscription"
: "Annual Subscription",
amount: interval === "month" ? "9.99" : "99.99",

        }
      : undefined;

const { error: initError } = await initPaymentSheet({
merchantDisplayName: "Mealtyme",
customerId: customer,
customerEphemeralKeySecret: ephemeralKey,
setupIntentClientSecret: setupIntent,
allowsDelayedPaymentMethods: false,
defaultBillingDetails: { email: customerEmail },
applePay: applePayParams,
googlePay: googlePayParams,
appearance: {
colors: {
primary: "#3A83F1",
background: "#FFFFFF",
componentBackground: "#F3F8FF",
componentBorder: "#C1D9FA",
componentDivider: "#E3EFFF",
primaryText: "#1A1A1A",
secondaryText: "#7A7A7A",
placeholderText: "#AAAAAA",
},
},

    paymentMethodOrder: ["card", "apple_pay", "google_pay"],
  });

[fallow sable]

you don't need to check on the Platform to be honest

you can pass both params regardless

[dense widget]

but still the issue is that they dont show up on expo live mobile app

class CreateInitialPaymentIntentView(APIView):
permission_classes = [IsAuthenticated]

def post(self, request):
    try:
        user = request.user
        email = user.email
        full_name = f"{user.first_name} {user.last_name}".strip() or user.username
        customers = stripe.Customer.list(email=email).data
        if customers:
            customer = customers[0]
        else:
            customer = stripe.Customer.create(
                email=email, name=full_name, metadata={"user_id": str(user.id)}
            )
        ephemeral_key = stripe.EphemeralKey.create(
            customer=customer.id,
            stripe_version="2023-10-16",
        )
        setup_intent = stripe.SetupIntent.create(
            customer=customer.id,
            payment_method_types=["card"],
        )
        return Response(
            {
                "setupIntent": setup_intent.client_secret,
                "ephemeralKey": ephemeral_key.secret,
                "customer": customer.id,
            },
            status=status.HTTP_200_OK,
        )

    except Exception as e:
        print(f"[ERROR] Exception occurred: {str(e)}")
        return Response({"error": str(e)}, status=status.HTTP_400_BAD_REQUEST)

my setup code

<StripeProvider
publishableKey="pk_live_"
merchantIdentifier="myidentifier"

in main app layout i have also passed this

[gaunt crown]

Hi there 👋 apologies for the delay. I'm jumping in to lend a hand.

Have you had a chance to review our official sample and try to run it first ?
https://github.com/stripe/stripe-react-native/tree/master/example

When I create a checkout session using stripe both payments do show up. But mt expo react nantive app doen't show these options (more detail in thread). May I know what I'm doing wrong?
Are you testing on the same device here ?

[dense widget]

i didnt add anything to my app.json

do i need to pass any additional parameters?

"ios": {
"supportsTablet": true,
"bundleIdentifier": "com.mealtyme.app",
"buildNumber": "7",
"entitlements": {
"com.apple.developer.applesignin": ["Default"],
"aps-environment": "production"
},
"infoPlist": {
"CFBundleURLTypes": [
{
"CFBundleURLSchemes": [
"com.xxxxx"
]
},
{
"CFBundleURLSchemes": [
"com.xxxx"
]
}
],
"ITSAppUsesNonExemptEncryption": false,
"NSCameraUsageDescription": "Stripe might need access camera to scan credit cards and make payments securely.",
"NSUserTrackingUsageDescription": "Allow notifications",
"NSPhotoLibraryUsageDescription": "We need access to your photos to allow you to upload profile pictures and share images in the app.",
"UIBackgroundModes": ["remote-notification"]
}
},

"android": {
"package": "com.xxxx",
"versionCode": 15,
"googleServicesFile": "./google-services.json",
"adaptiveIcon": {
"foregroundImage": "./assets/images/android-icon-2.png",
"backgroundColor": "#ffffff"
}
},

these are my ios and android sections in my app.json

[potent fossil]

There are extra steps to enable each wallet in your app, yes.

For Apple Pay, you need to get a certificate tied to your merchant ID and add that to xcode: https://docs.stripe.com/payments/mobile/accept-payment?platform=react-native&type=payment#ios-apple-pay

For Google Pay, you need to enable the wallet API in your manifest: https://docs.stripe.com/payments/mobile/accept-payment?platform=react-native&type=payment#android-google-pay

[dense widget]

thanks just to confirm my development team is using expo rather than react-native are the steps same?

[potent fossil]

As far as i know you need to do the same things, yes

[dense widget]

my team is just adding the desired values in app.json to test

can we keep the thread open till then