samstoppani

[tough notch]

Hello 👋
How can I help?

Hey @heady slate let's chat here

moving the code here

const publicKey = "pk_test_51LzTMADmoNegE5xxxxxxxxx"
const secretKey = "sk_test_51LzTMADmoNegE5xxxxxxxxx"

const stripePromise = loadStripe(publicKey)

const App = () => {

const options = {
clientSecret: secretKey,
};

return (
<Elements stripe={stripePromise} options={options}>
<RouterProvider router={router} />
</Elements>
)
}

[tough notch]

Can you delete the additional messages from the main channel and post the image here? 🙂
Would help us keep the channel clean and have all the context in this thread

thank you 🙂

[heady slate]

ofcourse, all done

[tough notch]

The error is expected as you're passing a secret key instead of an actual clientSecret

const options = {
clientSecret: secretKey,
};

Is there a guide you're following for this?

[heady slate]

okay cool, and yeah here's the guide

https://stripe.com/docs/stripe-js/react?locale=en-GB

where do i find the clientSecret?

[tough notch]

You'd create a PaymentIntent server-side and use its client_secret property to render elements

This page has step by step instructions 🙂
https://stripe.com/docs/payments/accept-a-payment?platform=web&ui=elements&client=react

You likely want to start with Step 3

[heady slate]

sweet cool i get it now, I'll give it a go

thanks!

[tough notch]

NP! 🙂 Good luck