Payment gets dedudcted but it doesnt call success function in onApprove when user clicks somewhere

[bipindubey-technoark]

I am implented react-paypal-button-v2 in my project and it is working fine till yesterday.
It is live from last 3 months but i get a issue from client that one of the user gets charged the money but the record is not saved on database. after doing R&D on it i found that this package calls capture() then it deducts the money but when i close the modal by clicking on somewhere outside the modal then it didnt call the onsuccess method which we call for storing transaction details in our detabase.
This is the code

<PayPalButton
			createOrder={(data, actions) => {
				return actions.order.create({
					purchase_units: [
						{
							amount: {
								currency_code: 'USD',
								value: amount,
							},
							description: description ? description : '',
						},
					],
					application_context: {
						shipping_preference: 'NO_SHIPPING', // default is "GET_FROM_FILE"
					},
				});
			}}
			onApprove={(data, actions) => {
				// Capture the funds from the transaction
				return actions.order.capture().then(function (details) {
					onSuccess(data, details);
					
				});
			}}

Here onSuccess(data,details) is to save transaction in my local database but it is not even called .
Thanks

[bipindubey-technoark]

I have noticed one thing it calls capture() but what if capture () is still pending and then we close the modal then it doesnt call the api which will save record in database

[bipindubey-technoark]

[bipindubey-technoark]

Can i disable background till the payment is completed or failed??