#riya-p_api

1 messages · Page 1 of 1 (latest)

tranquil wharfBOT
#

👋 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/1283705027210383362

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

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.

tulip quarry
#

Hello again @cobalt pasture 🤗

cobalt pasture
#

hi! do you have a lot more details like exact code you use to mount the PaymentElement and any PaymentIntent IDs?

tulip quarry
#

I need help regarding the Payment Element with iDEAL Payment Method Support. As the iDEAL Payment Method is already active and I'm testing it via VPN with the Netherlands country, but still it is not showing.

cobalt pasture
#

do you have a lot more details like exact code you use to mount the PaymentElement and any PaymentIntent IDs?

tulip quarry
cobalt pasture
#

of course

tulip quarry
#

Thank you.

#

Here is my code:
import {CSSProperties, FormEvent, FunctionComponent, useState} from 'react';

import {Elements} from '@stripe/react-stripe-js';
import {useStripe, PaymentElement} from '@stripe/react-stripe-js';
import {loadStripe, StripeElementsOptions} from '@stripe/stripe-js';

import {color, rgbaColor} from '../../assets/colors';

const stripePromise = loadStripe(
process.env.REACT_APP_STRIPE_PUBLISHABLE_KEY || '',
);

const Checkout: FunctionComponent = () => {
const options: StripeElementsOptions = {

mode: 'payment',
amount: 1099,
currency: 'usd',
// Fully customizable with appearance API.
appearance: {
  theme: 'flat',
  labels: 'floating',
  variables: {
    colorPrimary: '#0A74DA',
    colorBackground: '#F4F4F5',
    colorText: '#333',
  },
},

};

return (
<Elements stripe={stripePromise} options={options}>
<CheckoutForm />
</Elements>
);
};

const CheckoutForm: FunctionComponent = () => {
const stripe = useStripe();

const [isSuccess, setIsSuccess] = useState(false);
const [isProcessing, setIsProcessing] = useState(false);
const [isPaymentElementComplete, setIsPaymentElementComplete] =
useState(false);

const disabled =
!stripe || isProcessing || !isPaymentElementComplete || isSuccess;

const handlePaymentElementChange = (event: any) =>
setIsPaymentElementComplete(event.complete);

const handleSubmit = async (event: FormEvent) => {
event.preventDefault();
setIsProcessing(true); // Set loading state

setTimeout(() => {
  setIsProcessing(false);
  setIsSuccess(true); // Show success
}, 2000);

};

return (
<form onSubmit={handleSubmit} style={form}>
<PaymentElement
id="payment-element"
onChange={handlePaymentElementChange}
/>
</form>
);
};
export default Checkout;

cobalt pasture
#

currency:usd is not compatible with iDeal

tulip quarry
#

Okay, do I have to change with which currency to make it compatible?

#

Thank you very much...you saved my day...🥺