@akinon/pz-masterpass-rest 1.111.0

package/src/services/payment.ts

@@ -0,0 +1,131 @@
+import { store } from 'redux/store';
+import {
+  DirectPaymentRequest,
+  DirectPaymentResponse,
+  MPResponse,
+  type PaymentProcessRequest
+} from '../types/payment.types';
+
+export interface PaymentResponse {
+  success: boolean;
+  data?: any;
+  error?: string;
+}
+
+export class PaymentService {
+  private get token(): string {
+    return store.getState().masterpassRest.token || '';
+  }
+
+  private get merchantId(): string {
+    return store.getState().masterpassRest.tokenData?.MerchantId || '';
+  }
+
+  constructor() {
+    this.initialize();
+  }
+
+  private initialize(): void {
+    window.Masterpass.setToken(this.token);
+    window.Masterpass.setMerchantId(this.merchantId);
+  }
+
+  async processPayment(
+    paymentData: PaymentProcessRequest
+  ): Promise<PaymentResponse> {
+    return new Promise((resolve) => {
+      try {
+        this.initialize();
+
+        window.Masterpass.paymentService.payment(
+          {
+            requestReferenceNo: paymentData.requestReferenceNo,
+            cvc: paymentData.cvc,
+            cardAlias: paymentData.cardAlias,
+            accountKey: paymentData.accountKey,
+            amount: paymentData.amount,
+            orderNo: paymentData.orderNo,
+            currencyCode: paymentData.currencyCode,
+            paymentType: paymentData.paymentType,
+            acquirerIcaNumber: paymentData.acquirerIcaNumber,
+            installmentCount: paymentData.installmentCount,
+            authenticationMethod: paymentData.authenticationMethod,
+            secure3DModel: paymentData.secure3DModel,
+            terminalGroupId: paymentData.terminalGroupId
+          },
+          (statusCode, response) => {
+            if (response && response.statusCode === 200) {
+              resolve({
+                success: true,
+                data: response
+              });
+            } else {
+              resolve({
+                success: false,
+                error: response?.description || 'Payment failed',
+                data: response
+              });
+            }
+          }
+        );
+      } catch (error) {
+        resolve({
+          success: false,
+          error: 'Payment service initialization failed'
+        });
+      }
+    });
+  }
+
+  async directPayment(
+    paymentData: DirectPaymentRequest
+  ): Promise<PaymentResponse> {
+    return new Promise((resolve) => {
+      try {
+        this.initialize();
+
+        window.Masterpass.paymentService.directPayment(
+          {
+            requestReferenceNo: paymentData.requestReferenceNo,
+            cvc: paymentData.cvc,
+            cardNumber: paymentData.cardNumber,
+            cardHolderName: paymentData.cardHolderName,
+            expiryDate: paymentData.expiryDate,
+            accountKey: paymentData.accountKey,
+            amount: paymentData.amount,
+            orderNo: paymentData.orderNo,
+            currencyCode: paymentData.currencyCode,
+            paymentType: paymentData.paymentType,
+            acquirerIcaNumber: paymentData.acquirerIcaNumber,
+            installmentCount: paymentData.installmentCount,
+            authenticationMethod: paymentData.authenticationMethod,
+            secure3DModel: paymentData.secure3DModel,
+            terminalGroupId: paymentData.terminalGroupId
+          },
+          (statusCode: number, response: MPResponse<DirectPaymentResponse>) => {
+            if (response && response.statusCode === 200) {
+              resolve({
+                success: true,
+                data: response
+              });
+            } else {
+              resolve({
+                success: false,
+                error:
+                  response?.result?.responseDescription ||
+                  response?.exception?.message ||
+                  'Direct payment failed',
+                data: response
+              });
+            }
+          }
+        );
+      } catch (error) {
+        resolve({
+          success: false,
+          error: 'Direct payment service initialization failed'
+        });
+      }
+    });
+  }
+}

package/src/services/verify.ts

@@ -0,0 +1,39 @@
+import { MPResponse } from '../types/payment.types';
+import { VerifyRequest, VerifyResponse } from '../types/verify.types';
+import { store } from 'redux/store';
+
+export class VerifyService {
+  private get token(): string {
+    return store.getState().masterpassRest.token || '';
+  }
+
+  private get merchantId(): string {
+    return store.getState().masterpassRest.tokenData?.MerchantId || '';
+  }
+
+  constructor() {
+    this.initialize();
+  }
+
+  private initialize(): void {
+    window.Masterpass.setToken(this.token);
+    window.Masterpass.setMerchantId(this.merchantId);
+  }
+
+  verifyOtp(request: VerifyRequest): Promise<MPResponse<VerifyResponse>> {
+    return new Promise((resolve, reject) => {
+      try {
+        this.initialize();
+
+        window.Masterpass.verifyService.verifyOtp(
+          request,
+          (statusCode, response) => {
+            resolve(response);
+          }
+        );
+      } catch (error) {
+        reject(error);
+      }
+    });
+  }
+}

package/src/types/account.types.ts

@@ -0,0 +1,179 @@
+export type AccountKeyType = 'Msisdn' | 'Email' | 'CardNumber';
+
+export interface AccountAccessRequest {
+  accountKey: string;
+  accountKeyType: AccountKeyType;
+  userId: string;
+}
+
+export interface ValidationError {
+  field: string;
+  message: string;
+  code: string;
+}
+
+interface ExceptionResponse {
+  level: string;
+  code: string;
+  message: string;
+  validationErrors: ValidationError[] | null;
+  details: any[] | null;
+  vposErrorCode: string | null;
+  vposErrorMessage: string | null;
+  retrievalReferenceNumber: string | null;
+  thirdPartyApiResponse: any | null;
+  acquirerIcaNumber: string | null;
+}
+
+export interface CardModel {
+  cardAlias: string;
+  cardState: 'Draft' | 'Activated' | 'Blocked' | 'Removed' | '';
+  maskedCardNumber: string;
+  uniqueCardNumber: string;
+  cardType: 'Credit' | 'Debit' | 'Unknown' | '';
+  productName: string;
+  cardBin: string;
+  cardIssuerIcaNumber: string;
+  cardValidationType: 'OTP' | 'RTA' | '_3D' | 'Unknown' | '';
+  isDefaultCard: boolean;
+  expireSoon: boolean;
+  isExpired: boolean;
+  isMasterpassMember: boolean;
+  isCardCreditOrSupportedDebit?: boolean;
+  isIssuerOtpSupported?: boolean;
+  eftCode?: string | null;
+  sourceMerchantId?: number;
+  sourceMerchantName?: string | null;
+  expireDate?: string | null;
+  systemEntryDatetime?: string | null;
+}
+
+export interface CardResponse {
+  accountKey: string;
+  accountState: string;
+  cards: CardModel[];
+  recipientCards?: any[] | null;
+}
+
+export interface LinkToMerchantResponse {
+  retrievalReferenceNumber: string;
+  responseCode: string;
+  description: string;
+  token: string;
+  cardIssuerName: string;
+  maskedPan: string;
+  url3D?: string;
+}
+
+export interface AccountAccessErrorResponse {
+  version: string | null;
+  buildId: string;
+  statusCode: number;
+  message: string;
+  correlationId: string | null;
+  requestId: string | null;
+  result: null;
+  exception: ExceptionResponse;
+}
+
+export interface AccountAccessSuccessResponse {
+  version: string | null;
+  buildId: string;
+  statusCode: number;
+  message: string;
+  correlationId: string | null;
+  requestId: string | null;
+  result: CardResponse;
+  exception: null;
+}
+
+export interface LinkToMerchantSuccessResponse {
+  version: string | null;
+  buildId: string;
+  statusCode: number;
+  message: string;
+  correlationId: string | null;
+  requestId: string | null;
+  result: LinkToMerchantResponse;
+  exception: null;
+}
+
+export type AccountAccessResponse =
+  | AccountAccessErrorResponse
+  | AccountAccessSuccessResponse;
+
+export type LinkToMerchantResponseType =
+  | AccountAccessErrorResponse
+  | LinkToMerchantSuccessResponse;
+
+export interface RemoveCardRequest {
+  accountKey: string;
+  cardAlias: string;
+}
+
+export interface RemoveCardResponse {
+  clientId: number;
+  refNo: string;
+}
+
+export interface RemoveCardServiceResponse {
+  version: string;
+  buildId: string;
+  statusCode: number;
+  message: string;
+  correlationId: string;
+  requestId: string;
+  result: RemoveCardResponse | null;
+  exception: ExceptionResponse | null;
+}
+
+export interface AddCardRequest {
+  requestReferenceNumber: string;
+  accountKey: string;
+  accountKeyType: AccountKeyType;
+  cardNumber: string;
+  cardHolderName: string;
+  expiryDate: string;
+  cvv: string;
+  accountAliasName: string;
+  userId: string;
+  isMsisdnValidatedByMerchant: boolean;
+  authenticationMethod: string;
+}
+
+export interface AddCard3DSecureResult {
+  retrievalReferenceNumber: string;
+  responseCode: string;
+  description: string;
+  token: string;
+  url3d: string;
+  url3dSuccess: string;
+  url3dFail: string;
+}
+
+export interface AddCardSuccessResponse {
+  version: string | null;
+  buildId: string;
+  statusCode: number;
+  message: string;
+  correlationId: string | null;
+  requestId: string | null;
+  result: CardResponse;
+  exception: null;
+}
+
+export interface AddCard3DSecureResponse {
+  version: string | null;
+  buildId: string;
+  statusCode: number;
+  message: string;
+  correlationId: string | null;
+  requestId: string | null;
+  result: AddCard3DSecureResult;
+  exception: null;
+}
+
+export type AddCardResponse =
+  | AccountAccessErrorResponse
+  | AddCardSuccessResponse
+  | AddCard3DSecureResponse;

package/src/types/custom-render.types.ts

@@ -0,0 +1,212 @@
+import { ReactElement } from 'react';
+import type { CreditCardFormData } from '../utils/validation-schemas';
+
+export type PaymentMethodSelectorProps = {
+  cards: any[];
+  selectedMethod: 'stored_card' | 'new_card';
+  onMethodChange: (method: 'stored_card' | 'new_card') => void;
+  texts: MasterpassRestOptionTexts;
+};
+
+export type CardListProps = {
+  cards: any[];
+  onCardSelect: (card: any) => Promise<void>;
+  selectedCard: any;
+  onRemove: (card: any) => void;
+  removingCardId: string | null;
+  cvc: string;
+  onCvcChange: (cvc: string) => void;
+  texts: MasterpassRestOptionTexts;
+};
+
+export type CreditCardFormProps = {
+  onSaveCard: (cardData: CreditCardFormData) => Promise<void>;
+  isLoading: boolean;
+  showSaveOption: boolean;
+  onBinChange: (bin: string) => Promise<void>;
+  texts: MasterpassRestOptionTexts;
+};
+
+export type InstallmentListProps = {
+  installments: any[];
+  cardType: string | null;
+  onInstallmentSelect: (installment: any) => Promise<void>;
+  selectedInstallment: any;
+  isLoading: boolean;
+  onProceedToPayment: () => Promise<void>;
+  paymentLoading: boolean;
+  requiresCvc: boolean;
+  cvc: string;
+  texts: MasterpassRestOptionTexts;
+};
+
+export type LinkModalProps = {
+  open: boolean;
+  onClose: () => void;
+  onConfirm: () => void;
+  texts: MasterpassRestOptionTexts;
+};
+
+export type OTPModalProps = {
+  open: boolean;
+  onClose: () => void;
+  onSubmit: (otp: string) => Promise<{ success: boolean; message?: string }>;
+  type: string;
+  description?: string;
+  texts: MasterpassRestOptionTexts;
+};
+
+export type ConfirmationModalProps = {
+  open: boolean;
+  onClose: () => void;
+  onConfirm: () => void;
+  title: string;
+  message: string;
+  confirmText: string;
+  cancelText: string;
+  isLoading: boolean;
+  loadingText: string;
+  texts: MasterpassRestOptionTexts;
+};
+
+export type ErrorDisplayProps = {
+  error: any;
+  onDismiss: () => void;
+  getErrorInfo: (error: any) => { message: string; type: string } | null;
+};
+
+export type LoadingStateProps = {
+  message: string;
+};
+
+export type EmptyStateProps = {
+  paymentMethod: 'stored_card' | 'new_card';
+  cardNumberLength: number;
+  isCheckoutLoading: boolean;
+};
+
+export type MasterpassRestOptionCustomRender = {
+  paymentMethodSelector?: (props: PaymentMethodSelectorProps) => ReactElement;
+  cardList?: (props: CardListProps) => ReactElement;
+  creditCardForm?: (props: CreditCardFormProps) => ReactElement;
+  installmentList?: (props: InstallmentListProps) => ReactElement;
+  linkModal?: (props: LinkModalProps) => ReactElement;
+  otpModal?: (props: OTPModalProps) => ReactElement;
+  confirmationModal?: (props: ConfirmationModalProps) => ReactElement;
+  errorDisplay?: (props: ErrorDisplayProps) => ReactElement;
+  loadingState?: (props: LoadingStateProps) => ReactElement;
+  emptyState?: (props: EmptyStateProps) => ReactElement;
+};
+
+export type MasterpassRestOptionTexts = {
+  title?: string;
+  newCardTitle?: string;
+  selectCardTitle?: string;
+  installmentOptionsTitle?: string;
+  enterCardDetailsTitle?: string;
+  loadingMessage?: string;
+  scriptLoadingMessage?: string;
+  selectCardMessage?: string;
+  enterCardMessage?: string;
+  enterCardSubMessage?: string;
+  enterDigitsMessage?: string;
+  noInstallmentMessage?: string;
+  loadingInstallmentMessage?: string;
+  removeCardTitle?: string;
+  removeCardMessage?: string;
+  removeCardConfirmText?: string;
+  removeCardCancelText?: string;
+  removeCardLoadingText?: string;
+  dismissButtonText?: string;
+  paymentErrorTitle?: string;
+  paymentErrorDefaultMessage?: string;
+
+  // Payment Method Selector
+  paymentMethodTitle?: string;
+  paymentMethodDescription?: string;
+  savedCardsText?: string;
+  savedCardsDescription?: string;
+  newCardText?: string;
+  newCardDescription?: string;
+  noPaymentMethodsText?: string;
+
+  // Error Messages
+  failedToSaveCardText?: string;
+  paymentFailedText?: string;
+  otpHandlerNotAvailableText?: string;
+  failedToSelectCardText?: string;
+  failedToSelectInstallmentText?: string;
+
+  // Validation Error Messages
+  cardNumberRequiredText?: string;
+  cardNumberInvalidText?: string;
+  expiryDateRequiredText?: string;
+  expiryDateInvalidText?: string;
+  expiryDateExpiredText?: string;
+  cvvRequiredText?: string;
+  cvvInvalidText?: string;
+  cardholderNameRequiredText?: string;
+  cardholderNameTooShortText?: string;
+  cardholderNameTooLongText?: string;
+  cardholderNameInvalidText?: string;
+  cardAliasRequiredText?: string;
+  cardAliasTooShortText?: string;
+  cardAliasTooLongText?: string;
+
+  creditCardInfoTitle?: string;
+  checkingCardText?: string;
+  cardNumberLabel?: string;
+  cardNumberPlaceholder?: string;
+  cardholderNameLabel?: string;
+  cardholderNamePlaceholder?: string;
+  expiryDateLabel?: string;
+  expiryDatePlaceholder?: string;
+  cvcLabel?: string;
+  cvcPlaceholder3?: string;
+  cvcPlaceholder4?: string;
+  saveCardLabel?: string;
+  cardAliasLabel?: string;
+  cardAliasPlaceholder?: string;
+  addCardButton?: string;
+  cancelButton?: string;
+  secureText?: string;
+  cvcHelpText?: string;
+  cvcFrontText?: string;
+  cvcBackText?: string;
+
+  defaultCardText?: string;
+  expiresSoonText?: string;
+  removeCardTitleText?: string;
+  cvcCardLabel?: string;
+  secureCardText?: string;
+  cvcCardHelpText?: string;
+
+  confirmText?: string;
+  cancelText?: string;
+  loadingText?: string;
+
+  installmentOptionsText?: string;
+  cardTypeLabel?: string;
+  singlePaymentText?: string;
+  installmentsText?: string;
+  noInterestText?: string;
+  perMonthText?: string;
+  proceedToPaymentText?: string;
+  processingPaymentText?: string;
+  cvcRequiredText?: string;
+
+  linkModalTitle?: string;
+  linkModalDescription?: string;
+  linkAccountButton?: string;
+  linkModalCancelButton?: string;
+
+  rtaVerificationTitle?: string;
+  cvvVerificationTitle?: string;
+  otpVerificationTitle?: string;
+  rtaVerificationDescription?: string;
+  cvvVerificationDescription?: string;
+  otpVerificationDescription?: string;
+  verifyButton?: string;
+  otpModalCancelButton?: string;
+  otpModalErrorText?: string;
+};

package/src/types/payment.types.ts

@@ -0,0 +1,139 @@
+import { ValidationError } from './account.types';
+
+export interface Installment {
+  pk: number;
+  installment_count: number;
+  label: string;
+  price_with_accrued_interest: string;
+  monthly_price_with_accrued_interest: string;
+}
+
+export interface CardType {
+  name: string;
+  slug: string;
+  logo: string;
+}
+
+export interface PaymentProcessRequest {
+  requestReferenceNo: string;
+  cvc: string;
+  cardAlias: string;
+  accountKey: string;
+  amount: string;
+  orderNo: string;
+  currencyCode: string;
+  paymentType: string;
+  acquirerIcaNumber: string;
+  installmentCount: number;
+  authenticationMethod: string;
+  secure3DModel: string;
+  terminalGroupId: string;
+}
+
+export interface OrderData {
+  pre_order?: {
+    total_amount: string;
+    currency_type_label: string;
+    redirect_to_three_d?: boolean;
+    installment?: {
+      installment_count: number;
+      monthly_price_with_accrued_interest: string;
+    };
+    payment_option?: {
+      name: string;
+    };
+    application_date?: string;
+  };
+  context_list?: Array<{
+    page_context?: {
+      order_no: string;
+      installments?: Installment[];
+      msisdn?: string;
+      three_d?: boolean;
+      extras?: {
+        user_id: string;
+        bank_ica: string | null;
+      };
+    };
+    page_name?: string;
+    page_slug?: string;
+  }>;
+}
+
+export type OTPType = 'RTA' | 'OTP' | 'CVV';
+
+export type TransactionType =
+  | 'PURCHASE'
+  | 'PURCHASE_3D'
+  | 'DIRECT_PURCHASE'
+  | 'DIRECT_PURCHASE_3D';
+
+export interface PaymentState {
+  selectedCard: any | null;
+  selectedInstallment: Installment | null;
+  installments: Installment[];
+  cardType: CardType | null;
+  orderData: OrderData | null;
+  orderCompleted: boolean;
+  cvc: string;
+  useThreeD: boolean;
+}
+
+export interface ModalState {
+  showLinkModal: boolean;
+  showOTPModal: boolean;
+  show3DSecureModal: boolean;
+  otpType: OTPType;
+  verificationData: any | null;
+  cardToDelete: any | null;
+  removingCardId: string | null;
+}
+
+export interface DirectPaymentRequest {
+  requestReferenceNo: string;
+  cvc: string;
+  cardNumber: string;
+  cardHolderName: string;
+  expiryDate: string;
+  accountKey: string;
+  amount: string;
+  orderNo: string;
+  currencyCode: string;
+  paymentType: string;
+  acquirerIcaNumber: string;
+  installmentCount: number;
+  authenticationMethod: string;
+  secure3DModel: string;
+  terminalGroupId: string;
+}
+
+export interface DirectPaymentResponse {
+  responseCode: string;
+  responseDescription: string;
+  token?: string;
+  retrievalReferenceNumber?: string;
+  maskedNumber?: string;
+  terminalGroupId?: string;
+  url3d?: string;
+  url3dSuccess?: string;
+  url3dFail?: string;
+}
+
+export interface MPResponse<T = any> {
+  version: string;
+  buildId: string;
+  statusCode: number;
+  message: string;
+  correlationId: string;
+  requestId: string;
+  result: T;
+  exception?: ExceptionResponse;
+}
+
+export interface ExceptionResponse {
+  level: string;
+  code: string;
+  message: string;
+  validationErrors: ValidationError[];
+  details: string[];
+}

package/src/types/verify.types.ts

@@ -0,0 +1,14 @@
+export interface VerifyResponse {
+  retrievalReferenceNumber: string;
+  isVerified: boolean;
+  cardUniqueNumber: string;
+  token: string | null;
+  responseCode: string;
+  description?: string;
+  url3d?: string;
+  url3D?: string;
+}
+
+export interface VerifyRequest {
+  otpCode: string;
+}