Closed davedbase closed 3 years ago
Hi @davedbase 👋 ,
Are you posting this issue in the correct repo? Based on your configuration, it looks like you're trying to use the (newer) https://github.com/stripe/react-stripe-js, but this is the legacy repo.
Assuming you are actually using @stripe/react-stripe-js, your <Elements />
component needs to pass locale
as part of the options
prop (https://stripe.com/docs/stripe-js/react#elements-provider).
So, your example would change to: <Elements key={language} options={{locale: "fr"}} stripe={stripePromise}>
It would also be worth ensuring this component does not mount/unmount more than once in the lifetime of a session, as loadStripe
would be triggered multiple times. It may be worth moving this call to a top-level export, or initiated within a route handler and imported here, etc.
Yes, if you hadn't made it obvious that the value exists in options, I doubt I would have found a viable solution. The other conditions you mentioned aren't a concern. I didn't at any point recognise the legacy vs current release versions. I suppose I was reading the docs and getting confused by this repo version. It should maybe be made a bit clearer? It's possible that I made an error on this as well, I suppose it just wasn't obvious.
Thank you!
Summary
I cannot seem to change the locale of my elements. Here's a basic sample of my reproduction. When I run the app it always displays English even though I'd expect French.
Other information
What's strange is that Typescript also complains about that locale doesn't exist on ElementProps. I'm using ts-ignore to supress the warning:
I believe I'm following examples and documentation correctly. Does anyone have a workaround? This is rather critical for our application. Removing the hooks would be a pretty big set back for us.