zixflow-reactnative 1.0.0

package/android/src/main/java/io/customer/reactnative/sdk/messaginginapp/NativeMessagingInAppModule.kt

@@ -0,0 +1,215 @@
+package io.customer.reactnative.sdk.messaginginapp
+
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.Promise
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.bridge.ReadableMap
+import io.customer.messaginginapp.MessagingInAppModuleConfig
+import io.customer.messaginginapp.ModuleMessagingInApp
+import io.customer.messaginginapp.di.inAppMessaging
+import io.customer.messaginginapp.gist.data.model.InboxMessage
+import io.customer.messaginginapp.gist.data.model.response.InboxMessageFactory
+import io.customer.messaginginapp.inbox.NotificationInbox
+import io.customer.reactnative.sdk.NativeCustomerIOMessagingInAppSpec
+import io.customer.reactnative.sdk.constant.Keys
+import io.customer.reactnative.sdk.extension.getTypedValue
+import io.customer.reactnative.sdk.extension.toMap
+import io.customer.sdk.CustomerIO
+import io.customer.sdk.CustomerIOBuilder
+import io.customer.sdk.core.di.SDKComponent
+import io.customer.sdk.core.util.Logger
+import io.customer.sdk.data.model.Region
+
+/**
+ * React Native module implementation for Customer.io In-App Messaging Native SDK
+ * using TurboModules with new architecture.
+ */
+class NativeMessagingInAppModule(
+    reactContext: ReactApplicationContext,
+) : NativeCustomerIOMessagingInAppSpec(reactContext) {
+    private val logger: Logger = SDKComponent.logger
+    private val inAppMessagingModule: ModuleMessagingInApp?
+        get() = runCatching { CustomerIO.instance().inAppMessaging() }.getOrNull()
+
+    private val inAppEventListener = ReactInAppEventListener.instance
+    private val inboxChangeListener = ReactNotificationInboxChangeListener.instance
+
+    // Dedicated lock for inbox listener setup to avoid blocking other operations
+    private val inboxListenerLock = Any()
+    private var isInboxChangeListenerSetup = false
+
+    /**
+     * Returns NotificationInbox instance if available, null otherwise, logging error on failure.
+     * Note: Notification Inbox is only available after SDK is initialized.
+     */
+    private fun requireInboxInstance(): NotificationInbox? {
+        val inbox = inAppMessagingModule?.inbox()
+        if (inbox == null) {
+            logger.error("Notification Inbox is not available. Ensure CustomerIO SDK is initialized.")
+        }
+        return inbox
+    }
+
+    override fun initialize() {
+        super.initialize()
+        inAppEventListener.setEventEmitter { data ->
+            emitOnInAppEventReceived(data)
+        }
+        // Note: Inbox change listener is set up lazily when inbox is first accessed via
+        // setupInboxListener() and not here as Notification Inbox becomes available only after
+        // CustomerIO.initialize() is called, which may not have happened yet at this point.
+    }
+
+    override fun invalidate() {
+        inAppEventListener.clearEventEmitter()
+        clearInboxChangeListener()
+        super.invalidate()
+    }
+
+    override fun dismissMessage() {
+        inAppMessagingModule?.dismissMessage()
+    }
+
+    override fun setupInboxListener() {
+        setupInboxChangeListener()
+    }
+
+    override fun getMessages(topic: String?, promise: Promise?) {
+        try {
+            val inbox = requireInboxInstance() ?: run {
+                promise?.reject(
+                    "INBOX_NOT_AVAILABLE",
+                    "Notification Inbox is not available. Ensure CustomerIO SDK is initialized."
+                )
+                return
+            }
+
+            inbox.fetchMessages(topic) { result ->
+                result.onSuccess { messages ->
+                    val messagesArray = Arguments.createArray()
+                    messages.forEach { message ->
+                        messagesArray.pushMap(message.toWritableMap())
+                    }
+                    promise?.resolve(messagesArray)
+                }.onFailure { error ->
+                    promise?.reject(
+                        "FETCH_FAILED",
+                        error.localizedMessage ?: "Failed to fetch messages"
+                    )
+                }
+            }
+        } catch (e: Exception) {
+            promise?.reject("FETCH_ERROR", e.localizedMessage ?: "Unknown error")
+        }
+    }
+
+    override fun markMessageOpened(message: ReadableMap?) {
+        performInboxMessageAction(message) { inbox, inboxMessage ->
+            inbox.markMessageOpened(inboxMessage)
+        }
+    }
+
+    override fun markMessageUnopened(message: ReadableMap?) {
+        performInboxMessageAction(message) { inbox, inboxMessage ->
+            inbox.markMessageUnopened(inboxMessage)
+        }
+    }
+
+    override fun markMessageDeleted(message: ReadableMap?) {
+        performInboxMessageAction(message) { inbox, inboxMessage ->
+            inbox.markMessageDeleted(inboxMessage)
+        }
+    }
+
+    override fun trackMessageClicked(message: ReadableMap?, actionName: String?) {
+        performInboxMessageAction(message) { inbox, inboxMessage ->
+            inbox.trackMessageClicked(inboxMessage, actionName)
+        }
+    }
+
+    /**
+     * Sets up the inbox change listener to receive real-time updates.
+     * This method can be called multiple times safely and will only set up the listener once.
+     * Note: Inbox must be available (SDK initialized) before this can succeed.
+     */
+    private fun setupInboxChangeListener() {
+        synchronized(inboxListenerLock) {
+            // Only set up once to avoid duplicate listeners
+            if (isInboxChangeListenerSetup) {
+                return
+            }
+
+            val inbox = requireInboxInstance() ?: run {
+                logger.debug("Inbox not available yet, skipping listener setup")
+                return
+            }
+
+            inboxChangeListener.setEventEmitter(
+                emitter = { data ->
+                    emitSubscribeToMessagesChanged(data)
+                }
+            )
+            inbox.addChangeListener(inboxChangeListener)
+            isInboxChangeListenerSetup = true
+            logger.debug("NotificationInboxChangeListener set up successfully")
+        }
+    }
+
+    private fun clearInboxChangeListener() {
+        synchronized(inboxListenerLock) {
+            if (!isInboxChangeListenerSetup) {
+                return
+            }
+            requireInboxInstance()?.removeChangeListener(inboxChangeListener)
+            inboxChangeListener.clearEventEmitter()
+            isInboxChangeListenerSetup = false
+        }
+    }
+
+    /**
+     * Helper to validate inbox instance and message data before performing a message action.
+     * Returns early if inbox is unavailable or message data is invalid.
+     */
+    private fun performInboxMessageAction(
+        message: ReadableMap?,
+        action: (NotificationInbox, InboxMessage) -> Unit
+    ) {
+        val inbox = requireInboxInstance() ?: return
+        val inboxMessage = InboxMessageFactory.fromMap(message.toMap()) ?: run {
+            logger.error("Invalid message data: $message")
+            return
+        }
+        action(inbox, inboxMessage)
+    }
+
+    companion object {
+        internal const val NAME = "NativeCustomerIOMessagingInApp"
+
+        /**
+         * Adds InAppMessaging module to native Android SDK based on configuration provided by customer
+         * app.
+         *
+         * @param builder CustomerIOBuilder instance to add InAppMessaging module
+         * @param config Configuration provided by customer app for InAppMessaging module
+         * @param region Region to be used for InAppMessaging module
+         */
+        internal fun addNativeModuleFromConfig(
+            builder: CustomerIOBuilder,
+            config: Map<String, Any>,
+            region: Region
+        ) {
+            val siteId = config.getTypedValue<String>(Keys.Config.SITE_ID)
+            if (siteId.isNullOrBlank()) {
+                SDKComponent.logger.error("Site ID is required to initialize InAppMessaging module")
+                return
+            }
+
+            val module = ModuleMessagingInApp(
+                MessagingInAppModuleConfig.Builder(siteId = siteId, region = region).apply {
+                    setEventListener(eventListener = ReactInAppEventListener.instance)
+                }.build(),
+            )
+            builder.addCustomerIOModule(module)
+        }
+    }
+}

package/android/src/main/java/io/customer/reactnative/sdk/messaginginapp/NotificationInboxExtensions.kt

@@ -0,0 +1,23 @@
+package io.customer.reactnative.sdk.messaginginapp
+
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.WritableMap
+import io.customer.messaginginapp.gist.data.model.InboxMessage
+import io.customer.reactnative.sdk.extension.putOrNull
+import io.customer.reactnative.sdk.extension.toWritableArray
+import io.customer.reactnative.sdk.extension.toWritableMap
+
+// Converts an [InboxMessage] to a [WritableMap] for React Native bridge
+internal fun InboxMessage.toWritableMap(): WritableMap {
+    return Arguments.createMap().apply {
+        putString("queueId", queueId)
+        putOrNull("deliveryId", deliveryId) { k, v -> putString(k, v) }
+        putDouble("sentAt", sentAt.time.toDouble())
+        putOrNull("expiry", expiry) { k, v -> putDouble(k, v.time.toDouble()) }
+        putString("type", type)
+        putBoolean("opened", opened)
+        putArray("topics", topics.toWritableArray())
+        putOrNull("priority", priority) { k, v -> putInt(k, v) }
+        putMap("properties", properties.toWritableMap())
+    }
+}

package/android/src/main/java/io/customer/reactnative/sdk/messaginginapp/ReactInAppEventListener.kt

@@ -0,0 +1,77 @@
+package io.customer.reactnative.sdk.messaginginapp
+
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.ReadableMap
+import io.customer.messaginginapp.type.InAppEventListener
+import io.customer.messaginginapp.type.InAppMessage
+
+/**
+ * React Native bridge for Customer.io in-app messaging events.
+ * Converts native SDK events to JavaScript compatible format.
+ */
+class ReactInAppEventListener private constructor() : InAppEventListener {
+    // Event emitter function to send events to React Native layer
+    private var eventEmitter: ((ReadableMap) -> Unit)? = null
+
+    // Sets the event emitter function
+    internal fun setEventEmitter(emitter: ((ReadableMap) -> Unit)?) {
+        this.eventEmitter = emitter
+    }
+
+    // Clears the event emitter to prevent memory leaks
+    internal fun clearEventEmitter() {
+        this.eventEmitter = null
+    }
+
+    // Emits an in-app message event to React Native with unified event structure
+    private fun emitInAppEvent(
+        eventType: String,
+        message: InAppMessage,
+        actionValue: String? = null,
+        actionName: String? = null,
+    ) {
+        // Get the emitter, return early if not set
+        val emitter = eventEmitter ?: return
+
+        val data = buildMap {
+            put("eventType", eventType)
+            put("messageId", message.messageId)
+            put("deliveryId", message.deliveryId)
+            actionValue?.let { put("actionValue", it) }
+            actionName?.let { put("actionName", it) }
+        }
+
+        emitter.invoke(Arguments.makeNativeMap(data))
+    }
+
+    override fun errorWithMessage(message: InAppMessage) = emitInAppEvent(
+        eventType = "errorWithMessage",
+        message = message,
+    )
+
+    override fun messageActionTaken(
+        message: InAppMessage,
+        actionValue: String,
+        actionName: String,
+    ) = emitInAppEvent(
+        eventType = "messageActionTaken",
+        message = message,
+        actionValue = actionValue,
+        actionName = actionName,
+    )
+
+    override fun messageDismissed(message: InAppMessage) = emitInAppEvent(
+        eventType = "messageDismissed",
+        message = message,
+    )
+
+    override fun messageShown(message: InAppMessage) = emitInAppEvent(
+        eventType = "messageShown",
+        message = message,
+    )
+
+    companion object {
+        // Singleton instance with public visibility for direct access by Expo plugin
+        val instance: ReactInAppEventListener by lazy { ReactInAppEventListener() }
+    }
+}

package/android/src/main/java/io/customer/reactnative/sdk/messaginginapp/ReactInAppPlatformDelegate.kt

@@ -0,0 +1,37 @@
+package io.customer.reactnative.sdk.messaginginapp
+
+import android.view.View
+import com.facebook.react.bridge.Arguments
+import io.customer.messaginginapp.ui.bridge.WrapperPlatformDelegate
+import io.customer.reactnative.sdk.extension.sendUIEventToReactJS
+
+/**
+ * React Native platform delegate for in-app messaging.
+ * Bridges native in-app message events to React Native components.
+ *
+ * @param view The native Android view hosting the in-app message
+ */
+class ReactInAppPlatformDelegate(
+    view: View,
+) : WrapperPlatformDelegate(view) {
+    /**
+     * Dispatches in-app message events from native Android to React Native components.
+     * Converts native events to React Native UI events using the provided event name and payload.
+     */
+    override fun dispatchEvent(eventName: String, payload: Map<String, Any?>) {
+        view.sendUIEventToReactJS(
+            eventName = eventName,
+            payload = Arguments.makeNativeMap(payload),
+        )
+    }
+
+    // Internal helper method for dispatching events within the SDK.
+    internal fun dispatchEventInternal(eventName: String, payload: Map<String, Any?>) {
+        dispatchEvent(eventName, payload)
+    }
+
+    companion object {
+        // Event name constant for in-app message action clicks
+        const val ON_ACTION_CLICK = "onActionClick"
+    }
+}

package/android/src/main/java/io/customer/reactnative/sdk/messaginginapp/ReactInlineInAppMessageView.kt

@@ -0,0 +1,44 @@
+package io.customer.reactnative.sdk.messaginginapp
+
+import android.content.Context
+import android.util.AttributeSet
+import androidx.annotation.AttrRes
+import androidx.annotation.StyleRes
+import io.customer.messaginginapp.type.InAppMessage
+import io.customer.messaginginapp.type.InlineMessageActionListener
+import io.customer.messaginginapp.ui.InlineInAppMessageView
+import io.customer.messaginginapp.ui.core.WrapperInlineView
+
+/**
+ * React Native implementation of inline in-app message view extending [WrapperInlineView].
+ * Replacement for [InlineInAppMessageView] from native SDK to work seamlessly with React Native.
+ * Bridges native in-app message functionality with React Native event handling and layout system.
+ */
+class ReactInlineInAppMessageView @JvmOverloads constructor(
+    context: Context,
+    attrs: AttributeSet? = null,
+    @AttrRes defStyleAttr: Int = 0,
+    @StyleRes defStyleRes: Int = 0
+) : WrapperInlineView<ReactInAppPlatformDelegate>(
+    context, attrs, defStyleAttr, defStyleRes
+), InlineMessageActionListener {
+    override val platformDelegate = ReactInAppPlatformDelegate(view = this)
+
+    init {
+        initializeView()
+        setActionListener(this)
+    }
+
+    override fun onActionClick(message: InAppMessage, actionValue: String, actionName: String) {
+        val payload = mapOf(
+            "message" to mapOf(
+                "messageId" to message.messageId,
+                "deliveryId" to message.deliveryId,
+                "elementId" to elementId
+            ),
+            "actionValue" to actionValue,
+            "actionName" to actionName
+        )
+        platformDelegate.dispatchEventInternal(ReactInAppPlatformDelegate.ON_ACTION_CLICK, payload)
+    }
+}

package/android/src/main/java/io/customer/reactnative/sdk/messaginginapp/ReactNotificationInboxChangeListener.kt

@@ -0,0 +1,47 @@
+package io.customer.reactnative.sdk.messaginginapp
+
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.ReadableMap
+import io.customer.messaginginapp.gist.data.model.InboxMessage
+import io.customer.messaginginapp.inbox.NotificationInboxChangeListener
+
+class ReactNotificationInboxChangeListener private constructor() : NotificationInboxChangeListener {
+
+    // Event emitter function to send events to React Native layer
+    private var eventEmitter: ((ReadableMap) -> Unit)? = null
+
+    // Sets the event emitter function and message converter
+    internal fun setEventEmitter(emitter: ((ReadableMap) -> Unit)?) {
+        this.eventEmitter = emitter
+    }
+
+    // Clears the event emitter to prevent memory leaks
+    internal fun clearEventEmitter() {
+        this.eventEmitter = null
+    }
+
+    private fun emitMessagesUpdate(messages: List<InboxMessage>) {
+        // Get the emitter and converter, return early if not set
+        val emitter = eventEmitter ?: return
+
+        val messagesArray = Arguments.createArray()
+        messages.forEach { message ->
+            messagesArray.pushMap(message.toWritableMap())
+        }
+
+        val payload = Arguments.createMap().apply {
+            putArray("messages", messagesArray)
+        }
+
+        emitter.invoke(payload)
+    }
+
+    override fun onMessagesChanged(messages: List<InboxMessage>) {
+        emitMessagesUpdate(messages)
+    }
+
+    companion object {
+        // Singleton instance with public visibility for direct access
+        val instance: ReactNotificationInboxChangeListener by lazy { ReactNotificationInboxChangeListener() }
+    }
+}