disable isCompactMode in split bill confirmation page in landscape mode

Author: jakubstec

src/components/MoneyRequestConfirmationList.tsx

@@ -5,6 +5,7 @@ import type {OnyxEntry} from 'react-native-onyx';
 import {useCurrencyListActions} from '@hooks/useCurrencyList';
 import useCurrentUserPersonalDetails from '@hooks/useCurrentUserPersonalDetails';
 import useDebouncedState from '@hooks/useDebouncedState';
+import useIsInLandscapeMode from '@hooks/useIsInLandscapeMode';
 import useLocalize from '@hooks/useLocalize';
 import {MouseProvider} from '@hooks/useMouseContext';
 import useOnyx from '@hooks/useOnyx';
@@ -251,6 +252,7 @@ function MoneyRequestConfirmationList({
     const isNewManualExpenseFlowEnabled = isBetaEnabled(CONST.BETAS.NEW_MANUAL_EXPENSE_FLOW);
     const {isDelegateAccessRestricted} = useDelegateNoAccessState();
     const {showDelegateNoAccessModal} = useDelegateNoAccessActions();
+    const isInLandscapeMode = useIsInLandscapeMode();
 
     const isTestReceipt = useMemo(() => {
         return transaction?.receipt?.isTestReceipt ?? false;
@@ -1060,7 +1062,7 @@ function MoneyRequestConfirmationList({
         isLoadingReceipt,
     ]);
 
-    const isCompactMode = useMemo(() => !showMoreFields && isScanRequest, [isScanRequest, showMoreFields]);
+    const isCompactMode = useMemo(() => !showMoreFields && isScanRequest && !isInLandscapeMode, [isScanRequest, showMoreFields, isInLandscapeMode]);
     const selectionListStyle = useMemo(
         () => ({
             containerStyle: [styles.flexBasisAuto],

src/components/MoneyRequestConfirmationListFooter.tsx

@@ -7,6 +7,7 @@ import type {LayoutChangeEvent} from 'react-native';
 import type {OnyxEntry} from 'react-native-onyx';
 import type {ValueOf} from 'type-fest';
 import {useCurrencyListActions} from '@hooks/useCurrencyList';
+import useIsInLandscapeMode from '@hooks/useIsInLandscapeMode';
 import {useMemoizedLazyExpensifyIcons} from '@hooks/useLazyAsset';
 import useLocalize from '@hooks/useLocalize';
 import useLocalReceiptThumbnail from '@hooks/useLocalReceiptThumbnail';
@@ -345,6 +346,7 @@ function MoneyRequestConfirmationListFooter({
     const {translate, toLocaleDigit, localeCompare, preferredLocale} = useLocalize();
     const {getCurrencySymbol, getCurrencyDecimals} = useCurrencyListActions();
     const {isOffline} = useNetwork();
+    const isInLandscapeMode = useIsInLandscapeMode();
     const {windowWidth} = useWindowDimensions();
 
     const {isBetaEnabled} = usePermissions();
@@ -1319,7 +1321,7 @@ function MoneyRequestConfirmationListFooter({
         return badges;
     }, [firstDay, lastDay, translate, tripDays, icons]);
 
-    const isCompactMode = useMemo(() => !showMoreFields && isScan, [isScan, showMoreFields]);
+    const isCompactMode = useMemo(() => !showMoreFields && isScan && !isInLandscapeMode, [isScan, showMoreFields, isInLandscapeMode]);
     const [receiptAspectRatio, setReceiptAspectRatio] = useState<number | null>(null);
     const [compactReceiptContainerWidth, setCompactReceiptContainerWidth] = useState(0);
     const hasEndedReceiptLoadSpan = useRef(false);