PayPal module compilation error (SOLVED)


#1

Hi, I’m currently trying to integrate PayPal into my app (Ionic 4), but this particular module, PayPalPayment, keeps spitting out that:

ERROR in src/app/about/about.page.ts(30,21): error TS2554: Expected 0 arguments, but got 4.

“ionic serve” shows that the PayPal integration is working just fine with the error, but the error is what’s stopping me from building the PWA for Android. Can somebody help? I’ve attached my html and ts file below.

html file:

<ion-header>
  <ion-toolbar>
      <ion-buttons slot="start">
          <ion-menu-button></ion-menu-button>
        </ion-buttons>
    <ion-title>About Us</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content padding>
  <ion-card>
    <ion-item>
      <ion-icon name="information-circle-outline" slot="start"></ion-icon>
      <ion-label>Alam Shah Innovation Team</ion-label>
    </ion-item>

    <ion-card-content>
      An innovation team based in Sekolah Sultan Alam Shah to expand the imagination of it's members.
    </ion-card-content>

    <ion-card-content>
      This app develoment project was led by Nursi Naufal.
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-item>
      <ion-icon name="logo-usd" slot="start"></ion-icon>
      <ion-label>Donate!</ion-label>
      <ion-input placeholder="Amount" type="number" required="true" name="donateam"></ion-input>
      <ion-button fill="solid" size="default" size="small" slot="end" type="submit" (click)="DonReq()">Donate</ion-button>
    </ion-item>
  </ion-card>
</ion-content>

ts file:

import { Component, OnInit } from '@angular/core';
import { PayPal, PayPalPayment, PayPalConfiguration } from '@ionic-native/paypal/ngx';

@Component({
  selector: 'app-about',
  templateUrl: './about.page.html',
  styleUrls: ['./about.page.scss'],
})
export class AboutPage implements OnInit {

  donateam: '';

  constructor(private paypal: PayPal) { }

  ngOnInit() {
  }

  DonReq() {
    donateam: '';

    this.paypal.init({
      PayPalEnvironmentProduction: 'PAYPAL_ENVIRONMENT_ID_PRODUCTION',
      PayPalEnvironmentSandbox: 'PAYPAL_ENVIRONMENT_ID_SANDBOX'
    }).then(() => {
      // Environments: PayPalEnvironmentNoNetwork, PayPalEnvironmentSandbox, PayPalEnvironmentProduction
      this.paypal.prepareToRender('PayPalEnvironmentSandbox', new PayPalConfiguration({
      // Only needed if you get an "Internal Service Error" after PayPal login!
      //payPalShippingAddressOption: 2 // PayPalShippingAddressOptionPayPal
    })).then(() => {
      let payment = new PayPalPayment('3.33', 'USD', 'Description', 'sale');
      this.paypal.renderSinglePaymentUI(payment).then(() => {
        alert("Thank you for donating! Your payment id is ${response.response.id}");
        // Successfully paid

        // Example sandbox response
        //
        // {
        //   "client": {
        //     "environment": "sandbox",
        //     "product_name": "PayPal iOS SDK",
        //     "paypal_sdk_version": "2.16.0",
        //     "platform": "iOS"
        //   },
        //   "response_type": "payment",
        //   "response": {
        //     "id": "PAY-1AB23456CD789012EF34GHIJ",
        //     "state": "approved",
        //     "create_time": "2016-10-03T13:33:33Z",
        //     "intent": "sale"
        //   }
        // }
      }, () => {
        alert("Payment was not successful. Try again later.")
      });
    }, () => {
      alert("A configuration error has occurred. Please contact the developer.")
    });
  }, () => {
    alert("A initialization error has occurred. Please contact the developer.")
  });
  }

}

*I’ve removed my client IDs from the ts file in this post.

UPDATE: Apparently the constructor code in the module was not added to other classes such as PayPalPayment, PayPalItem etc.
I’ve added the line of code and it seems to work fine.

Before edit:

export declare class PayPalPayment {
    /**
     * The amount of the payment.
     */
    amount: string;
    /**
     * The ISO 4217 currency for the payment.
     */
    currency: string;
    /**
     * A short description of the payment.
     */
    shortDescription: string;
    /**
     * "Sale" for an immediate payment.
     */
    intent: string;
    /**
     * Optional Build Notation code ("BN code"), obtained from partnerprogram@paypal.com,
     * for your tracking purposes.
     */
    bnCode: string;
    /**
     * Optional invoice number, for your tracking purposes. (up to 256 characters)
     */
    invoiceNumber: string;
    /**
     * Optional text, for your tracking purposes. (up to 256 characters)
     */
    custom: string;
    /**
     * Optional text which will appear on the customer's credit card statement. (up to 22 characters)
     */
    softDescriptor: string;
    /**
     * Optional array of PayPalItem objects.
     */
    items: PayPalItem[];
    /**
     * Optional payee email, if your app is paying a third-party merchant.
     * The payee's email. It must be a valid PayPal email address.
     */
    payeeEmail: string;
    /**
     * Optional customer shipping address, if your app wishes to provide this to the SDK.
     */
    shippingAddress: string;
    /**
     * Optional PayPalPaymentDetails object
     */
    details: PayPalPaymentDetails;
}

After edit:

export declare class PayPalPayment {
    /**
     * The amount of the payment.
     */
    amount: string;
    /**
     * The ISO 4217 currency for the payment.
     */
    currency: string;
    /**
     * A short description of the payment.
     */
    shortDescription: string;
    /**
     * "Sale" for an immediate payment.
     */
    intent: string;
    /**
     * Optional Build Notation code ("BN code"), obtained from partnerprogram@paypal.com,
     * for your tracking purposes.
     */
    bnCode: string;
    /**
     * Optional invoice number, for your tracking purposes. (up to 256 characters)
     */
    invoiceNumber: string;
    /**
     * Optional text, for your tracking purposes. (up to 256 characters)
     */
    custom: string;
    /**
     * Optional text which will appear on the customer's credit card statement. (up to 22 characters)
     */
    softDescriptor: string;
    /**
     * Optional array of PayPalItem objects.
     */
    items: PayPalItem[];
    /**
     * Optional payee email, if your app is paying a third-party merchant.
     * The payee's email. It must be a valid PayPal email address.
     */
    payeeEmail: string;
    /**
     * Optional customer shipping address, if your app wishes to provide this to the SDK.
     */
    shippingAddress: string;
    /**
     * Optional PayPalPaymentDetails object
     */
    details: PayPalPaymentDetails;

    // Added For Arguments Support
    constructor(amount: string, currency: string, shortDescription: string, intent: string);
}