Paypal api – Error when capture Paypal authorized order

I’m trying to implement authorize and pay later flow for my Next.js 14 app, but I’m having few problems.

Client side, I have this:

export const PPButton: FC<PaypalButtonProps> = ({ amount }) => {
const [orderId, setOrderId] = useState<string>()
  const createOrder = (data: Record<string, unknown>, actions: any) => {
    return actions.order
      .create({
        intent: 'AUTHORIZE',
        purchase_units: [
          {
            amount: {
              value: amount,
            },
          }
        ]
      })
      .then((orderID: string) => {
        setOrderId(orderID)
        return orderID;
      })
      .catch((error: any) => {
        console.error('Error creating order:', error);
        toast.error('Error creating order');
      });
  }

  const onApprove = (data: any, actions: any) => {
    console.log('data', data);
    return actions.order.authorize().then((details: any) => {
      console.log('Authorization details:', details);
      toast.success('Payment authorized');
    }).catch((error: any) => {
      console.error('Error authorizing order:', error);
      toast.error('Error authorizing order');
    });
  }

  async function onCapture () {
    return fetch(`${process.env.NEXT_PUBLIC_HOST}/api/paypal/captureOrder`, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        orderId
      }),
    })
      .then((response) => response.json())
      .then((orderData) => {
        toast.success('Order paid successfully')
      })
  }

  return (
    <div>
      <PayPalScriptProvider options={{ intent: 'authorize', clientId: process.env.NEXT_PUBLIC_PAYPAL_CLIENT_ID!}}>
        <PayPalButtons
          createOrder={createOrder}
          onApprove={onApprove}
          /*  onError={this.onError}
            onClick={this.onClick}*/
        />
      </PayPalScriptProvider>
      <button onClick={onCapture}>Capture</button>
    </div>
  );
};

The route capture order calls this method:

    const accessToken = await generateAccessToken()
    // authorization id
    const url = `${base}/v2/payments/authorizations/${orderId}/capture`
    const response = await fetch(url, {
      method: 'post',
      headers: {
        'Content-Type': 'application/json',
        Authorization: `Bearer ${accessToken}`,
      },
      body: JSON.stringify({
        payment_instruction: {
          disbursement_mode: "INSTANT",
          platform_fees: [
            {
              amount: {
                currency_code: "EUR",
                value: "1000"
              }
            }
          ]
        }
      })
    })

    return handleResponse(response)
  },

The authorization is successfull but I’m not able to capture the payment that has been created and authorized even though I pass the orderID generated by paypal when create the order and authorize it.
The error is always:

0] Error in capturing the Paypal order Error: {"name":"RESOURCE_NOT_FOUND","message":"The specified resource does not exist.","debug_id":"*******","details":[{"issue":"INVALID_RESOURCE_ID","description":"Specified resource ID does not exist. Please check the resource ID and try again."}],"links":[{"href":"https://developer.paypal.com/docs/api/payments/v2/#error-INVALID_RESOURCE_ID","rel":"information_link"}]}

Anyone has a clue about a workaround? Basically whenever I try to call Paypal API by my BE I get errors.

I’ve tried to create a route to call Paypal API but without success, it seems it just works on the FE, someone has faced the same issue?