[BUG] [P2] Android Connect Embedded Payment Component - Payment details view cutoff and not scrollable, no back navigation

[farnell]

When clicking on a payment in the Payments embedded component, the payment details view opens but is cutoff with no scrolling, and there's no way to navigate back to the payments list.

Environment

• SDK Version: com.stripe:connect:21.28.2
• Device: Stripe S700 terminal
• Android API Level: 34+
• Compose Version: Latest stable

Steps to Reproduce

1. Initialize EmbeddedComponentManager with account session
2. Create payments view: manager.createPaymentsView(context)
3. Embed in Compose AndroidView with Modifier.fillMaxSize()
4. Payments list displays and scrolls correctly ✅
5. Click on any payment item in the list
6. Payment details view opens

Expected Behavior

• Payment details view should be fully visible
• Details content should scroll if it exceeds viewport
• Back button or close affordance should return to payments list
• Similar to web implementation behavior

Actual Behavior

• ❌ Payment details content is cutoff at viewport boundary
• ❌ Details view is not scrollable
• ❌ No way to exit the details view (back button doesn't work, no close button visible)
• User is stuck on the details view

Code Sample

@OptIn(PreviewConnectSDK::class)
@composable
fun StripeConnectModal(
connectViewModel: ConnectViewModel,
onDismiss: () -> Unit
) {
val context = LocalContext.current
val embeddedComponentManager by connectViewModel.embeddedComponentManager.collectAsState()

  Dialog(
      onDismissRequest = onDismiss,
      properties = DialogProperties(
          usePlatformDefaultWidth = false,
          decorFitsSystemWindows = false
      )
  ) {
      Surface(modifier = Modifier.fillMaxSize()) {
          embeddedComponentManager?.let { manager ->
              // Views hoisted to preserve state
              val paymentsView = remember(manager) {
                  manager.createPaymentsView(context)
              }

              AndroidView(
                  factory = { paymentsView },
                  update = { view ->
                      ViewCompat.setNestedScrollingEnabled(view, true)
                  },
                  modifier = Modifier.fillMaxSize()
              )
          }
      }
  }

}

What We've Tried

• ✅ Enabled nested scrolling via ViewCompat.setNestedScrollingEnabled()
• ✅ Hoisted view creation using remember() to preserve internal state
• ✅ Removed BackHandler to avoid consuming back events
• ✅ Full-screen Dialog with no constraints
• ✅ Various layout modifiers (fillMaxSize, weight, BoxWithConstraints)

Additional Context

• The main payments list works perfectly - scrolls correctly
• Issue only occurs with the detail view that opens when clicking a payment
• Similar behavior on payouts detail view
• Web implementation shows scrollable details with working back navigation
• Device back button doesn't close the detail view

Question

Is there a specific configuration needed for the embedded component's internal navigation/modals to work correctly in AndroidView?
Or is this a known limitation of the preview SDK?

[toluo-stripe]

Hi @farnell,

Please could you provide a video of the issue you're experiencing if possible. That would help us to understand the problem better.

Thanks,
Tolu.

[farnell]

IMG_0622.MOV

[farnell]

@toluo-stripe any updates on this? it's unusable in this state as the user gets stuck in the secondary screens and can't return to the primary connect screen. If you need any further detail let me know

[torrance-stripe]

Hey @farnell, thanks for the detailed report! Might be a bit before we can get back to this, but will keep you updated and report back here.