App.js

/**
 * Sample React Native App
 *
 * adapted from App.js generated by the following command:
 *
 * react-native init example
 *
 * https://github.com/facebook/react-native
 */

import React, { useState } from 'react';

import IswMobileSdk, { IswPaymentInfo, Environment } from 'react-native-isw-mobile-sdk'
import config from './credentials.js'

import {
    SafeAreaView,
    StyleSheet,
    View,
    StatusBar,
    Button,
    TextInput,
} from 'react-native';

let print = (value) => {

}

let onSdkInitialized = (isSuccessful) => {
    print(`sdk initialized: ${isSuccessful}`)
}
let userDidComplete = (result) => {
    print(result)
}

let userDidCancel = () => {
    print("user cancelled")
}

let handleSubmit = (amount) => {
    amount = (amount || 2500) * 100;

    const customerId = "<customer-id>",
        customerName = "<customer-name>",
        customerEmail = "<customer.email@domain.com>",
        customerMobile = "<customer-phone>",
        // generate a unique random
        // reference for each transaction
        reference = "<your-unique-ref>";


    const paymentInfo = new IswPaymentInfo(
        customerId,
        customerName,
        customerEmail,
        customerMobile,
        reference,
        amount,
    )

    IswMobileSdk.pay(paymentInfo, userDidComplete, userDidCancel);
}



const App = () => {
    // initialize mobile sdk
    IswMobileSdk.initialize(config, Environment.TEST, onSdkInitialized);

    const [state, setState] = useState({ amount: undefined })

    return (
        <>
            <StatusBar barStyle="dark-content" />
            <SafeAreaView>
                <View style={styles.body}>
                    <View style={styles.sectionContainer}>
                        <TextInput
                            style={styles.input}
                            textContentType="creditCardNumber"
                            placeholder="Amount"
                            onChangeText={amount => setState({ amount })}
                            value={state.amount}
                        />
                    </View>
                    <View style={styles.sectionContainer}>
                        <Button
                            style={styles.button}
                            onPress={() => handleSubmit(state.amount)}
                            title="Pay"
                        />

                    </View>
                </View>
            </SafeAreaView>
        </>
    );
};

const styles = StyleSheet.create({
    body: {
        backgroundColor: "#fff",
    },
    sectionContainer: {
        marginTop: 32,
        paddingHorizontal: 24,
    },
    input: {
        paddingLeft: 15,
        paddingRight: 15,
        paddingTop: 10,
        paddingBottom: 10, 
        borderRadius: 5,
        borderWidth: 2
    },
    button: {
        height: 60
    }
});

export default App;