# React Native SDK

## React Native SDK for NeoX Payment Gateway

**Use**

```tsx
import { NeoXProvider } from '@neox/react-native-sdk'
const App = () => {
  return (
    <NeoXProvider
      options={{
        header: {
          // containerStyle: {
          //   backgroundColor: 'blue',
          // },
          // titleStyle: {
          //   fontSize: 25,
          //   color: 'red',
          //   fontFamily: 'Montserrat-BoldItalic',
          // },
          // screenTitles: {
          //   paymentGatewayTitle: 'Cổng thanh toán NeoX',
          //   cardPaymentTitle: 'Thanh toán thẻ',
          //   transferPaymentTitle: 'Chuyển khoản ngân hàng',
          //   resultTitle: 'Ví NeoX',
          // },
        },
        button: {
          style: {
            backgroundColor: 'blue',
            color: 'white',
            borderRadius: 0,
            // fontSize: 22,
          },
          paymentLabel: 'Thanh toán ngay',
        },
      }}
    >
      <NavigationContainer>
        <RootStack.Navigator
          initialRouteName='ProductScreen'
          screenOptions={{
            animation:
              Platform.OS === 'android' ? 'fade_from_bottom' : 'default',
          }}
        >
          <RootStack.Screen
            component={Products}
            name='ProductScreen'
            options={{ headerShown: false }}
          />
          <RootStack.Screen
            component={ProductDetails}
            name='ProductDetailsScreen'
            options={{ headerTitle: 'Chi tiết sản phẩm' }}
          />
        </RootStack.Navigator>
      </NavigationContainer>
    </NeoXProvider>
  )
}
export default App
```

### Methods

| Method     | Description                                                |
| ---------- | ---------------------------------------------------------- |
| initialize | Initialize the necessary configurations for the SDK and UI |

### Example

```tsx
import { initialize, dismiss } from '@neox/react-native-sdk'
 initialize(
        {
          neo_PaymentBaseUrl: 'https://uat-api.neopay.vn/',
          neo_MerchantCode: 'HUYEN1',
          neo_Amount: product.price * count,
          neo_OrderInfo: 'Thanh toan don hang',
          neo_ReturnURL: '',
          neo_MerchantTxnID: 'T' + Math.floor(Math.random() * 100000),
          neo_SecureHash: '123456',
          neo_OrderID: 'DH' + Math.floor(Math.random() * 200000),
          neo_PaymentMethod: paymentMethod || [],
          neo_Currency: 'VND',
          neo_Version: '',
          neo_Command: '',
        },
        {
          onSuccess: (res) => {
            console.log('res=>Success', res)
            // dismiss()
          },
          onFailure: (res) => {
            console.log('res=>Failure', res)
            // dismiss()
          },
          onClose: () => {
          },
        }
      )
```

### Params in  initialize function

<table><thead><tr><th width="217">Parammetter</th><th width="111">Data Type</th><th width="138">Default Value</th><th>Description</th></tr></thead><tbody><tr><td>neo_MerchantCode</td><td>String</td><td></td><td>Merchant code is provided by NeoX</td></tr><tr><td>neo_Currency</td><td>String</td><td>VND</td><td>Transaction currency, VND as default</td></tr><tr><td>neo_Locale</td><td>String</td><td>vi</td><td>Language will display on the checkout page. Support: “vi”, “en”.</td></tr><tr><td>neo_Version</td><td>string</td><td>1</td><td>Payment gateway version, “1” as default</td></tr><tr><td>neo_PaymentMethod</td><td>String</td><td>["WALLET", "ATM", "CC", "QR"]</td><td>Allows to choose to display direct or list payment channels. If this field is not transmitted, all channels will be displayed.</td></tr><tr><td>neo_Amount</td><td>number</td><td></td><td>Payment amount</td></tr><tr><td>neo_MerchantTxnID</td><td>String</td><td></td><td>Unique - Transaction ID is provided by merchant</td></tr><tr><td>neo_OrderID</td><td>String</td><td></td><td>Order ID</td></tr><tr><td>neo_PaymentBaseUrl</td><td>String</td><td></td><td>Environment</td></tr></tbody></table>

**Callback**

| Event     | Description                                  |
| --------- | -------------------------------------------- |
| onSuccess | The event occurs when payment is successful. |
| onFailure | The event occurs when payment fails.         |

**Callback data from onSuccess and onFailure**

| Parameter          | Data Type | Description                                                                                                                               |
| ------------------ | --------- | ----------------------------------------------------------------------------------------------------------------------------------------- |
| neo\_MerchantCode  | string    | Merchant code is provided by NeoX                                                                                                         |
| neo\_Currency      | string    | Transaction currency, VND as default                                                                                                      |
| neo\_Locale        | string    | Language will display on the checkout page. Support: “vi”, “en”.                                                                          |
| neo\_Version       | string    | Payment gateway version, “1” as default                                                                                                   |
| neo\_Command       | string    | “PAY” as default                                                                                                                          |
| neo\_Amount        | string    | Payment amount                                                                                                                            |
| neo\_MerchantTxnID | string    | Unique - Transaction ID is provided by merchant                                                                                           |
| neo\_OrderID       | string    | Oder ID                                                                                                                                   |
| neo\_OrderInfo     | string    | Oder Information                                                                                                                          |
| neo\_TransactionID | string    | Unique - Transaction ID is generated by the NeoX system,  for reconciling.                                                                |
| neo\_ResponseCode  | string    | The error code is returned by NeoX, indicates the transaction result.                                                                     |
| neo\_ResponseMsg   | string    | Error description.                                                                                                                        |
| neo\_CustomerID    | string    | The customer ID on the merchant system.                                                                                                   |
| neo\_ResponseData  | string    | The data response of customer's payment.                                                                                                  |
| neo\_SecureHash    | string    | Use SHA256 to hash the above parameters (sort the key by Alphabet order) + Secret Key (will be provided by NeoX after actual integration) |