From 102ef06c30dc650d1756a8094c3b6e1a1b14ad08 Mon Sep 17 00:00:00 2001
From: Huss Martinez <22710836+hussmartinez@users.noreply.github.com>
Date: Tue, 7 Apr 2026 09:26:53 +0700
Subject: [PATCH] fix: show direct connection and pairing modal content on
 tablets (#211)

On tablet-sized layouts the welcome-screen modals for direct connection and pair link could collapse so only the header row remained visible.

Adjust the desktop modal card and scroll container flex behavior so the modal body can shrink within the available height and remain visible instead of being clipped out.
---
 packages/app/src/components/adaptive-modal-sheet.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/app/src/components/adaptive-modal-sheet.tsx b/packages/app/src/components/adaptive-modal-sheet.tsx
index a9c282f4f..a3ccd5f28 100644
--- a/packages/app/src/components/adaptive-modal-sheet.tsx
+++ b/packages/app/src/components/adaptive-modal-sheet.tsx
@@ -28,6 +28,8 @@ const styles = StyleSheet.create((theme) => ({
     width: "100%",
     maxWidth: 520,
     maxHeight: "85%",
+    flexShrink: 1,
+    minHeight: 0,
     backgroundColor: theme.colors.surface1,
     borderRadius: theme.borderRadius.xl,
     borderWidth: 1,
@@ -54,11 +56,13 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface2,
   },
   desktopScroll: {
-    flex: 1,
+    flexShrink: 1,
+    minHeight: 0,
   },
   desktopContent: {
     padding: theme.spacing[6],
     gap: theme.spacing[4],
+    flexGrow: 1,
   },
   bottomSheetHandle: {
     backgroundColor: theme.colors.surface2,