Reactjs – React Js ad Node Js stripe payment is becoming incomplete at stripe dashboard

Well, I just solved it finally. Latest stripe is way to secured and old methods in other tuts not work cause it sends require_action in backend after paymentIntents. So, we add another mode at frontend react js name @stripe/stripe-js.And add just few lines. At backend inside /payment (I used /mycardpay) rout :

 const customer = await Stripe.customers.create({
                email: token.email, // Use the email from the token
                source: token.id, // Use the token ID as the payment method source
              });

            
            const paymentIntent = await Stripe.paymentIntents.create({
                amount: amount, // Amount in cents
                currency: 'inr',
                payment_method_types: ['card'],
                payment_method: token.card.id, // Use the card ID from the token's card object
                customer: customer.id, 
                confirm: true,
                   
            })



            if (paymentIntent.status === 'requires_action') {
                // Return client_secret and requires_action to the frontend
                console.log('1')
                return res.status(200).json({
                    requires_action: true,
                    client_secret: paymentIntent.client_secret,
                    payment_method: paymentIntent.payment_method,
                });
            } else if (paymentIntent.status === 'succeeded') {
                console.log('2')
                return res.status(200).json({
                    message: 'Success',
                });
            } else {
                // Handle other paymentIntent statuses
                console.log('3')
                return res.status(500).json({
                    message: 'Payment failed',
                });
            }
        

Than at Frontend we similiarly use react-js-checkout at start to start the payment.But, inside token={payNow} we add the process to handle require_action.

import { loadStripe } from '@stripe/stripe-js';
const payNow= async token=>{
                const stripePromise = loadStripe('pk_test_........');
                try{
                    const response = await axios({
                        url : `/mycardpay/${localStorage.getItem('slno')}`,
                        method : 'post',
                        data : {
                            amount : this.calculateTotalAmount(),
                            token,
                        }
                    });
        
                if (response.data.requires_action) {
                    console.log('1')
                    const { client_secret,  payment_method} = response.data;
                    const stripe = await stripePromise;
                    
                    // Handle the customer action using Stripe.js
                    const result = await stripe.confirmCardPayment(client_secret, {
                        payment_method: payment_method.id,
                    });
    
                    if (result.error) {
                        console.log('1')
                        // Handle any error during customer action
                        console.error(result.error);
                    } else {
                        console.log('2')
                        // Payment completed successfully
                        console.log('Payment successful:', result.paymentIntent);
                    }
                } else if (response.data.message === 'Success') {
                    console.log('3')
                    // Handle success without customer action
                    console.log('Payment successful:', response.data);
                }
    
            }catch(err){
                console.log(err)
            }
        }

And start the whole process with your method to call .

<StripeCheckout   
stripeKey="pk_Test......"  
label='Pay Now'  
name='Pay With Credit Card'  
billingAddress   
amount={this.calculateTotalAmount()*100}   
description={`Your Total Amount $${this.calculateTotalAmount()}`}  
token={payNow} 
/>

this.calculatetotalAmount() is just my function that calculate all product data cost it's nothing much.