let PayPalButton = paypal.Button.driver('react', {
    React,
    ReactDOM
});

function getPayPalObject(amount, pkg, minutes, data = 0) {
    class PayPayMain extends React.Component {
        constructor() {
            super();
            this.state = {
                env: 'production',
                client: {
                    sandbox: 'AdCF1QxvmKbvSsbZl058d6mjCKRpirgjpzE8Ahckhl8-JOxE1hsWuP0nTNwkqMYwE2fsRQ5y0rVcNzxu',
                    production: 'AfdtzsdaKlWk9_fAAtA94cijtec2D22LStaqUwp9axTFeSHkEYXEglZi8sLtHwgkPa8N0ZUgqMV13sEm'
                },
                style: {
                    size: 'small',
                    color: 'blue',
                    shape: 'pill',
                    label: 'pay',
                    tagline: 'true',
                    fundingicons: 'true'
                },
                commit: true
            };
        }
        payment(data, actions) {
            return actions.payment.create({
                transactions: [{
                    amount: {
                        total: amount,
                        currency: 'GBP'
                    }
                }]
            });
        }
        onAuthorize(data, actions) {
            return actions.payment.execute().then(function (paymentData) {
                // Show a success page to the buyer
                    var order = JSON.parse(localStorage.getItem('shoppingCart'));
                    $.ajax({
                        type: "POST",
                        url: "checkout_process.php",
                        data: {
                           'submit': 'true',
                           'fname': $("#fname").val(),
                           'lname': $("#lname").val(),
                           'email': $("#email").val(),
                           'phone': $("#phone").val(),
                           'hnumuber': $("#hnumuber").val(),
                           'addr1': $("#addr1").val(),
                           'addr2': $("#addr2").val(),
                           'postcode': $("#postcode").val(),
                           'order' : order
                        },
                        success: function (result) {
                            console.log(result);
                            if(result == "success"){
                                swal("Thank you!", "Your payment has been processed successfully.", "success");
                                shoppingCart.clearCart();
                            }
                            else
                                swal("Alert!", "Your payment has been processed. But record was not added due to technical issue. Please contact the admin to process your order.", "warning");
                        }
                    });
                });
        }
        render() {
            return (
                React.createElement(PayPalButton, {
                    commit: this.state.commit,
                    env: this.state.env,
                    client: this.state.client,
                    style: this.state.style,
                    payment: (data, actions) => this.payment(data, actions),
                    onAuthorize: (data, actions) => this.onAuthorize(data, actions),
                    onCancel: (data) => {
                        console.log("Cancelled");
                        swal("Payment Cancelled", "You have cancelled the payment.", "error");
                    },
                    onError: (err) => {
                        swal("Error", "Sorry your payment couldn't be processed please try again.", "error");
                    }
                }));

        }
    }
    return PayPayMain;
}
var amount = shoppingCart.totalCart() + 2.20;
amount = amount.toFixed(2);
ReactDOM.render(React.createElement(getPayPalObject(amount, "Dummy", "123123"), null), document.querySelector('#page'));