@yuno-payments/yuno-sdk-react-native 1.0.16

package/android/build.gradle

@@ -0,0 +1,131 @@
+buildscript {
+    ext.kotlin_version = '1.9.24'
+    repositories {
+        google()
+        mavenCentral()
+    }
+
+    dependencies {
+        classpath 'com.android.tools.build:gradle:8.1.0'
+        classpath "org.jetbrains.kotlin:kotlin-gradle-plugin:$kotlin_version"
+    }
+}
+
+def isNewArchitectureEnabled() {
+    return rootProject.hasProperty("newArchEnabled") &&  rootProject.getProperty("newArchEnabled") == "true"
+}
+
+apply plugin: 'com.android.library'
+apply plugin: 'kotlin-android'
+
+if (isNewArchitectureEnabled()) {
+    apply plugin: "com.facebook.react"
+}
+
+def getExtOrDefault(name) {
+    return rootProject.ext.has(name) ? rootProject.ext.get(name) : project.properties['YunoSdk_' + name]
+}
+
+def getExtOrIntegerDefault(name) {
+    return rootProject.ext.has(name) ? rootProject.ext.get(name) : (project.properties['YunoSdk_' + name]).toInteger()
+}
+
+def supportsNamespace() {
+    def parsed = com.android.Version.ANDROID_GRADLE_PLUGIN_VERSION.tokenize('.')
+    def major = parsed[0].toInteger()
+    def minor = parsed[1].toInteger()
+
+    // Namespace support was added in 7.3.0
+    return (major == 7 && minor >= 3) || major >= 8
+}
+
+android {
+    if (supportsNamespace()) {
+        namespace "com.yunosdkreactnative"
+
+        sourceSets {
+            main {
+                manifest.srcFile "src/main/AndroidManifestNew.xml"
+            }
+        }
+    }
+
+    compileSdkVersion getExtOrIntegerDefault('compileSdkVersion')
+
+    defaultConfig {
+        minSdkVersion getExtOrIntegerDefault('minSdkVersion')
+        targetSdkVersion getExtOrIntegerDefault('targetSdkVersion')
+    }
+
+    buildTypes {
+        release {
+            minifyEnabled false
+        }
+    }
+
+    lintOptions {
+        disable 'GradleCompatible'
+    }
+
+    compileOptions {
+        sourceCompatibility JavaVersion.VERSION_17
+        targetCompatibility JavaVersion.VERSION_17
+    }
+
+    kotlinOptions {
+        jvmTarget = '17'
+    }
+    
+    kotlin {
+        jvmToolchain(17)
+    }
+    
+    buildFeatures {
+        compose true
+    }
+    
+    composeOptions {
+        kotlinCompilerExtensionVersion = "1.5.14"
+    }
+}
+
+repositories {
+    mavenCentral()
+    google()
+    maven {
+        url "https://yunopayments.jfrog.io/artifactory/snapshots-libs-release"
+    }
+}
+
+def kotlin_version = getExtOrDefault('kotlinVersion')
+
+dependencies {
+    // For < 0.71, this will be from the local maven repo
+    // For > 0.71, this will be replaced by `com.facebook.react:react-android:$version` by react gradle plugin
+    //noinspection GradleDynamicVersion
+    implementation 'com.facebook.react:react-native:+'
+    implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
+    
+    // Yuno Android SDK
+    implementation "com.yuno.payments:android-sdk:2.7.0"
+    implementation "androidx.appcompat:appcompat:1.6.1"
+    
+    // Jetpack Compose (required for YunoPaymentMethodsViewManager)
+    implementation platform('androidx.compose:compose-bom:2023.10.01')
+    implementation 'androidx.compose.ui:ui'
+    implementation 'androidx.compose.ui:ui-tooling-preview'
+    implementation 'androidx.compose.foundation:foundation' // For Column, verticalScroll, etc.
+    implementation 'androidx.activity:activity-compose:1.8.2'
+    
+    // Gson for JSON serialization
+    implementation 'com.google.code.gson:gson:2.10.1'
+}
+
+if (isNewArchitectureEnabled()) {
+    react {
+        jsRootDir = file("../src/")
+        libraryName = "YunoSdk"
+        codegenJavaPackageName = "com.yunosdkreactnative"
+    }
+}
+

package/android/gradle.properties

@@ -0,0 +1,5 @@
+YunoSdk_kotlinVersion=1.9.25
+YunoSdk_minSdkVersion=21
+YunoSdk_targetSdkVersion=33
+YunoSdk_compileSdkVersion=34
+

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1,4 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android"
+          package="com.yunosdkreactnative">
+</manifest>
+

package/android/src/main/java/com/yunosdkreactnative/YunoPaymentMethodsViewManager.kt

@@ -0,0 +1,194 @@
+package com.yunosdkreactnative
+
+import android.view.View
+import android.widget.LinearLayout
+import androidx.compose.ui.platform.ComposeView
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.rememberScrollState
+import androidx.compose.foundation.verticalScroll
+import androidx.compose.ui.Modifier
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.bridge.ReactContext
+import com.facebook.react.bridge.ReadableArray
+import com.facebook.react.bridge.WritableMap
+import com.facebook.react.uimanager.SimpleViewManager
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.annotations.ReactProp
+import com.facebook.react.uimanager.events.RCTEventEmitter
+import com.facebook.react.modules.core.DeviceEventManagerModule
+import com.yuno.presentation.core.components.PaymentMethodListViewComponent
+import com.yuno.sdk.payments.updateCheckoutSession
+
+/**
+ * ViewManager for YunoPaymentMethodsView.
+ * 
+ * This component embeds the native Yuno SDK PaymentMethodListViewComponent
+ * into React Native, allowing developers to display payment methods in their app.
+ * 
+ * Similar to Flutter's implementation using Platform Views.
+ */
+class YunoPaymentMethodsViewManager(
+    private val reactContext: ReactApplicationContext
+) : SimpleViewManager<View>() {
+
+    companion object {
+        private const val TAG = "YunoPaymentMethodsViewManager"
+        const val REACT_CLASS = "YunoPaymentMethodsView"
+        
+        // Event names
+        private const val EVENT_ON_PAYMENT_SELECTED = "onPaymentMethodSelected"
+        private const val EVENT_ON_ERROR = "onPaymentMethodError"
+    }
+
+    override fun getName(): String = REACT_CLASS
+
+    /**
+     * Creates the native view that embeds the Yuno PaymentMethodListViewComponent.
+     */
+    override fun createViewInstance(reactContext: ThemedReactContext): View {
+
+        // Get current activity
+        val activity = reactContext.currentActivity
+        if (activity == null) {
+            // Return empty view as fallback
+            return View(reactContext)
+        }
+
+        // Create ComposeView to embed Jetpack Compose component
+        val composeView = ComposeView(reactContext).apply {
+            layoutParams = LinearLayout.LayoutParams(
+                LinearLayout.LayoutParams.MATCH_PARENT,
+                LinearLayout.LayoutParams.MATCH_PARENT // Changed to MATCH_PARENT for scrolling
+            )
+            
+            // Set the Compose content with the native Yuno component wrapped in a scrollable Column
+            setContent {
+                val scrollState = rememberScrollState()
+                Column(
+                    modifier = Modifier
+                        .fillMaxSize()
+                        .verticalScroll(scrollState)
+                ) {
+                    PaymentMethodListViewComponent(
+                        activity = activity,
+                        onPaymentSelected = { isSelected ->
+                            emitPaymentSelectedEvent(reactContext, isSelected)
+                        },
+                        onUnEnrollSuccess = {
+                        }
+                    )
+                }
+            }
+        }
+
+        return composeView
+    }
+
+    /**
+     * Sets the checkout session and updates the native SDK.
+     * This must be called before the payment methods can be displayed.
+     */
+    @ReactProp(name = "checkoutSession")
+    fun setCheckoutSession(view: View, checkoutSession: String?) {
+        if (checkoutSession == null) {
+            return
+        }
+        
+        
+        // Store for later use with country code
+        view.setTag("checkout_session".hashCode(), checkoutSession)
+        
+        // Update if we also have country code
+        val countryCode = view.getTag("country_code".hashCode()) as? String
+        if (countryCode != null) {
+            updateCheckoutSessionInActivity(view, checkoutSession, countryCode)
+        }
+    }
+
+    /**
+     * Sets the country code for the payment methods.
+     */
+    @ReactProp(name = "countryCode")
+    fun setCountryCode(view: View, countryCode: String?) {
+        if (countryCode == null) {
+            return
+        }
+        
+        
+        // Store for later use with checkout session
+        view.setTag("country_code".hashCode(), countryCode)
+        
+        // Update if we also have checkout session
+        val checkoutSession = view.getTag("checkout_session".hashCode()) as? String
+        if (checkoutSession != null) {
+            updateCheckoutSessionInActivity(view, checkoutSession, countryCode)
+        }
+    }
+
+    /**
+     * Updates the checkout session in the current activity.
+     */
+    private fun updateCheckoutSessionInActivity(
+        view: View,
+        checkoutSession: String,
+        countryCode: String
+    ) {
+        val context = view.context as? ThemedReactContext
+        val activity = context?.currentActivity
+        
+        if (activity == null) {
+            emitErrorEvent(context, "Activity not available")
+            return
+        }
+
+        try {
+            activity.updateCheckoutSession(
+                checkoutSession = checkoutSession,
+                countryCode = countryCode
+            )
+        } catch (e: Exception) {
+            emitErrorEvent(context, e.message ?: "Unknown error")
+        }
+    }
+
+    /**
+     * Emits an event when a payment method is selected.
+     */
+    private fun emitPaymentSelectedEvent(context: ReactContext, isSelected: Boolean) {
+        val event: WritableMap = Arguments.createMap().apply {
+            putBoolean("isSelected", isSelected)
+        }
+        
+        context
+            .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter::class.java)
+            .emit(EVENT_ON_PAYMENT_SELECTED, event)
+    }
+
+    /**
+     * Emits an error event.
+     */
+    private fun emitErrorEvent(context: ReactContext?, message: String) {
+        if (context == null) return
+        
+        val event: WritableMap = Arguments.createMap().apply {
+            putString("message", message)
+        }
+        
+        context
+            .getJSModule(DeviceEventManagerModule.RCTDeviceEventEmitter::class.java)
+            .emit(EVENT_ON_ERROR, event)
+    }
+
+    /**
+     * Export event names to JavaScript.
+     */
+    override fun getExportedCustomDirectEventTypeConstants(): MutableMap<String, Any> {
+        return mutableMapOf(
+            EVENT_ON_PAYMENT_SELECTED to mapOf("registrationName" to "onPaymentMethodSelected"),
+            EVENT_ON_ERROR to mapOf("registrationName" to "onPaymentMethodError")
+        )
+    }
+}
+