@cashfreepayments/react-native-cashfree-cn-sdk 1.0.0-dev.0

package/src/Card/CFCardComponent.tsx

@@ -0,0 +1,323 @@
+import { TextInput, TextInputProps } from 'react-native';
+import React, { forwardRef } from 'react';
+import {
+  CFCardPayment,
+  CFEnvironment,
+  type CFSession,
+  ElementCard,
+} from 'cashfree-pg-api-contract';
+import { CFPaymentGatewayService } from '../index';
+
+function luhnCheck(cardNumber: string): boolean {
+  if (cardNumber.length === 0) {
+    return false;
+  }
+
+  cardNumber = cardNumber.replace(/\s/g, ''); // Remove spaces
+
+  let sum = 0;
+  let isAlternate = false;
+
+  for (let i = cardNumber.length - 1; i >= 0; i--) {
+    let digit = parseInt(cardNumber[i], 10);
+
+    if (isAlternate) {
+      digit *= 2;
+      if (digit > 9) {
+        digit -= 9;
+      }
+    }
+
+    sum += digit;
+    isAlternate = !isAlternate;
+  }
+
+  return sum % 10 === 0;
+}
+
+function getInputValidationDetails(cardBinResponse: any) {
+  if (!cardBinResponse || !cardBinResponse.scheme) {
+    return null;
+  }
+
+  let schemeType = cardBinResponse.scheme.toLowerCase();
+  let inputValidationDetails: { max_input_length: number; cvv_length: number };
+  switch (schemeType) {
+    case 'amex':
+      inputValidationDetails = { max_input_length: 15, cvv_length: 4 };
+      break;
+    case 'diners':
+      inputValidationDetails = { max_input_length: 14, cvv_length: 3 };
+      break;
+    default: // Covers visa, mastercard, rupay, jcb, discover, and unknown schemes
+      inputValidationDetails = { max_input_length: 16, cvv_length: 3 };
+  }
+  return inputValidationDetails;
+}
+
+/**
+ * Fetching Tdr info with card bin data & cfSession object
+ * @param session :  for payment sessionId & env
+ * @param bin : for card number
+ */
+async function getTDR(session: CFSession, bin: string) {
+  const route: string = `/pg/sdk/js/${session.payment_session_id}/v2/tdr`;
+  const body: string = JSON.stringify({ code: bin, code_type: 'bin' });
+  return await getInfo(session.environment, route, body);
+}
+
+/**
+ * Fetching CardBin info with card bin data & cfSession object
+ * @param session :  for payment sessionId & env
+ * @param bin : for card number
+ */
+async function getCardBin(session: CFSession, bin: string) {
+  const route: string = `/pg/sdk/js/${session.payment_session_id}/cardBin`;
+  const body: string = JSON.stringify({ card_number: bin });
+  return await getInfo(session.environment, route, body);
+}
+
+async function getInfo(env: string, route: string, bodyData: string) {
+  let baseUrl = 'https://api.cashfree.com';
+  if (env === CFEnvironment.SANDBOX) {
+    baseUrl = 'https://sandbox.cashfree.com';
+  }
+  const url = baseUrl + route;
+  try {
+    const response = await fetch(url, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: bodyData,
+    });
+
+    if (!response.ok) {
+      return null;
+    }
+    return await response.json();
+  } catch (error) {
+    return null;
+  }
+}
+
+export type CardPaymentHandle = {
+  doPayment: (cardInfo: ElementCard) => void;
+  doPaymentWithPaymentSessionId: (
+    cardInfo: ElementCard,
+    cfSession: CFSession
+  ) => void;
+};
+
+export type CardInputProps = {
+  cfSession: CFSession;
+  cardListener: (response: string) => void;
+} & TextInputProps;
+
+const CardInput: any = forwardRef<CardPaymentHandle, CardInputProps>(
+  ({ cfSession, cardListener, style, ...props }: CardInputProps, ref) => {
+    const [inputNumber, setInputNumber] = React.useState('');
+    const inputNumberRef = React.useRef('');
+    const sessionRef = React.useRef(cfSession);
+    React.useImperativeHandle(ref, () => ({
+      doPayment,
+      doPaymentWithPaymentSessionId,
+    }));
+
+    const tdrJsonRef = React.useRef<any>(null);
+    const cardBinJsonRef = React.useRef<any>(null);
+    const firstEightDigitsRef = React.useRef<string>('');
+
+    const handleChange = React.useCallback(
+      async (cardNumber: string) => {
+        let completeResponse: any = {};
+        const textWithoutSpaces: string = cardNumber.replaceAll(' ', '');
+        if (textWithoutSpaces.length === 0) setInputNumber('');
+
+        let formattedText: string = '';
+        /**
+         * Code to format card input number & set to input box
+         */
+        for (let i: number = 0; i < textWithoutSpaces.length; i += 4) {
+          let end: number = i + 4;
+          if (end > textWithoutSpaces.length) {
+            end = textWithoutSpaces.length;
+          }
+          formattedText += textWithoutSpaces.substring(i, end);
+          if (end !== textWithoutSpaces.length) {
+            formattedText += ' ';
+          }
+          inputNumberRef.current = formattedText;
+          setInputNumber((prev) =>
+            prev === formattedText ? prev : formattedText
+          );
+        }
+
+        let tdrResponse: any = null;
+        let cardBinResponse: any = null;
+
+        /**
+         * Fetch Tdr & CardBin data & set to local variable
+         */
+        async function fetchDataAndSet() {
+          await getTDR(cfSession, textWithoutSpaces)
+            .then((response: string) => {
+              tdrResponse = response;
+              firstEightDigitsRef.current = textWithoutSpaces.substring(0, 8);
+            })
+            .catch(() => {
+              tdrResponse = null;
+            });
+
+          await getCardBin(cfSession, textWithoutSpaces)
+            .then((response: string) => {
+              cardBinResponse = response;
+              firstEightDigitsRef.current = textWithoutSpaces.substring(0, 8);
+            })
+            .catch(() => {
+              cardBinResponse = null;
+            });
+
+          if (tdrResponse) {
+            tdrJsonRef.current = tdrResponse;
+            completeResponse.tdr_info = tdrJsonRef.current;
+          }
+
+          if (cardBinResponse) {
+            cardBinJsonRef.current = cardBinResponse;
+            completeResponse.card_bin_info = cardBinJsonRef.current;
+            completeResponse.input_validation = getInputValidationDetails(
+              cardBinJsonRef.current
+            );
+          }
+        }
+
+        if (textWithoutSpaces.length === 8) {
+          await fetchDataAndSet();
+        } else if (textWithoutSpaces.length > 8) {
+          if (
+            firstEightDigitsRef.current === textWithoutSpaces.substring(0, 8)
+          ) {
+            completeResponse.tdr_info = tdrJsonRef.current;
+            completeResponse.card_bin_info = cardBinJsonRef.current;
+            completeResponse.input_validation = getInputValidationDetails(
+              cardBinJsonRef.current
+            );
+          } else {
+            tdrJsonRef.current = null;
+            cardBinJsonRef.current = null;
+            await fetchDataAndSet();
+          }
+        }
+
+        if (textWithoutSpaces.length < 8) {
+          tdrJsonRef.current = null;
+          cardBinJsonRef.current = null;
+          firstEightDigitsRef.current = '';
+        }
+
+        if (cardBinJsonRef.current !== null) {
+          completeResponse.card_network = cardBinJsonRef.current.scheme;
+        }
+        let luhnStatus = luhnCheck(textWithoutSpaces);
+        if (luhnStatus) {
+          completeResponse.luhn_check_info = 'SUCCESS';
+          if (textWithoutSpaces && textWithoutSpaces.length > 4) {
+            completeResponse.last_four_digit = textWithoutSpaces.substring(
+              textWithoutSpaces.length - 4
+            );
+          }
+        } else {
+          completeResponse.luhn_check_info = 'FAIL';
+        }
+        completeResponse.card_length = textWithoutSpaces.length;
+
+        return cardListener(JSON.stringify(completeResponse));
+      },
+      [cfSession, cardListener]
+    );
+
+    const doPayment = (cardInfo: ElementCard) => {
+      try {
+        let cfCardNumber = inputNumberRef.current;
+        cardInfo.cardNumber = cfCardNumber.replaceAll(' ', '');
+        const cardPayment = new CFCardPayment(sessionRef.current, cardInfo);
+        CFPaymentGatewayService.makePayment(cardPayment,"https://65da-163-116-214-55.ngrok-free.app");
+      } catch (e: any) {
+        console.log(e.message);
+      }
+    };
+
+    const doPaymentWithPaymentSessionId = (
+      cardInfo: ElementCard,
+      session: CFSession
+    ) => {
+      try {
+        sessionRef.current = session;
+        doPayment(cardInfo);
+      } catch (e: any) {
+        console.log(e.message);
+      }
+    };
+
+    const handleSubmitEditingEvent = (event: any) => {
+      const newEvent = { ...event };
+      delete newEvent.nativeEvent.text;
+      if (onSubmitEditing) {
+        onSubmitEditing(newEvent);
+      }
+    };
+
+    const handleEndEditingEvent = (event: any) => {
+      const newEvent = { ...event };
+      delete newEvent.nativeEvent.text;
+      if (onEndEditing) {
+        onEndEditing(newEvent);
+      }
+    };
+
+    const handleFocusEvent = (event: any) => {
+      const newEvent = { ...event };
+      delete newEvent.nativeEvent.text;
+      if (onFocus) {
+        onFocus(newEvent);
+      }
+    };
+
+    const handleBlurEvent = (event: any) => {
+      const newEvent = { ...event };
+      delete newEvent.nativeEvent.text;
+      if (onBlur) {
+        onBlur(newEvent);
+      }
+    };
+
+    const InputComponent: any = TextInput;
+    const {
+      onChangeText,
+      onChange,
+      onSubmitEditing,
+      onEndEditing,
+      onFocus,
+      onBlur,
+      ...otherProps
+    } = props;
+
+    return (
+      <InputComponent
+        keyboardType="numeric"
+        inputMode={'numeric'}
+        value={inputNumber}
+        onChangeText={handleChange}
+        onSubmitEditing={handleSubmitEditingEvent}
+        onEndEditing={handleEndEditingEvent}
+        onFocus={handleFocusEvent}
+        onBlur={handleBlurEvent}
+        style={style}
+        {...otherProps}
+      />
+    );
+  }
+);
+
+export default CardInput;

package/src/Card/index.js

@@ -0,0 +1 @@
+export { default } from './CFCardComponent';

package/src/Card/index.ts

@@ -0,0 +1 @@
+export { default } from './CFCardComponent';

package/src/index.js

@@ -0,0 +1,167 @@
+import { NativeAppEventEmitter, NativeEventEmitter, NativeModules, Platform, } from 'react-native';
+import { version } from '../package.json';
+import { CFUPIPayment, CFCardPayment } from 'cashfree-pg-api-contract';
+import CFCardComponent from './Card/CFCardComponent';
+const LINKING_ERROR = `The package 'react-native-cashfree-cn-api' doesn't seem to be linked. Make sure: \n\n` +
+    Platform.select({ ios: '- You have run \'pod install\'\n', default: '' }) +
+    '- You rebuilt the app after installing the package\n' +
+    '- You are not using Expo managed workflow\n';
+const CashfreePgApi = NativeModules.CashfreePgApi
+    ? NativeModules.CashfreePgApi
+    : new Proxy({}, {
+        get() {
+            throw new Error(LINKING_ERROR);
+        },
+    });
+class CFPaymentGateway {
+    emitter;
+    successSubscription = null;
+    failureSubscription = null;
+    eventSubscription = null;
+    upiAppsSubscription = null;
+    constructor() {
+        this.emitter =
+            Platform.OS === 'ios'
+                ? new NativeEventEmitter(NativeModules.CashfreeEventEmitter)
+                : NativeAppEventEmitter;
+    }
+    doPayment(checkoutPayment, baseUrl) {
+        checkoutPayment.version = version;
+        CashfreePgApi.doPayment(JSON.stringify(checkoutPayment), baseUrl);
+    }
+    doUPIPayment(checkoutPayment, baseUrl) {
+        checkoutPayment.version = version;
+        CashfreePgApi.doUPIPayment(JSON.stringify(checkoutPayment), baseUrl);
+    }
+    doWebPayment(cfSession, baseUrl) {
+        CashfreePgApi.doWebPayment(JSON.stringify(cfSession), baseUrl);
+    }
+    /**
+     * @deprecated : Instead call makePayment
+     */
+    doCardPayment(cardPayment, baseUrl) {
+        this.makePayment(cardPayment, baseUrl);
+    }
+    async getInstalledUpiApps() {
+        return new Promise((resolve, reject) => {
+            if (Platform.OS === 'ios') {
+                let fetchUpiList = (apps) => {
+                    console.log(JSON.stringify(apps));
+                    if (apps) {
+                        resolve(apps);
+                    }
+                    else {
+                        reject('No UPI apps found');
+                    }
+                };
+                this.upiAppsSubscription = this.emitter.addListener('cfUpiApps', fetchUpiList);
+                CashfreePgApi.getInstalledUpiApps();
+            }
+            else {
+                CashfreePgApi.getInstalledUpiApps((apps) => {
+                    if (apps) {
+                        resolve(apps);
+                    }
+                    else {
+                        reject('No UPI apps found');
+                    }
+                });
+            }
+        });
+    }
+    makePayment(cfPayment, baseUrl) {
+        cfPayment.version = version;
+        const paymentData = JSON.stringify(cfPayment);
+        if (cfPayment instanceof CFUPIPayment) {
+            CashfreePgApi.doElementUPIPayment(paymentData, baseUrl);
+        }
+        else if (cfPayment instanceof CFCardPayment) {
+            CashfreePgApi.doCardPayment(paymentData, baseUrl);
+        }
+        else {
+            console.log('makePayment::==> Wrong payment object');
+        }
+    }
+    setEventSubscriber(cfEventCallback) {
+        let eventFunction = (event) => {
+            console.log(JSON.stringify(event));
+            let data = JSON.parse(event);
+            cfEventCallback.onReceivedEvent(data.eventName, data.meta);
+        };
+        this.eventSubscription = this.emitter.addListener('cfEvent', eventFunction);
+        CashfreePgApi.setEventSubscriber();
+    }
+    removeEventSubscriber() {
+        if (this.eventSubscription !== undefined &&
+            this.eventSubscription !== null) {
+            this.eventSubscription.remove();
+            this.eventSubscription = null;
+        }
+        CashfreePgApi.removeEventSubscriber();
+    }
+    setCallback(cfCallback) {
+        // this.cfCallback = cfCallback;
+        let successFunction = (orderID) => {
+            console.log('response is : ' + JSON.stringify(orderID));
+            cfCallback.onVerify(orderID);
+        };
+        let failureFunction = (error) => {
+            console.log('reason: ' + JSON.stringify(error));
+            const response = new CFErrorResponse();
+            // @ts-ignore
+            const message = JSON.parse(error);
+            response.fromJSON(message.error);
+            // @ts-ignore
+            cfCallback.onError(response, message.orderID);
+        };
+        this.successSubscription = this.emitter.addListener('cfSuccess', successFunction);
+        this.failureSubscription = this.emitter.addListener('cfFailure', failureFunction);
+        CashfreePgApi.setCallback();
+    }
+    removeCallback() {
+        if (this.successSubscription !== undefined &&
+            this.successSubscription !== null) {
+            this.successSubscription.remove();
+            this.successSubscription = null;
+        }
+        if (this.failureSubscription !== undefined &&
+            this.failureSubscription !== null) {
+            this.failureSubscription.remove();
+            this.failureSubscription = null;
+        }
+        if (this.upiAppsSubscription !== undefined &&
+            this.upiAppsSubscription !== null) {
+            this.upiAppsSubscription.remove();
+            this.upiAppsSubscription = null;
+        }
+    }
+}
+export class CFErrorResponse {
+    status = 'FAILED';
+    message = 'payment has failed';
+    code = 'payment_failed';
+    type = 'request_failed';
+    fromJSON(errorString) {
+        console.log('errorString :' + errorString);
+        const object = JSON.parse(errorString);
+        console.log('errorStringObject :' + object);
+        this.status = object.status;
+        this.message = object.message;
+        this.code = object.code;
+        this.type = object.type;
+    }
+    getStatus() {
+        return this.status;
+    }
+    getMessage() {
+        return this.message;
+    }
+    getCode() {
+        return this.code;
+    }
+    getType() {
+        return this.type;
+    }
+}
+export const CFCard = CFCardComponent;
+export const CFPaymentGatewayService = new CFPaymentGateway();

package/src/index.ts

@@ -0,0 +1,219 @@
+import {
+  EmitterSubscription,
+  EventEmitter,
+  NativeAppEventEmitter,
+  NativeEventEmitter,
+  NativeModules,
+  Platform,
+} from 'react-native';
+import { version } from '../package.json';
+import { type CheckoutPayment, type CFSession, CFUPIPayment, CFCardPayment } from 'cashfree-pg-api-contract';
+import CFCardComponent from './Card/CFCardComponent';
+
+const LINKING_ERROR =
+  `The package 'react-native-cashfree-cn-api' doesn't seem to be linked. Make sure: \n\n` +
+  Platform.select({ ios: '- You have run \'pod install\'\n', default: '' }) +
+  '- You rebuilt the app after installing the package\n' +
+  '- You are not using Expo managed workflow\n';
+
+const CashfreePgApi = NativeModules.CashfreePgApi
+  ? NativeModules.CashfreePgApi
+  : new Proxy(
+    {},
+    {
+      get() {
+        throw new Error(LINKING_ERROR);
+      },
+    },
+  );
+
+class CFPaymentGateway {
+  private emitter: EventEmitter;
+  private successSubscription: EmitterSubscription | null = null;
+  private failureSubscription: EmitterSubscription | null = null;
+  private eventSubscription: EmitterSubscription | null = null;
+  private upiAppsSubscription: EmitterSubscription | null = null;
+
+  constructor() {
+    this.emitter =
+      Platform.OS === 'ios'
+        ? new NativeEventEmitter(NativeModules.CashfreeEventEmitter)
+        : NativeAppEventEmitter;
+  }
+
+  doPayment(checkoutPayment: CheckoutPayment,baseUrl: String) {
+    checkoutPayment.version = version;
+    CashfreePgApi.doPayment(JSON.stringify(checkoutPayment),baseUrl);
+  }
+
+  doUPIPayment(checkoutPayment: CheckoutPayment,baseUrl: String) {
+    checkoutPayment.version = version;
+    CashfreePgApi.doUPIPayment(JSON.stringify(checkoutPayment),baseUrl);
+  }
+
+  doWebPayment(cfSession: CFSession,baseUrl: String) {
+    CashfreePgApi.doWebPayment(JSON.stringify(cfSession),baseUrl);
+  }
+
+  /**
+   * @deprecated : Instead call makePayment
+   */
+  doCardPayment(cardPayment: CheckoutPayment,baseUrl: String) {
+    this.makePayment(cardPayment,baseUrl);
+  }
+
+  async getInstalledUpiApps() {
+    return new Promise((resolve, reject) => {
+      if(Platform.OS === 'ios'){
+        let fetchUpiList = (apps: string) => {
+          console.log(JSON.stringify(apps));
+          if (apps) {
+            resolve(apps);
+          } else {
+            reject('No UPI apps found');
+          }
+        };
+        this.upiAppsSubscription = this.emitter.addListener('cfUpiApps', fetchUpiList);
+        CashfreePgApi.getInstalledUpiApps()
+      }
+      else {
+        CashfreePgApi.getInstalledUpiApps((apps: string) => {
+          if (apps) {
+            resolve(apps);
+          } else {
+            reject('No UPI apps found');
+          }
+        });
+      }
+    });
+  }
+
+  makePayment(cfPayment: CheckoutPayment,baseUrl: String) {
+    cfPayment.version = version;
+    const paymentData = JSON.stringify(cfPayment);
+    if (cfPayment instanceof CFUPIPayment) {
+      CashfreePgApi.doElementUPIPayment(paymentData,baseUrl);
+    } else if (cfPayment instanceof CFCardPayment) {
+      CashfreePgApi.doCardPayment(paymentData,baseUrl);
+    } else {
+      console.log('makePayment::==> Wrong payment object');
+    }
+  }
+
+  setEventSubscriber(cfEventCallback: CFEventCallback) {
+    let eventFunction = (event: string) => {
+      console.log(JSON.stringify(event));
+      let data = JSON.parse(event);
+      cfEventCallback.onReceivedEvent(data.eventName, data.meta);
+    };
+    this.eventSubscription = this.emitter.addListener('cfEvent', eventFunction);
+    CashfreePgApi.setEventSubscriber();
+  }
+
+  removeEventSubscriber() {
+    if (
+      this.eventSubscription !== undefined &&
+      this.eventSubscription !== null
+    ) {
+      this.eventSubscription.remove();
+      this.eventSubscription = null;
+    }
+    CashfreePgApi.removeEventSubscriber();
+  }
+
+  setCallback(cfCallback: CFCallback) {
+    // this.cfCallback = cfCallback;
+    let successFunction = (orderID: string) => {
+      console.log('response is : ' + JSON.stringify(orderID));
+      cfCallback.onVerify(orderID);
+    };
+    let failureFunction = (error: string) => {
+      console.log('reason: ' + JSON.stringify(error));
+      const response = new CFErrorResponse();
+      // @ts-ignore
+      const message = JSON.parse(error);
+      response.fromJSON(message.error);
+      // @ts-ignore
+      cfCallback.onError(response, message.orderID);
+    };
+    this.successSubscription = this.emitter.addListener(
+      'cfSuccess',
+      successFunction,
+    );
+    this.failureSubscription = this.emitter.addListener(
+      'cfFailure',
+      failureFunction,
+    );
+    CashfreePgApi.setCallback();
+  }
+
+  removeCallback() {
+    if (
+      this.successSubscription !== undefined &&
+      this.successSubscription !== null
+    ) {
+      this.successSubscription.remove();
+      this.successSubscription = null;
+    }
+    if (
+      this.failureSubscription !== undefined &&
+      this.failureSubscription !== null
+    ) {
+      this.failureSubscription.remove();
+      this.failureSubscription = null;
+    }
+    if (
+      this.upiAppsSubscription !== undefined &&
+      this.upiAppsSubscription !== null
+    ) {
+      this.upiAppsSubscription.remove();
+      this.upiAppsSubscription = null;
+    }
+  }
+}
+
+export interface CFCallback {
+  onVerify(orderID: string): void;
+
+  onError(error: CFErrorResponse, orderID: string): void;
+}
+
+export interface CFEventCallback {
+  onReceivedEvent(eventName: string, map: Map<string, string>): void;
+}
+
+export class CFErrorResponse {
+  private status: string = 'FAILED';
+  private message: string = 'payment has failed';
+  private code: string = 'payment_failed';
+  private type: string = 'request_failed';
+
+  fromJSON(errorString: string) {
+    console.log('errorString :' + errorString);
+    const object = JSON.parse(errorString);
+    console.log('errorStringObject :' + object);
+    this.status = object.status;
+    this.message = object.message;
+    this.code = object.code;
+    this.type = object.type;
+  }
+
+  getStatus(): string {
+    return this.status;
+  }
+
+  getMessage(): string {
+    return this.message;
+  }
+
+  getCode(): string {
+    return this.code;
+  }
+
+  getType(): string {
+    return this.type;
+  }
+}
+
+export const CFCard = CFCardComponent
+export const CFPaymentGatewayService = new CFPaymentGateway();