Type 'void' is not assignable to type 'Promise<any>'. on authorizeOnServer example

[tebantebanteban]

Hi!, using copy paste for example of authorizeOnServer, console return

Type '(approveData: IOnApproveCallbackData) => void' is not assignable to type '(data: IOnApproveCallbackData, actions: any) => Promise<any>'.
  Type 'void' is not assignable to type 'Promise<any>'.

what is wrong?

Regards!

[Enngage]

Can you elaborate? This is basically a warning that you are not returning promise.

[tebantebanteban]

I can't compile, when I run "ng build, process crashes,

[Enngage]

Thats not really helpful. You should return a Promise in the authorizeOnServer - are you returning it? There may be missing return keyword in the example I have, but make sure you do return Promise in your code.

[tebantebanteban]

Sorry!, in the example

this.payPalConfig = {
            clientId: 'sb',
            // for creating orders (transactions) on server see
            // https://developer.paypal.com/docs/checkout/reference/server-integration/set-up-transaction/
            createOrderOnServer: (data) => fetch('/my-server/create-paypal-transaction')
                .then((res) => res.json())
                .then((order) => data.orderID),
            authorizeOnServer: (approveData) => {
                fetch('/my-server/authorize-paypal-transaction', {
                    body: JSON.stringify({
                    orderID: approveData.orderID
                    })
                }).then((res) => {
                    return res.json();
                }).then((details) => {
                    alert('Authorization created for ' + details.payer_given_name);
                });
            },
            onCancel: (data, actions) => {
                console.log('OnCancel', data, actions);
                this.showCancel = true;
            },
            onError: err => {
                console.log('OnError', err);
                this.showError = true;
            },
            onClick: () => {
                console.log('onClick');
                this.resetStatus();
            },
        };

My code

this.payPalConfig = {
            currency: 'USD',
            clientId: 'XXX',
            createOrderOnServer: (data) => fetch(this.sg['API']+'/Checkout', {method: 'post', 
                                                                              headers: {
                                                                                  'content-type': 'application/json'
                                                                                },
                                                                              body : JSON.stringify({ "products" : this.products,
                                                                                                   "checkoutForm" : checkoutForm,
                                                                                                   "hotelForm" : this.HotelDataForm.value,
                                                                                                   "dolar" : this.sg['appInfo'].dolar,
                                                                                                   "totalPesos" : this.sg['cartTotal'],
                                                                                                   "totalDolares" : this.sg['cartTotalDolar']
                                                                                                 })
                                                                             }
                                                )
               .then((res) => res.json())
               .then((order) => order.orderID),

            authorizeOnServer: (approveData) => {

                fetch(this.sg['API']+'/Checkout/result/paypal/'+approveData.orderID, {
                    method: 'post', 
                    headers: {
                      'content-type': 'application/json'
                    },
                    body: JSON.stringify({
                            orderID: approveData.orderID
                          }) 
                }).then((res) => {
                    return res.json();
                }).then((details) => {
                    this.zone.run(() => {

                        this.router.navigate(['/checkout-result/'+details.id], { relativeTo: this.route.parent });
                    });

                });
            },
            onCancel: (data, actions) => {
                this.notificationBarService.create({ message: 'Cancelaste la transacción.', type: NotificationType.Warning});
                console.log('OnCancel', data, actions);
            },
            onError: err => {
                this.notificationBarService.create({ message: 'Ocurrió un error en el pago con PAYPAL. intenta nuevamente..', type: NotificationType.Error});
                console.log('OnError', err);
            },
            onClick: () => { 
                console.log('onClick');
            },
        };

I don't see the difference, what I missing?

Thanks you!

[tebantebanteban]

Finally, I've modify example :

this.payPalConfig = {
            currency: 'USD',
            clientId: 'XXXX',
            createOrderOnServer: (data) => fetch(this.sg['API']+'/Checkout', {method: 'post', 
                                                                              headers: {
                                                                                  'content-type': 'application/json'
                                                                                },
                                                                              body : JSON.stringify({ "products" : this.products,
                                                                                                   "checkoutForm" : checkoutForm,
                                                                                                   "hotelForm" : this.HotelDataForm.value,
                                                                                                   "dolar" : this.sg['appInfo'].dolar,
                                                                                                   "totalPesos" : this.sg['cartTotal'],
                                                                                                   "totalDolares" : this.sg['cartTotalDolar']
                                                                                                 })
                                                                             }
                                                )
               .then((res) => res.json())
               .then((order) => order.orderID),

            authorizeOnServer: (approveData) => 

                fetch(this.sg['API']+'/Checkout/result/paypal/'+approveData.orderID, {
                    method: 'post', 
                    headers: {
                      'content-type': 'application/json'
                    },
                    body: JSON.stringify({
                            orderID: approveData.orderID
                          }) 
                }).then((res) => {
                    return res.json();
                }).then((details) => {
                    this.zone.run(() => {/* my code here */
                        this.router.navigate(['/checkout-result/'+details.id], { relativeTo: this.route.parent });
                    });

                })
            ,
            onApprove: (data, actions) => {
                console.log("APROBED", data)
            },
            onCancel: (data, actions) => {
                this.notificationBarService.create({ message: 'Cancelaste la transacción.', type: NotificationType.Warning});
                console.log('OnCancel', data, actions);
            },
            onError: err => {
                this.notificationBarService.create({ message: 'Ocurrió un error en el pago con PAYPAL. intenta nuevamente..', type: NotificationType.Error});
                console.log('OnError', err);
            },
            onClick: () => { 
                console.log('onClick');
            },
        };

• Delete {} FROM authorizeOnServer
• Add onApprove

And error disappear.

Thanks ;).