[Bug]: Android DaPP connection is partially cutoff

[DostoevskysPiano]

Describe the bug

The top is cutoff for DaPP connection on Android devices. No issue on iPhone.

Expected behavior

It should not be cutoff.

Screenshots/Recordings

Steps to reproduce

1. Connect to DaPP
2. Notice top cutoff

Error messages or log output

Detection stage

During release testing

Version

7.59

Build type

None

Device

Samsung A32

Operating system

Android

Additional context

No response

Severity

No response

[Unik0rnMaggie]

Reproduced on Android, Pixel 6 Pro device:

[mm-token-exchange-service]

Triage Agent -- Classification

Severity: Sev2 (confidence: 0.80) ⚠️ Advisory

The dApp connection approval UI is partially cut off on Android, making it difficult (but not impossible) for users to interact with the connection request. This affects a core flow (dApp connection) on one platform (Android). Users may still be able to connect by scrolling or interacting with visible portions, but the experience is degraded. Not a complete blocker since iOS works fine.
Not auto-applied -- confidence below threshold.

Size: size-S (confidence: 0.75) ⚠️ Advisory

This is likely a platform-specific styling/layout issue in the BottomSheet or its dialog component. The fix probably involves adjusting padding, margins, or the KeyboardAvoidingView offset for Android. Looking at the BottomSheet code, the KeyboardAvoidingView has different behavior for iOS vs Android (behavior is undefined for Android, and keyboardVerticalOffset uses frameY for Android vs -screenBottomPadding for iOS). The fix is likely a small CSS/style adjustment or a safe area inset correction.
Not auto-applied -- confidence below threshold.

Team: team-mobile-ux ✅

Matched via area fallback: area-ui (no CODEOWNERS match)

---

Root Cause Analysis

Affected component: BottomSheet / BottomSheetDialog / KeyboardAvoidingView

The BottomSheet component wraps its content in a KeyboardAvoidingView that has platform-specific configuration. On Android, the keyboardVerticalOffset is set to frameY (from useSafeAreaFrame), while on iOS it uses -screenBottomPadding. The frameY value represents the Y coordinate of the safe area frame, which on some Android devices (especially those with notches, status bars, or navigation bars) can cause the content to be pushed up or clipped at the top. Additionally, the BottomSheetDialog may not properly account for the Android status bar or safe area insets when calculating its maximum height, causing the top portion of the sheet content to extend beyond the visible area. The fact that this is Android-only strongly points to either the KeyboardAvoidingView offset calculation or the BottomSheetDialog's height constraints not properly accounting for Android-specific safe area insets.

Evidence:

• BottomSheet.tsx uses Platform.OS === 'ios' check with different keyboardVerticalOffset values: -screenBottomPadding for iOS, frameY for Android
• KeyboardAvoidingView behavior is set to 'padding' on iOS but undefined on Android
• The issue is Android-specific, matching the platform-conditional code paths in BottomSheet
• The AccountConnect component renders inside BottomSheet and the top portion is cut off, suggesting the sheet's content area extends beyond the visible viewport on Android
• Reporter version is 7.59, indicating this is a recent regression or long-standing Android layout issue

Suggested Fix

Confidence: medium: likely but needs investigation - the platform-specific code in BottomSheet is the strongest lead, but the exact root cause requires checking BottomSheetDialog's height calculation which isn't in the provided context

Investigate and fix the BottomSheet's height calculation and safe area handling on Android. The most likely culprit is either the KeyboardAvoidingView's keyboardVerticalOffset using frameY incorrectly, or the BottomSheetDialog not properly constraining its height to account for the Android status bar / safe area insets.

Target files: app/component-library/components/BottomSheets/BottomSheet/BottomSheet.tsx, app/component-library/components/BottomSheets/BottomSheet/BottomSheet.styles.ts, app/component-library/components/BottomSheets/BottomSheet/foundation/BottomSheetDialog/BottomSheetDialog.tsx
Target functions: BottomSheet (forwardRef component), BottomSheetDialog, styleSheet (BottomSheet.styles)

Approach:

1. Check BottomSheetDialog.tsx to see how it calculates max height - it likely uses useSafeAreaFrame or useSafeAreaInsets and may not properly account for the top inset on Android.
2. In BottomSheet.tsx, the keyboardVerticalOffset for Android is set to frameY which may be incorrect for non-keyboard scenarios. Consider whether this offset is causing the content to shift upward.
3. Ensure the BottomSheetDialog applies proper top safe area inset padding on Android (e.g., using useSafeAreaInsets().top) to prevent content from being clipped by the status bar or notch.
4. Check if the BottomSheet styles (BottomSheet.styles.ts) have any maxHeight constraints that don't account for the top inset on Android.
5. Test the fix on multiple Android devices with different notch/status bar configurations.

---

Confidence threshold: 0.85. Labels marked ✅ were auto-applied. Labels marked ⚠️ are advisory only (below threshold).
To re-triage, remove the ta-bot-triage label and re-apply ta-needs-triage.
⚠️ Some dimensions could not be confidently classified. An engineer should review this issue.