PayPal React Integration not creating transaction

Question

I'm trying to integrate with PayPal checkout using the react library (@paypal/react-paypal-js), the response of the payment is successful, but when I use the live client id it doesn't bill from my credit card.

import { api } from "../services/api";
import { PayPalButtons, PayPalScriptProvider } from "@paypal/react-paypal-js";


export default function Pagamento() {

  function createOrder(data, actions) {
    return actions.order.create({
      intent: "CAPTURE",
      purchase_units: [
        {
          amount: {
            value: "2.00",
          },
        },
      ],
    });
  }

  function onApprove(data, actions) {
    console.log(data);
    const paymentID = data.paymentID;
    const orderID = data.orderID;
    const payerID = data.payerID;

    api
      .get("update_pacientes", {
        params: {
          username: username,
          column: "status",
          paymentID: paymentID,
          orderID: orderID,
          payerID: payerID,
        },
      })
      .then((response) => {
        console.log(response);
        // , location.reload();
      });
  }


  return (
    <div id="pagamento_wrapper">
      
        <PayPalScriptProvider
          options={{
            "client-id": OMMITED FOR SECURITY REASONS
             ,
            currency: "BRL",
          }}
        >
          <PayPalButtons
            style={{ color: "blue", shape: "pill", label: "pay", height: 40 }}
            createOrder={(data, actions) => createOrder(data, actions)}
            onApprove={(data, actions) => onApprove(data, actions)}
          />
        </PayPalScriptProvider>
      </div>
    </div>
  );
}

Answer 1

Your onApprove function is not capturing the order after the payer approves it, so there is no PayPal transaction created.

Since from inside createOrder you used actions.order.create to create on the client side, you should also capture on the client side via actions.order.capture (from inside onApprove )