Most components have specific properties that are returned on success. See the respective docs for the specific types. For errors though, we provide a generic error type which allows you to provide a generic error handler if you want.

PaperSDKError

The PaperSDKError object has a code enum field which provides a user-facing error message. You can choose to directly show the user this message or check for these error codes and provide your own logic (e.g. localized strings, redirect the user to another page). The object also contains an error field that passes along the full Javascript error that was encountered for debugging purposes.

export type PaperSDKError {
  code: PaperSDKErrorCode;
  error: Error;
}

export enum PaperSDKErrorCode {
  UserLoginFailed = 'User login failed',
  InvalidProps = 'The props you passed in to this component are not valid.',
  InvalidCard = 'The card information is invalid. Please double check that the Card, CVC, and Zip code are all correct.',
  EmailNotVerified = 'The email was unable to be verified.',
  NotEnoughSupply = 'There is not enough supply to claim.',
  AddressNotAllowed = 'This address is not on the allowlist.',
  NoActiveClaimPhase = 'There is no active claim phase at the moment.',
}

Example of redirecting the buyer to another page when the sale has ended:

<PayWithCard
  ...
  onError={(error: PaperSDKError) => {
    switch (error) {
      case PaperSDKErrorCode.NotEnoughSupply:
      case PaperSDKErrorCode.NoActiveClaimPhase:
        window.location.href = '/sale-ended';
        break;
      default:
        setMessage(`Something went wrong! ${error}`);
    }
  }}
/>