# rn-amazon-payment-services
Amazon Payment Service Sdk react native package
## Installation
```sh
npm install rn-amazon-payment-services
```
#### Android
You need to add the repository to your build file. Add it in your root build.gradle (/android/build.gradle) at the end of repositories
```java
allprojects {
repositories {
...
maven { url "https://android-sdk.payfort.com" }
}
}
```
You need to also make sure that following two permission are set in the AndroidManifest.xml (android/app/src/main/AndroidManifest.xml):
```xml
< uses-permission android:name="android.permission.INTERNET" />
< uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
```
#### iOS
1- Add the following code to your Podfile (inside the target section):
```
pod 'PayFortSDK'
```
2- Add the following to the bottom of your Podfile:
```
post_install do |installer|
installer.pods_project.targets.each do |target|
if ['PayFortSDK'].include? target.name
target.build_configurations.each do |config|
config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
end
end
end
end
```
## Usage
```js
import {
getDeviceId,
FortRequestObject,
StandardCheckout,
} from 'rn-amazon-payment-services';
// ...
export default function App() {
const [deviceId, setDeviceId] = useState('');
const [showStandardCheckout, setShowStandardCheckout] = useState(false);
const setupDeviceId = async () => {
const id: string = await getDeviceId();
setDeviceId(id);
};
const onSuccess = (response: any) => {
console.log('success', response);
setShowCustomScreen(false);
};
const onFailure = (response: any) => {
console.log('failure', response);
setShowCustomScreen(false);
};
const onCancel = (response: any) => {
console.log('cancel', response);
setShowStandardCheckout(false);
};
// request object example for standard and custom ui checkout
const requestObject: FortRequestObject = {
command: 'PURCHASE',
merchant_reference: 'ORD-0000007682',
amount: '100',
currency: 'AED',
language: 'en',
customer_email: 'sam@gmail.com',
sdk_token: sdkToken,
payment_option: 'VISA',
};
//...
// Standard Checkout component
return(
)
}
// ...
```
### Standard Checkout Props
| Name | Value | Description | Mandatory |
| ---------------------------------------- | ---------------------------- | -------------------------------------------------------------------------------------------------------------------------|---------------|
| showStandardCheckoutPage | `boolean` | Navigates to Amazon Payment Service Standard Checkout screen | Yes |
| environment | `'TEST'`, `'PRODUCTION'` | Parameter used to determine whether the request is going to be submitted to the test or production environment. | Yes |
| requestCode | `number` | Unique ID for this request. | Yes |
| showLoading | `boolean` | Flag to show or hide the loading dialog. | Yes |
| showResponsePage | `boolean` | Flag to show or hide response page after payment is done. | Yes |
| requestObject | `object` | Parameters you need to send when you send a request (the full list of parameters is in the last section of the document) | Yes |
| onSuccess | `function` | Callback to handle when the transaction is processed successfully. | Yes |
| onFailure | `function` | Callback to handle when the transaction is failed. | Yes |
| onCancel | `function` | Callback to handle when the user cancels the payment by clicking the back button. | No |
### Custom UI Checkout
```js
import {
CustomCheckoutView,
} from 'rn-amazon-payment-services';
// ...
// Custom Checkout UI component
return(
)
```
### Direct Pay Checkout
```js
import {
DirectPayButton,
FortRequestObjectDirectPay,
} from 'rn-amazon-payment-services';
//...
const requestObjectDirectPay: FortRequestObjectDirectPay = {
command: 'AUTHORIZATION',
merchant_reference: 'ORD-0000007682',
amount: '100',
currency: 'AED',
language: 'en',
customer_email: 'sam@gmail.com',
sdk_token: sdkToken,
payment_option: 'VISA',
token_name: tokenName,
card_security_code: '123',
};
return(
)
```
### Custom UI and Direct Checkout Props
| Name | Value | Description | Mandatory |
| ---------------------------------------- | ---------------------------- | ---------------------------------------------------------------------------------------------------|---------------|
| environment | `'TEST'`, `'PRODUCTION'` | Parameter used to determine whether the request is going to be submitted to the test or production environment. | Yes |
| style | `object` | Set the height and width of the view | Yes |
| payButtonProps | `object` | Customization of the pay button | Yes |
| requestObject | `object` | Parameters you need to send when you send a request (the full list of parameters is in the last section of the document) | Yes |
| onSuccess | `function` | Callback to handle when the transaction is processed successfully. | Yes |
| onFailure | `function` | Callback to handle when the transaction is failed. | Yes |
### Request Parameters (FortRequestObject)
| Attribute | Type | Description | Mandatory | Maximum | Example |
|----------------------|--------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------|---------|-----------------------------------------------------------------------|
| command | Alpha | Command.
Possible/ expected values: AUTHORIZATION, PURCHASE | Yes | 20 | PURCHASE |
| merchant_reference | Alphanumeric | The Merchant’s unique order number. | Yes | 40 | XYZ9239-yu898 |
| amount | Numeric | The transaction’s amount. *Each currency has predefined allowed decimal points that should be taken into consideration when sending the amount | Yes | 10 | 10000 |
| currency | Alpha | The currency of the transaction’s amount in ISO code 3. | Yes | 3 | AED |
| language | Alpha | The checkout page and messages language.
Possible/ expected values: en/ ar | Yes | 2 | en |
| customer_email | Alphanumeric | The customer’s email.
Special characters: _ - . @ + | Yes | 254 | customer@domain.com |
| sdk_token | Alphanumeric | An SDK Token to enable using the Amazon Payment Services Mobile SDK. | Yes | 100 | Dwp78q3 |
| token_name | Alphanumeric | The Token received from the Tokenization process.
Special characters: . @ - _ | No | 100 | Op9Vmp |
| payment_option | Alpha | Payment option.
Possible/ expected values:
- MASTERCARD
- VISA
- AMEX
- MADA (for Purchase operations and eci Ecommerce only) Click here to download [MADA Branding Document](https://paymentservices-reference.payfort.com/pdf/mada%20branding%20-%20ecommerce%20merchant%20-%20payment%20providers.pdf)
- MEEZA (for Purchase operations and ECOMMERCE eci only) | No | 10 | VISA |
| eci | Alpha | Ecommerce indicator.
Possible/ expected values: ECOMMERCE | No | 150 | ECOMMERCE |
| order_description | Alphanumeric | A description of the order.
Special characters:'/ . _ - # : $ Space | No | 150 | iPhone 6-S |
| customer_ip | Alphanumeric | It holds the customer’s IP address. *It’s Mandatory, if the fraud service is active. *We support IPv4 and IPv6 as shown in the example below. | No | 45 | IPv4 → 192.178.1.10
IPv6 → 2001:0db8:3042:0002:5a55:caff:fef6:bdbf |
| customer_name | Alpha | The customer’s name.
Special characters: _ \ / - .' | No | 40 | John Smith |
| phone_number | Alphanumeric | The customer’s phone number.
Special characters: + - ( ) Space | No | 19 | 00962797219966 |
| settlement_reference | Alphanumeric | The Merchant submits unique value to Amazon Payment Services. The value is then passed to the Acquiring bank and displayed to the merchant in the Acquirer settlement file. | No | 34 | XYZ9239-yu898 |
| merchant_extra1 | Alphanumeric | Extra data sent by merchant. Will be received and sent back as received. Will not be displayed in any report. | No | 250 | JohnSmith |
| merchant_extra2 | Alphanumeric | Extra data sent by merchant. Will be received and sent back as received. Will not be displayed in any report. | No | 250 | JohnSmith |
| merchant_extra3 | Alphanumeric | Extra data sent by merchant. Will be received and sent back as received. Will not be displayed in any report. | No | 250 | JohnSmith |
| merchant_extra4 | Alphanumeric | Extra data sent by merchant. Will be received and sent back as received. Will not be displayed in any report. | No | 250 | JohnSmith |
| merchant_extra5 | Alphanumeric | Extra data sent by merchant. Will be received and sent back as received. Will not be displayed in any report. | No | 250 | JohnSmith |
### Apple Pay
```js
import { ApplePay, ApplePayRequest, RequestObjectApplePay } from 'rn-amazon-payment-services';
try {
const transactionRequest: RequestObjectApplePay = {
amount: '',
command: 'PURCHASE',
digital_wallet: 'APPLE_PAY',
merchant_reference: '',
currency: 'AED',
language: 'en',
customer_email: '',
sdk_token: '',
customer_ip: '',
phone_number: '',
};
const applePaymentDetails: ApplePayRequest = {
displayAmount: '',
environment: 'TEST',
merchantIdentifier: 'merchant.com.*',
countryCode: 'AE',
currencyCode: 'AED',
supportedNetworks: ['visa', 'mastercard', 'mada', 'amex'],
transactionDetails: transactionRequest
};
let result = await ApplePay.startPayment(applePaymentDetails);
//handle result
} catch (error: any) {
// handle error
}
```
### Apple Pay Request props (ApplePayRequest)
| Attribute | Type | Description | Mandatory | Maximum | Example |
|----------------------|--------------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------|---------|-----------------------------------------------------------------------|
| displayAmount | Alpha | The amount to be display on the Apple payment screen | Yes | 10 | 100 |
| environment | `'TEST'`, `'PRODUCTION'` | Parameter used to determine whether the request is going to be submitted to the test or production environment. | Yes |
| merchantIdentifier | Alphanumeric | The apple pay merchant identifier created on the apple developer account | Yes | 150 | merchant.com.test.integration|
| countryCode | Alpha | A list of two-letter country codes for limiting payment to cards from specific countries or regions. | Yes | 2 | AE|
| currencyCode | Alpha | The three-letter ISO 4217 currency code for the payment. | Yes | 3 | AED|
| supportedNetworks | `object` | Array value of payment options supported on apple payment | Yes | | `['visa', 'mastercard', 'mada', 'amex']` |
| transactionDetails | `object` | The request object containing the details for processing the apple payment. | Yes | | `{ amount: '', command: 'PURCHASE', digital_wallet: 'APPLE_PAY', merchant_reference: '', currency: 'AED', language: 'en', customer_email: '', sdk_token: token, customer_ip: '', customer_name: '', phone_number: '', settlement_reference: '', merchant_extra: ''}` |
## License
MIT