Installation

A React Native library for integrating Amwal Pay payment gateway into your React Native applications.

npm install react-amwal-pay

iOS Installation Note #

After pod installation, you need to set “Build Libraries for Distribution” to NO in Xcode:

1. Open your iOS project in Xcode
2. Go to Pods project
3. Select amwalsdk target
4. In Build Settings, search for “Build Libraries for Distribution”
5. Set it to NO

Configuring amwalsdk Subspec #

The library uses amwalsdk as a dependency and supports both Release and Debug subspecs. By default, it uses the Debug subspec. To change this, you can set the AMWAL_SUBSPEC environment variable in your Podfile:

# In your Podfile
ENV['AMWAL_SUBSPEC'] = 'Release' # or 'Debug'

Or you can set it when running pod install:

AMWAL_SUBSPEC=Release pod install

Usage #

import {
  AmwalPaySDK,
  Environment,
  Currency,
  TransactionType,
  type AmwalPayConfig,
  type AmwalPayResponse
} from 'react-amwal-pay';

// Configure Amwal Pay
const config: AmwalPayConfig = {
  environment: Environment.SIT, // or Environment.PRODUCTION
  currency: Currency.OMR, // or other supported currencies
  transactionType: TransactionType.CARD_WALLET,
  locale: 'en', // or 'ar'
  merchantId: '84131',
  terminalId: '811018',
  amount: '1',
  secureHash: '8570CEED656C8818E4A7CE04F22206358F272DAD5F0227D322B654675ABF8F83',
  customerId: 'customer-id', // optional
  sessionToken: 'your-session-token', // optional
  onCustomerId(customerId) {
    console.log('Customer ID:', customerId);
  },
  onResponse(response) {
    console.log('Payment Response:', response);
  }
};

// Initialize and start payment
const handlePayment = async () => {
  try {
    // Validate required fields
    if (!isConfigValid(config)) {
      console.error('Please fill in all required fields');
      return;
    }

    const amwalPay = AmwalPaySDK.getInstance();
    await amwalPay.startPayment(config);
  } catch (error) {
    console.error('Error starting payment:', error);
  }
};

// Helper function to validate config
const isConfigValid = (config: Partial<AmwalPayConfig>): boolean => {
  return Boolean(
    config.environment &&
    config.secureHash &&
    config.currency &&
    config.amount &&
    config.merchantId &&
    config.terminalId &&
    config.locale &&
    config.transactionType
  );
};

UUID Generation #

If you need to generate a custom transaction ID, you can use the built-in UUID utility:

import { UuidUtil } from 'react-amwal-pay';

// Generate a UUID for transaction ID
const transactionId = UuidUtil.generateTransactionId();

// Or use the lower-level generator
const uuid = UuidUtil.generateV4();

The UUID utility generates lowercase UUIDs in v4 format, ensuring compatibility with the payment system.

Addition Values Configuration #

The SDK supports additionValues parameter for passing custom key-value pairs that can be used for various SDK functionalities.

Default Addition Values #

The SDK automatically provides default values:

• merchantIdentifier: “merchant.applepay.amwalpay” (used for Apple Pay configuration)

Usage #

// Using default additionValues (automatically applied)
const config = {
  // ... other configuration
  // additionValues will automatically include merchantIdentifier
};

// Using custom additionValues
const customConfig = {
  // ... other configuration
  additionValues: {
    merchantIdentifier: 'merchant.custom.identifier',
    customKey: 'customValue'
  }
};

Custom additionValues will be merged with defaults, with custom values taking precedence.