From 7b10cb2f67bf928e6498219e67b18df2b9e2413c Mon Sep 17 00:00:00 2001 From: GCyganek Date: Wed, 22 Apr 2026 11:52:24 +0200 Subject: [PATCH 1/3] Fix Android - Chat - Suggestion list is cut off on the left in landscape mode --- .../getSuggestionsLeftOffset/index.ios.ts | 8 ++++++++ .../getSuggestionsLeftOffset/index.ts | 10 ++++++++++ src/components/AutoCompleteSuggestions/index.tsx | 8 +------- 3 files changed, 19 insertions(+), 7 deletions(-) create mode 100644 src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ios.ts create mode 100644 src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ts diff --git a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ios.ts b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ios.ts new file mode 100644 index 000000000000..def72e2fa11c --- /dev/null +++ b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ios.ts @@ -0,0 +1,8 @@ +function getLeftOffset(x: number, leftInset: number, bigScreenLeftOffset: number, shouldUseNarrowLayout: boolean, isInLandscapeMode: boolean): number { + if (shouldUseNarrowLayout) { + return isInLandscapeMode ? x - leftInset : x; + } + return bigScreenLeftOffset; +} + +export default getLeftOffset; diff --git a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ts b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ts new file mode 100644 index 000000000000..8515aedfd174 --- /dev/null +++ b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ts @@ -0,0 +1,10 @@ +// leftInset and isInLandscapeMode are only needed to calculate the left offset for the suggestions menu on iOS +// eslint-disable-next-line @typescript-eslint/no-unused-vars +function getLeftOffset(x: number, leftInset: number, bigScreenLeftOffset: number, shouldUseNarrowLayout: boolean, isInLandscapeMode: boolean): number { + if (shouldUseNarrowLayout) { + return x; + } + return bigScreenLeftOffset; +} + +export default getLeftOffset; diff --git a/src/components/AutoCompleteSuggestions/index.tsx b/src/components/AutoCompleteSuggestions/index.tsx index 3d327c87125f..1d1b72f52951 100644 --- a/src/components/AutoCompleteSuggestions/index.tsx +++ b/src/components/AutoCompleteSuggestions/index.tsx @@ -7,6 +7,7 @@ import useWindowDimensionsForAutoCompleteSuggestions from '@hooks/useWindowDimen import {hasHoverSupport} from '@libs/DeviceCapabilities'; import CONST from '@src/CONST'; import AutoCompleteSuggestionsPortal from './AutoCompleteSuggestionsPortal'; +import getLeftOffset from './getSuggestionsLeftOffset'; import type {AutoCompleteSuggestionsProps, MeasureParentContainerAndCursor} from './types'; const measureHeightOfSuggestionRows = (numRows: number, canBeBig: boolean, isInLandscapeMode: boolean): number => { @@ -50,13 +51,6 @@ const initialContainerState = { cursorCoordinates: {x: 0, y: 0}, }; -function getLeftOffset(x: number, leftInset: number, bigScreenLeftOffset: number, shouldUseNarrowLayout: boolean, isInLandscapeMode: boolean): number { - if (shouldUseNarrowLayout) { - return isInLandscapeMode ? x - leftInset : x; - } - return bigScreenLeftOffset; -} - /** * On the mobile-web platform, when long-pressing on auto-complete suggestions, * we need to prevent focus shifting to avoid blurring the main input (which makes the suggestions picker close and fires the onSelect callback). From 36f9fb968c2047c765aa8ffe16cc45ff07aefa92 Mon Sep 17 00:00:00 2001 From: GCyganek Date: Fri, 24 Apr 2026 13:06:04 +0200 Subject: [PATCH 2/3] Fix newLeftOffset value on some Android devices --- .../getSuggestionsLeftOffset.ts | 28 +++++++++++++++++++ .../getSuggestionsLeftOffset/index.ios.ts | 8 ------ .../getSuggestionsLeftOffset/index.ts | 10 ------- .../AutoCompleteSuggestions/index.tsx | 5 ++-- 4 files changed, 30 insertions(+), 21 deletions(-) create mode 100644 src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset.ts delete mode 100644 src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ios.ts delete mode 100644 src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ts diff --git a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset.ts b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset.ts new file mode 100644 index 000000000000..0ea60da3d5a8 --- /dev/null +++ b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset.ts @@ -0,0 +1,28 @@ +import type {EdgeInsets} from 'react-native-safe-area-context'; + +function getLeftOffset( + x: number, + insets: EdgeInsets, + bigScreenLeftOffset: number, + shouldUseNarrowLayout: boolean, + menuWidth: number, + windowWidth: number, + isInLandscapeMode: boolean, +): number { + if (isInLandscapeMode) { + // Some Android devices have issue where they add insets.left to x value, so we need to subtract it to get the correct left offset. + if (x + insets.left + insets.right + menuWidth > windowWidth) { + return x - insets.left; + } + + return x; + } + + if (shouldUseNarrowLayout) { + return x; + } + + return bigScreenLeftOffset; +} + +export default getLeftOffset; diff --git a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ios.ts b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ios.ts deleted file mode 100644 index def72e2fa11c..000000000000 --- a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ios.ts +++ /dev/null @@ -1,8 +0,0 @@ -function getLeftOffset(x: number, leftInset: number, bigScreenLeftOffset: number, shouldUseNarrowLayout: boolean, isInLandscapeMode: boolean): number { - if (shouldUseNarrowLayout) { - return isInLandscapeMode ? x - leftInset : x; - } - return bigScreenLeftOffset; -} - -export default getLeftOffset; diff --git a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ts b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ts deleted file mode 100644 index 8515aedfd174..000000000000 --- a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset/index.ts +++ /dev/null @@ -1,10 +0,0 @@ -// leftInset and isInLandscapeMode are only needed to calculate the left offset for the suggestions menu on iOS -// eslint-disable-next-line @typescript-eslint/no-unused-vars -function getLeftOffset(x: number, leftInset: number, bigScreenLeftOffset: number, shouldUseNarrowLayout: boolean, isInLandscapeMode: boolean): number { - if (shouldUseNarrowLayout) { - return x; - } - return bigScreenLeftOffset; -} - -export default getLeftOffset; diff --git a/src/components/AutoCompleteSuggestions/index.tsx b/src/components/AutoCompleteSuggestions/index.tsx index 1d1b72f52951..89ffabe87f16 100644 --- a/src/components/AutoCompleteSuggestions/index.tsx +++ b/src/components/AutoCompleteSuggestions/index.tsx @@ -72,7 +72,6 @@ function AutoCompleteSuggestions({measureParentContainerAndReportCu const insets = useSafeAreaInsets(); const {keyboardHeight, isKeyboardAnimatingRef} = useKeyboardState(); const {paddingBottom: bottomInset, paddingTop: topInset} = StyleUtils.getPlatformSafeAreaPadding(insets ?? undefined); - const {left: leftInset} = insets; useEffect(() => { const container = containerRef.current; @@ -130,7 +129,7 @@ function AutoCompleteSuggestions({measureParentContainerAndReportCu topInset, }); - const newLeftOffset = getLeftOffset(x, leftInset, bigScreenLeftOffset, shouldUseNarrowLayout, isInLandscapeMode); + const newLeftOffset = getLeftOffset(x, insets, bigScreenLeftOffset, shouldUseNarrowLayout, width, windowWidth, isInLandscapeMode); // If the suggested word is longer than 150 (approximately half the width of the suggestion popup), then adjust a new position of popup const isAdjustmentNeeded = Math.abs(prevLeftValue.current - bigScreenLeftOffset) > 150; if (isInitialRender.current || isAdjustmentNeeded || prevIsInLandscapeModeValue.current !== isInLandscapeMode) { @@ -173,7 +172,7 @@ function AutoCompleteSuggestions({measureParentContainerAndReportCu topInset, isKeyboardAnimatingRef, isInLandscapeMode, - leftInset, + insets, ]); // Prevent rendering if container dimensions are not set or if we have no suggestions From a5cf540a54e48717388c0627a6ec331e1372f808 Mon Sep 17 00:00:00 2001 From: GCyganek Date: Tue, 5 May 2026 12:00:17 +0200 Subject: [PATCH 3/3] Fix newLeftOffset on Android --- .../AutoCompleteSuggestions/getSuggestionsLeftOffset.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset.ts b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset.ts index 0ea60da3d5a8..c1fab5633844 100644 --- a/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset.ts +++ b/src/components/AutoCompleteSuggestions/getSuggestionsLeftOffset.ts @@ -10,8 +10,9 @@ function getLeftOffset( isInLandscapeMode: boolean, ): number { if (isInLandscapeMode) { - // Some Android devices have issue where they add insets.left to x value, so we need to subtract it to get the correct left offset. - if (x + insets.left + insets.right + menuWidth > windowWidth) { + // On Android devices, sometimes x takes into consideration the insets.left value, sometimes not + // so in case it does we want to subtract it to get the correct left offset. + if (x - insets.left >= 0) { return x - insets.left; }