skipcash-reactnative 0.0.6 → 0.0.7

package/README.md

@@ -20,9 +20,10 @@ SkipCash React Native Package; This package facilitates SkipCash integration wit
 # Example
 
 ```jsx
+
 import { useEffect, useState } from 'react';
 
-import { StyleSheet, View, NativeEventEmitter, NativeModules, Platform, Alert } from 'react-native';
+import { StyleSheet, View, NativeEventEmitter, KeyboardAvoidingView, NativeModules, Platform, Alert } from 'react-native';
 import { initiateApplePay, PaymentData, PaymentResponse,
   isWalletHasCards, setupNewCard, initiatePaymentModel
 } from 'skipcash-reactnative';
@@ -43,29 +44,12 @@ export default function App() {
   /**********************************
   - THIS PACKAGE PROVIDES TWO PAYMENT OPTIONS FOR YOUR CUSTOMER -
     1. IN-APP APPLE PAY using 'initiateApplePay()' function.
-    2. IN-APP WEB VIEW (INCLUDES ALL PAYMENT OPTIONS THAT SKIPCASH OFFERS).
+    2. IN-APP WEB VIEW (INCLUDES ALL PAYMENT OPTIONS THAT SKIPCASH OFFERS (visa, master, amex, 
+    international cards, etc...) using 'initiatePaymentModel()' function.
   - THIS EXAMPLE APP, DEMONESTRATES HOW TO USE THE DIFFERENT OPTIONS MENTIONED ABOVE
   ***********************************/
 
-  /*
-    Here In case if you want to implement IN-APP Apple Pay
-    you have to  pass the name of the merchant identifier
-    (you need to create a new one from apple developer account of your app ). 
-    please reachout to https://dev.skipcash.app/ mobile apple pay section to
-    know how to generate your merchant identifier and setup Xcode.
-  */
-
-  paymentData.setMerchantIdentifier("");
-  /* 
-    Add your payment endpoint; You need to create an endpoint for your merchant account.
-    For more information on how to request a new payment, Please refer to https://dev.skipcash.app/doc/api-integration/.
-    
-    You will need to implement this functionality on your backend server to create an endpoint that requests a new payment and returns the details you receive from the SkipCash server to this package. Of course your endpoint will receive the customer's details from this package request, Upon receiving the details response from your server this package will use that details to process your customer's payment via Apple Pay.
 
-    Once you have completed setting up and testing your endpoint, please provide the link to the setPaymentLinkEndPoint below.
-  */
-  paymentData.setPaymentLinkEndPoint("")
-  paymentData.setAuthorizationHeader("");
   /* add authorizartion header; used to protect your endpoint from unathorized access */
 
   useEffect(() => {
@@ -92,7 +76,7 @@ export default function App() {
         }
       ));
 
-      // For In-App Apple Pay response
+      // For In-App Apple Pay
       subscriptions.push(new NativeEventEmitter(NativeModules.SkipcashReactnative).addListener(
         'applepay_response',
          (paymentResponse: any) => {
@@ -101,7 +85,7 @@ export default function App() {
           let response: PaymentResponse = PaymentResponse.fromJson(paymentResponse);
   
   
-          Alert.alert(`isSuccess: ${response.isSuccess} | transactionId: ${response.transactionId} | PaymentID: ${response.paymentId} 
+          Alert.alert(`isSuccess: ${response.isSuccess} | transactionId: ${response.transactionId}
             | returnCode: ${response.returnCode} | errorMessage: ${response.errorMessage}`);
   
           /* 
@@ -118,6 +102,9 @@ export default function App() {
 
     return () => {
       // cleaning up after leaving the current app view
+      // make sure to block leaving the current view until the payment is 
+      // finished or canceled by the client or you will not be able to 
+      // record the callback event for the payment status.
       new NativeEventEmitter().removeAllListeners("responseScPaymentData");
       if(Platform.OS === 'ios'){
         new NativeEventEmitter().removeAllListeners("applepay_response");
@@ -128,6 +115,34 @@ export default function App() {
   }, []);
 
   const initiateApplePayPayment = () => {
+    /*
+      you have to  pass the name of the merchant identifier
+      (you need to create a new one from apple developer account of your app ). 
+      please reachout to https://dev.skipcash.app/ mobile apple pay section to
+      know how to generate your merchant identifier and setup Xcode.
+    */
+    paymentData.setMerchantIdentifier("");
+
+    /* 
+      Apple Pay Payments Processing endpoint.
+
+      You need to setup an endpoint to create a new payments.
+      For more information on how to request a new payment, Please refer to https://dev.skipcash.app/doc/api-integration/.
+      
+      You will need to implement this functionality on your backend server to create an endpoint that requests and create new payment and process it 
+      and returns the details you receive from the SkipCash server to this package. 
+
+      Your endpoint will receive the customer's details and apple pay token once the customer authorizes the transaction after calling initiateApplePay()
+      then your endpoint should process the payment by calling skipcash API, once done your endpoint should return the response received from SkipCash API
+      you can find details about how to setup your endpoint at "https://dev.skipcash.app/" under applepay section "configure payment processing endpoint".
+
+      Once you have completed setting up and testing your endpoint, please provide the link to the setPaymentLinkEndPoint below.
+    */
+    paymentData.setPaymentLinkEndPoint("");
+
+    // if your endpoint requires authorization header you can pass it below
+    paymentData.setAuthorizationHeader(""); 
+
     paymentData.setSummaryItem('Tax', '0.0'); // set summary item
     paymentData.setSummaryItem('Total', amount); // set summary item
 
@@ -137,9 +152,10 @@ export default function App() {
     paymentData.setEmail(email); // required
     paymentData.setAmount(amount); // required
     paymentData.setTransactionId(""); // your internal order id, (Optional) - but very much recommended
-    paymentData.setWebhookUrl(""); // very much recommended
+    paymentData.setWebhookUrl(""); // very much recommended 
     // read about webhooks ->  https://dev.skipcash.app/doc/api-integration/web-hooks/
-    paymentData.setMerchantName(""); /* 
+    paymentData.setMerchantName("Your official business name in appstore"); 
+    /* 
       Required - (if using in-app apple-pay set your official merchant/business name for apple payment sheet) 
       this is required by apple, it must match your official name in appstore
     */
@@ -152,6 +168,7 @@ export default function App() {
     const paymentDataJson = JSON.stringify(paymentData); // convert paymentData to json string
 
     if(firstName && lastName && phone && email) {
+      console.log(paymentDataJson);
       initiateApplePay(paymentDataJson);
     }else{
       Alert.alert("please fill firstname, lastname, phone, email & amount");
@@ -159,6 +176,26 @@ export default function App() {
   }
 
   const startPaymentModel = () => {
+
+    /* 
+      Add your payment endpoint; You need to create an endpoint for your merchant account.
+      For more information on how to request a new payment, Please refer to https://dev.skipcash.app/doc/api-integration/.
+      
+      You will need to implement this functionality at your backend server. Create an endpoint that requests a new payment and returns the response 
+      received from the SkipCash API. 
+
+      Your endpoint will receive the customer's details from this package request, Upon receiving the details call SkipCash API to create a new payment
+      as mentioned in the above documentation then your endpoint should return the response received from SkipCash API this package will use the response
+      to open the new payment a webview to show the online payment options to customer.
+
+      Once you have completed setting up and testing your endpoint, please provide the link to the setPaymentLinkEndPoint below.
+    */
+    paymentData.setPaymentLinkEndPoint("");
+
+    // if your endpoint requires authorization header you can pass it below
+    paymentData.setAuthorizationHeader(""); 
+
+
     paymentData.setFirstName(firstName); // required
     paymentData.setLastName(lastName); // required
     paymentData.setPhone(phone); // required
@@ -194,7 +231,7 @@ export default function App() {
   }
 
   return (
-    <View style={styles.container}>
+    <KeyboardAvoidingView behavior={Platform.OS === 'ios' ? 'padding' : 'height'} style={styles.container}>
       <Title style={styles.title}>Payment Details</Title>
       
       <TextInput
@@ -302,7 +339,7 @@ export default function App() {
       >
         Setup A Card
       </Button>
-    </View>
+    </KeyboardAvoidingView>
   );
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "skipcash-reactnative",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "description": "integrate skipcash in react native app.",
   "source": "./src/index.tsx",
   "main": "./lib/commonjs/index.js",