@stripe/stripe-react-native 0.56.0 → 0.57.1

package/android/src/main/java/com/reactnativestripesdk/StripeAbstractComposeView.kt

@@ -1,6 +1,7 @@
 package com.reactnativestripesdk
 
 import android.content.Context
+import android.widget.FrameLayout
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.platform.AbstractComposeView
 import androidx.compose.ui.platform.ViewCompositionStrategy
@@ -17,13 +18,24 @@ import androidx.savedstate.setViewTreeSavedStateRegistryOwner
 import com.facebook.react.bridge.ReactContext
 
 /**
+ * A wrapper around Compose views that safely handles React Native's layout system.
+ *
+ * This uses a FrameLayout wrapper pattern to solve the "Cannot locate windowRecomposer;
+ * View is not attached to a window" crash that occurs when React Native measures views
+ * before they are attached to the window hierarchy. By extending FrameLayout instead of
+ * AbstractComposeView directly, the view can be safely measured before the Compose
+ * infrastructure is ready.
+ *
+ * The inner ComposeView is only created when the wrapper is attached to the window,
+ * ensuring the WindowRecomposer is always available.
+ *
  * Compose disposes views by default when using Fragments, which is not compatible with how
  * react-native-screens work. To avoid this we change the composition strategy to use the
  * activity lifecycle instead of the fragment. Note that `setViewTreeLifecycleOwner` also
  * needs to be set otherwise a different code path will dispose of the view.
  *
  * **IMPORTANT** Views using this will need to call `handleOnDropViewInstance` manually to avoid leaking.
- * This can be done using the using the following code in the view manager:
+ * This can be done using the following code in the view manager:
  *
  * ```
  * override fun onDropViewInstance(view: SomeStripeAbstractComposeView) {
@@ -35,7 +47,7 @@ import com.facebook.react.bridge.ReactContext
  */
 abstract class StripeAbstractComposeView(
   context: Context,
-) : AbstractComposeView(context) {
+) : FrameLayout(context) {
   /**
    * Dummy compose view that will be added at the root of the app, this is needed so that the context
    * that compose needs is already initialized and we can set it directly on our compose views.
@@ -55,6 +67,7 @@ abstract class StripeAbstractComposeView(
     }
   }
 
+  private var innerComposeView: InnerComposeView? = null
   private var isLifecycleSetup = false
 
   // Create a lifecycle this is tied to the activity, but that we can manually
@@ -67,24 +80,35 @@ abstract class StripeAbstractComposeView(
     }
   private var lifecycleRegistry = LifecycleRegistry(lifecycleOwner)
 
-  init {
-    // Setup lifecycles
-    setViewCompositionStrategy(
-      ViewCompositionStrategy.DisposeOnLifecycleDestroyed(lifecycleOwner = lifecycleOwner),
-    )
-    setViewTreeLifecycleOwner(lifecycleOwner = lifecycleOwner)
-
-    // Setup context from dummy compose view.
-    (context as ReactContext).getNativeModule(StripeSdkModule::class.java)?.composeCompatView?.let {
-      setParentCompositionContext(it.findViewTreeCompositionContext())
-      setViewTreeSavedStateRegistryOwner(it.findViewTreeSavedStateRegistryOwner())
-      setViewTreeViewModelStoreOwner(it.findViewTreeViewModelStoreOwner())
-    }
-  }
-
   override fun onAttachedToWindow() {
     super.onAttachedToWindow()
+    ensureComposeViewCreated()
+    setupActivityLifecycleObserver()
+  }
+
+  private fun ensureComposeViewCreated() {
+    if (innerComposeView != null) return
+
+    innerComposeView =
+      InnerComposeView(context).also { cv ->
+        // Setup lifecycles
+        cv.setViewCompositionStrategy(
+          ViewCompositionStrategy.DisposeOnLifecycleDestroyed(lifecycleOwner = lifecycleOwner),
+        )
+        cv.setViewTreeLifecycleOwner(lifecycleOwner = lifecycleOwner)
 
+        // Setup context from dummy compose view (now safe since we're attached to window)
+        (context as? ReactContext)?.getNativeModule(StripeSdkModule::class.java)?.composeCompatView?.let {
+          cv.setParentCompositionContext(it.findViewTreeCompositionContext())
+          cv.setViewTreeSavedStateRegistryOwner(it.findViewTreeSavedStateRegistryOwner())
+          cv.setViewTreeViewModelStoreOwner(it.findViewTreeViewModelStoreOwner())
+        }
+
+        addView(cv, LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT))
+      }
+  }
+
+  private fun setupActivityLifecycleObserver() {
     if (isLifecycleSetup) {
       return
     }
@@ -111,4 +135,16 @@ abstract class StripeAbstractComposeView(
       lifecycleRegistry.handleLifecycleEvent(Lifecycle.Event.ON_DESTROY)
     }
   }
+
+  @Composable
+  abstract fun Content()
+
+  private inner class InnerComposeView(
+    context: Context,
+  ) : AbstractComposeView(context) {
+    @Composable
+    override fun Content() {
+      this@StripeAbstractComposeView.Content()
+    }
+  }
 }