paytm-customuisdk-react-native

Paytm Custom Ui sdk plugin

Installation

npm install paytm-customuisdk-react-native --save

Implementation

Android Implementation

Open MainApplication.java class in android directory of react native project

import com.paytm.PaytmCustomuisdkPackage;

Then add new PaytmCustomuisdkPackage() to the list return in getPackages() method

@Override
       protected List<ReactPackage> getPackages() {
         @SuppressWarnings("UnnecessaryLocalVariable")
         List<ReactPackage> packages = new PackageList(this).getPackages();
         // Packages that cannot be autolinked yet can be added manually here, for example:
         packages.add(new PaytmCustomuisdkPackage());
         return packages;
       }



Append the following line to settings.gradle file.

include ':paytm-customuisdk-react-native'
project(':paytm-customuisdk-react-native').projectDir = new File(rootProject.projectDir, '../node_modules/paytm-customuisdk-react-native/android')

Add the following lines in the dependencies section of your app’s build.gradle file.

implementation project(':paytm-customuisdk-react-native');

iOS Implementation

 1: Open Podfile and Update Platform Version
      Navigate to the ios folder and open Podfile. You can do this using the following code.
   $ cd ios && open podfile.

Usage

import PaytmCustomuisdk, { PaytmConsentCheckBox } from 'paytm-customuisdk-react-native';


// ...

fetchAuthCode() {
   PaytmCustomuisdk.fetchAuthCode(clientId, mid)
       .then((res) => {
         setResult(JSON.stringify(res));
         setAuthCode(res.response);
       })
       .catch((err) => {
         setResult(err.message);
       });
 }

return (
          <View style={{ padding: 8 }}>
             <View>
               <PaytmConsentCheckBox
                 onChange={(e: boolean) => setAuthCheck(e)}
               />
             </View>
             <TextInput
               style={styles.textInput}
               defaultValue={clientId}
               placeholder={'Client Id'}
               onChangeText={(e) => setClientId(e)}
             />
             <View style={{ margin: 16 }}>
               <Button title="Fetch" onPress={() => fetchAuthCode()} />
             </View>
           </View>
 );

For more detail visit -> https://developer.paytm.com/docs/custom-ui-sdk/