fix(chat): stabilize Facebook keyboard fallback

src/app/chat/hooks/chat-keyboard-geometry.ts

@@ -1,17 +1,24 @@
 export const CHAT_KEYBOARD_VISIBLE_THRESHOLD_PX = 80;
 export const CHAT_KEYBOARD_ZOOM_THRESHOLD = 1.05;
 export const CHAT_KEYBOARD_TARGET_GAP_PX = 16;
-export const CHAT_KEYBOARD_FALLBACK_RATIO = 0.42;
-export const CHAT_KEYBOARD_FALLBACK_MIN_PX = 260;
-export const CHAT_KEYBOARD_FALLBACK_MAX_PX = 380;
+export const CHAT_KEYBOARD_FALLBACK_WIDTH_RATIO = 0.77;
+export const CHAT_KEYBOARD_FALLBACK_HEIGHT_RATIO = 0.42;
+export const CHAT_KEYBOARD_FALLBACK_MIN_PX = 240;
+export const CHAT_KEYBOARD_FALLBACK_MAX_PX = 340;
 
 const CHAT_KEYBOARD_MAX_INSET_RATIO = 0.55;
 
 export interface ChatKeyboardViewportBaseline {
   layoutHeight: number;
+  layoutWidth: number;
   visualHeight: number;
 }
 
+export type ChatKeyboardFallbackViewport = Pick<
+  ChatKeyboardViewportBaseline,
+  "layoutHeight" | "layoutWidth"
+>;
+
 export interface ChatKeyboardViewportSnapshot {
   layoutHeight: number;
   visualHeight: number;
@@ -80,13 +87,17 @@ export function resolveChatKeyboardInset(
 }
 
 export function resolveChatKeyboardFallbackInset(
-  layoutHeight: number,
+  viewport: ChatKeyboardFallbackViewport,
 ): number {
+  const widthEstimate =
+    viewport.layoutWidth * CHAT_KEYBOARD_FALLBACK_WIDTH_RATIO;
+  const heightLimit =
+    viewport.layoutHeight * CHAT_KEYBOARD_FALLBACK_HEIGHT_RATIO;
   const estimatedKeyboardHeight = Math.min(
     CHAT_KEYBOARD_FALLBACK_MAX_PX,
     Math.max(
       CHAT_KEYBOARD_FALLBACK_MIN_PX,
-      Math.round(layoutHeight * CHAT_KEYBOARD_FALLBACK_RATIO),
+      Math.round(Math.min(widthEstimate, heightLimit)),
     ),
   );