Checkout page blank before going to payment method url in react project

Hi I am developing an ecommerce site. here I suffer this problem:

1. Suppose I have an array of product I want to map over the array and hit an post api for all array of items. When all array of items will be post. then I will call another api for getting response.I want to call second api only if the array of elements posted to api.

here is my code :

1. I am showing all cart items in checkout page. when user want to pay online payment. I place an order and i am getting getway url. I have to clean the cart right? but when my cart cleared the checkout page appearing blank, afer some millisecond page redirect to the gateway URL. I want that after redirect cart will be cleared because if user see blank page it is not good UX.

```await getData(${REST_BASE_API_URL}/mobileapps/orders/${order_id}, {}, userToken()) .then(res => { let increment_id = res?.increment_id;

                                if (paymentMethod === 'sslcommerz') {
                                    // navigate('/order-success');
                                    let url = `anything`;
                                    getData(url, {}, userToken())
                                        .then(res => {
                                            window.location.href = res; //redirect to gateway url
                                            dispatch(saveUpdatedCart([])); //cart clear
                                            clearCartAfterOrder(); //set new cart id in redux
                                            console.log('ssl_res', res)
                                        })
                                        .catch(err => {
                                            console.log(err)
                                        })```