# cashfree-pg-capacitor

The Cashfree Capacitor SDK allows you to integrate Cashfree Payment Gateway into your application and start collecting payments from your customers. It opens the payment page in a webview. The Capacitor SDK has been designed to minimise the complexity of handling and integrating payments in your Capacitor project.

Click <a href="https://docs.cashfree.com/docs/capacitor-sdk" target="_blank">here</a> for more Documentation.

## Install

### Step 1 (Install the plugin)
Run the following commands in your capacitor project.
```bash  
npm install cashfree-pg-capacitor
npx cap sync
```  
### Step 2 (Configure for Android and iOS)
### Android
If the project's **targetSdkVersion** is 30 or above, add the following to your app Android Manifest file.
```xml
<manifest ...> 
	<queries>  
		<intent>  
			<action  android:name="android.intent.action.VIEW"  />  
			<data  android:scheme="upi"  android:host="pay"/>  
		</intent>  
		<package  android:name="com.android.chrome"  />  
	</queries>
<application ...>
```
<br>also register the plugin in MainActivity.java of your app.
**Example**
```java
import com.cashfree.capacitor.CFBridge;
...
public class MainActivity extends BridgeActivity {  
  
 @Override  
 protected void onCreate(Bundle savedInstanceState) {  
    super.onCreate(savedInstanceState);  
    registerPlugin(CFBridge.class); // register the plugin here
  }  
}
```

### iOS
Add the following code to application's **info.plist** file.
```xml
<key>LSApplicationCategoryType</key> 
<string></string> 
<key>LSApplicationQueriesSchemes</key> 
<array> 
<string>phonepe</string> 
<string>tez</string> 
<string>paytm</string> 
<string>bhim</string> 
</array>
```

---

## API

<docgen-index>  

* [`startPaymentWEB(...)`](#startpaymentweb)
* [`startPaymentUPI(...)`](#startpaymentupi)
* [`getUPIApps()`](#getupiapps)
* [`getIcon(...)`](#geticon)
* [`transFormUPIResponse(...)`](#transformupiresponse)

</docgen-index>  

<docgen-api>  

### startPaymentWEB()

```typescript  
startPaymentWEB(params: Object | Map<string, string>) => Object  
```  
**Parameters**
* **params :** An <code>Object or Map</code> containg [Request Parameters](#request-parameters).

**Returns**
An <code>Object</code> containing the [Response Parameters](#response-parameters).
  
--------------------  


### startPaymentUPI()

```typescript  
startPaymentUPI(params: Object | Map<string, string>) => Object  
```  
**Parameters**
* **params :** An <code>Object or Map</code> containg [Request Parameters](#request-parameters).

**Returns**
An <code>Object</code> containing the [Response Parameters](#response-parameters).

--------------------  


### getUPIApps()

```typescript  
getUPIApps() => Object  
```  
**Returns**
An <code>Object</code> containing the list of UPI apps installed in the User Phone supporting UPI intent payment mode.

**Response Parameters**:
-   **displayName**: Display name of the app to be used to show in the UI.
-   **id**: UPI app id to be used in UPI seamless Flow (with key appName).
-   **icon**: Icon of the UPI app encoded in Base64 to show in the UI.

**Sample response parsed to JSON**:
```
[
	{ 
		“displayName”: “Gpay”, 
		“id”: “com.google.android.apps.nbu.paisa.user”, 
		“icon”: “iVBORw0KGgoAAAANSUhEUgAAALQAAAC0CAYAAAA9zQYyAAAAAXNSR0IArs4c6QAA... (in base64)” 
	}, 
	{ 
		“displayName”: “PHONEPE”, 
		“id”: “com.phonepe.app”, 
		“icon”: “iVBORw0KGgoAAAANSUhEUgAAALQAAAC0CAYAAAA9zQYyAAAAAXNSR0IArs4c6QAA... (in base64)” 
	} 
]
```
  
--------------------  


### getIcon()

```typescript  
getIcon(base64String: string) => string  
```  
**Parameters**
* **base64String :** A base64 icon string obtained from 'icon' field of a UPIApp from [getUPIApps](#getupiapps).

**Returns**
A <code>string</code> prepended with <code>data:image/png;base64,</code> to make it usable as a source for image.

--------------------  


### transFormUPIResponse()
This function is created as a helper function specifially for **typescript**.
```typescript  
transFormUPIResponse(result: any) => UPIApp[]  
```  
**Parameters**
* **result :** the response received from [getUPIApps](#getupiapps).

**Returns**
An array of <code>UPIApp</code>.

--------------------  

## Request and Response Parameters
### Request Parameters
| Parameter | Required | Description|
| --- | ----------- | ----- |
|appId|Yes|Your app ID|
|orderId|Yes|Order or Invoice ID|
|orderCurrency|Yes|Currency code for the order.|
|orderAmount|Yes|Bill amount of the order|
|orderNote|No|Help text to provide customers with more information about the order.|
|customerName|No|Name of the customer|
|customerPhone|Yes|Phone number of the customer|
|customerEmail|Yes|Email ID of the customer|
|notifyUrl|No|Notification URL for server-server communication. Useful when a user's connection drops after completing the payment.|
|paymentModes|No|Allowed payment modes for this order. Available values: cc, dc, nb, paypal, upi, wallet.<br>Leave it blank if you want to display all modes.|
|tokenData|Yes|Token generated for the payment.|
|stage|Yes|Environment of the project setup (TEST or PROD)|
|appName|No|UPI app id when invoking seamless UPI intent.|

---

### Response Parameters
These parameters are sent in the response <code>Object</code>. They contain the details of the transaction.

| Parameter | Description |
| --- | ----------- |
|orderId|Order id for which transaction has been processed. Example, GZ-212.|
|orderAmount|Order amount. Example, 256.00|
|paymentMode|Payment mode of the transaction.|
|referenceId|Cashfree generated unique transaction ID. Example, 140388038803.|
|txStatus|Payment status for that order. Values can be, SUCCESS, FLAGGED, PENDING, FAILED, CANCELLED.|
|paymentMode|Payment mode used by customers to make the payment. Example, DEBIT_CARD, MobiKwik.|
|txMsg|Message related to the transaction. Will have the reason, if payment failed.|
|txTime|Time of the transaction.|
|type|Fixed value : CashFreeResponse. To identify the response is from Cashfree SDK.|
|signature|Response signature, more [here](https://docs.cashfree.com/docs/capacitor-sdk#verify-signature).|

---

</docgen-api>