diff --git a/src/components/PopoverMenu.tsx b/src/components/PopoverMenu.tsx index 9b5c0b1b6f5..b38d4280248 100644 --- a/src/components/PopoverMenu.tsx +++ b/src/components/PopoverMenu.tsx @@ -127,6 +127,9 @@ type PopoverMenuProps = Partial & { /** Whether to update the focused index on a row select */ shouldUpdateFocusedIndex?: boolean; + + /** Should we apply padding style in modal itself. If this value is false, we will handle it in ScreenWrapper */ + shouldUseModalPaddingStyle?: boolean; }; const renderWithConditionalWrapper = (shouldUseScrollView: boolean, contentContainerStyle: StyleProp, children: ReactNode): React.JSX.Element => { @@ -166,6 +169,7 @@ function PopoverMenu({ scrollContainerStyle, shouldUseScrollView = false, shouldUpdateFocusedIndex = true, + shouldUseModalPaddingStyle, }: PopoverMenuProps) { const styles = useThemeStyles(); const theme = useTheme(); @@ -338,6 +342,7 @@ function PopoverMenu({ useNativeDriver restoreFocusType={restoreFocusType} innerContainerStyle={innerContainerStyle} + shouldUseModalPaddingStyle={shouldUseModalPaddingStyle} > diff --git a/src/pages/Search/SearchTypeMenuNarrow.tsx b/src/pages/Search/SearchTypeMenuNarrow.tsx index 5a1aa7024fd..cd82e2279cf 100644 --- a/src/pages/Search/SearchTypeMenuNarrow.tsx +++ b/src/pages/Search/SearchTypeMenuNarrow.tsx @@ -14,8 +14,8 @@ import Text from '@components/Text'; import ThreeDotsMenu from '@components/ThreeDotsMenu'; import useDeleteSavedSearch from '@hooks/useDeleteSavedSearch'; import useLocalize from '@hooks/useLocalize'; -import useSafeAreaInsets from '@hooks/useSafeAreaInsets'; import useSingleExecution from '@hooks/useSingleExecution'; +import useStyledSafeAreaInsets from '@hooks/useStyledSafeAreaInsets'; import useStyleUtils from '@hooks/useStyleUtils'; import useTheme from '@hooks/useTheme'; import useThemeStyles from '@hooks/useThemeStyles'; @@ -63,7 +63,7 @@ function SearchTypeMenuNarrow({typeMenuItems, activeItemIndex, queryJSON, title, const [reports = {}] = useOnyx(ONYXKEYS.COLLECTION.REPORT); const taxRates = getAllTaxRates(); const [cardList = {}] = useOnyx(ONYXKEYS.CARD_LIST); - const {bottom} = useSafeAreaInsets(); + const {unmodifiedPaddings} = useStyledSafeAreaInsets(); const [isPopoverVisible, setIsPopoverVisible] = useState(false); const buttonRef = useRef(null); @@ -211,9 +211,9 @@ function SearchTypeMenuNarrow({typeMenuItems, activeItemIndex, queryJSON, title, onClose={closeMenu} onItemSelected={closeMenu} anchorRef={buttonRef} - innerContainerStyle={{paddingBottom: bottom}} - scrollContainerStyle={styles.pv4} shouldUseScrollView + shouldUseModalPaddingStyle={false} + innerContainerStyle={{paddingBottom: unmodifiedPaddings.bottom}} />