From e76adc4f330b7392f00b243acf8b930d06d24a93 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Fri, 1 Dec 2023 17:06:20 +0100
Subject: [PATCH 01/18] redesign page

---
 src/pages/ReferralDetailsPage.js | 115 ++++++++++++++-----------------
 1 file changed, 52 insertions(+), 63 deletions(-)

diff --git a/src/pages/ReferralDetailsPage.js b/src/pages/ReferralDetailsPage.js
index 60b5d23b39da..117092763a91 100644
--- a/src/pages/ReferralDetailsPage.js
+++ b/src/pages/ReferralDetailsPage.js
@@ -1,23 +1,25 @@
 import PropTypes from 'prop-types';
-import React from 'react';
-import {View} from 'react-native';
+import React, {useRef} from 'react';
 import {withOnyx} from 'react-native-onyx';
 import _ from 'underscore';
-import Button from '@components/Button';
-import CopyTextToClipboard from '@components/CopyTextToClipboard';
-import FixedFooter from '@components/FixedFooter';
-import HeaderWithBackButton from '@components/HeaderWithBackButton';
+import ContextMenuItem from '@components/ContextMenuItem';
+import HeaderPageLayout from '@components/HeaderPageLayout';
 import Icon from '@components/Icon';
+import * as Expensicons from '@components/Icon/Expensicons';
 import {PaymentHands} from '@components/Icon/Illustrations';
-import ScreenWrapper from '@components/ScreenWrapper';
+import MenuItem from '@components/MenuItem';
 import Text from '@components/Text';
-import TextLink from '@components/TextLink';
 import useLocalize from '@hooks/useLocalize';
-import Navigation from '@libs/Navigation/Navigation';
+import useSingleExecution from '@hooks/useSingleExecution';
+import Clipboard from '@libs/Clipboard';
+import useTheme from '@styles/themes/useTheme';
 import useThemeStyles from '@styles/useThemeStyles';
+import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
-import ROUTES from '@src/ROUTES';
+import SCREENS from '@src/SCREENS';
+import {CONTEXT_MENU_TYPES} from './home/report/ContextMenu/ContextMenuActions';
+import * as ReportActionContextMenu from './home/report/ContextMenu/ReportActionContextMenu';
 
 const propTypes = {
     /** Navigation route context info provided by react navigation */
@@ -40,8 +42,11 @@ const defaultProps = {
 };
 
 function ReferralDetailsPage({route, account}) {
+    const theme = useTheme();
     const styles = useThemeStyles();
     const {translate} = useLocalize();
+    const popoverAnchor = useRef(null);
+    const {isExecuting, singleExecution} = useSingleExecution();
     let {contentType} = route.params;
 
     if (!_.includes(_.values(CONST.REFERRAL_PROGRAM.CONTENT_TYPES), contentType)) {
@@ -53,67 +58,51 @@ function ReferralDetailsPage({route, account}) {
     const isShareCode = contentType === CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE;
     const shouldShowBody2 = isShareCode;
     const shouldShowClipboard = contentType === CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND || isShareCode;
-
-    function generateReferralURL(email) {
-        return `${CONST.REFERRAL_PROGRAM.LINK}/?thanks=${encodeURIComponent(email)}`;
-    }
-
-    function getFallbackRoute() {
-        const fallbackRoutes = {
-            [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.MONEY_REQUEST]: ROUTES.MONEY_REQUEST_PARTICIPANTS.getRoute(CONST.IOU.TYPE.REQUEST),
-            [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SEND_MONEY]: ROUTES.MONEY_REQUEST_PARTICIPANTS.getRoute(CONST.IOU.TYPE.SEND),
-            [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.START_CHAT]: ROUTES.NEW_CHAT,
-            [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND]: ROUTES.SEARCH,
-        };
-
-        return fallbackRoutes[contentType];
-    }
+    const referralLink = `${CONST.REFERRAL_PROGRAM.LINK}/?thanks=${encodeURIComponent(account.primaryLogin)}`;
 
     return (
-        <ScreenWrapper
-            includeSafeAreaPaddingBottom={false}
-            shouldEnableMaxHeight
-            testID={ReferralDetailsPage.displayName}
-        >
-            <HeaderWithBackButton
-                title={translate('common.referral')}
-                onBackButtonPress={() => Navigation.goBack(getFallbackRoute())}
-            />
-            <View style={[styles.justifyContentCenter, styles.alignItemsCenter, styles.ph5, styles.flex1]}>
+        <HeaderPageLayout
+            title={translate('common.referral')}
+            headerContent={
                 <Icon
                     src={PaymentHands}
                     width={178}
                     height={232}
                 />
-                <Text style={[styles.textHeadline, styles.textAlignCenter, styles.mb3, styles.mt8]}>{contentHeader}</Text>
-                <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mb6]}>{contentBody}</Text>
-                {shouldShowClipboard && (
-                    <View style={[styles.border, styles.pv2, styles.ph3, styles.mb6]}>
-                        <CopyTextToClipboard
-                            text={translate('referralProgram.copyReferralLink')}
-                            textStyles={[styles.colorMuted]}
-                            urlToCopy={generateReferralURL(account.primaryLogin)}
-                        />
-                    </View>
-                )}
-                {shouldShowBody2 && (
-                    <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mb6]}>
-                        {translate(`referralProgram.${CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE}.body2`)}
-                    </Text>
-                )}
-                <TextLink href={CONST.REFERRAL_PROGRAM.LEARN_MORE_LINK}>{translate('requestorStep.learnMore')}</TextLink>
-            </View>
-            <FixedFooter>
-                <Button
-                    success
-                    style={[styles.w100]}
-                    text={translate('common.buttonConfirm')}
-                    onPress={() => Navigation.goBack(getFallbackRoute())}
-                    pressOnEnter
-                    enterKeyEventListenerPriority={1}
+            }
+            headerContainerStyles={[styles.staticHeaderImage, styles.justifyContentCenter]}
+            backgroundColor={theme.PAGE_THEMES[SCREENS.SETTINGS.WORKSPACES].backgroundColor}
+        >
+            <Text style={[styles.textHeadline, styles.textAlignCenter, styles.mb3, styles.mt8]}>{contentHeader}</Text>
+            <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mb6]}>{contentBody}</Text>
+
+            {shouldShowClipboard && (
+                <ContextMenuItem
+                    isAnonymousAction
+                    text={translate('referralProgram.copyReferralLink')}
+                    icon={Expensicons.Copy}
+                    successIcon={Expensicons.Checkmark}
+                    successText={translate('qrCodes.copied')}
+                    onPress={() => Clipboard.setString(referralLink)}
                 />
-            </FixedFooter>
-        </ScreenWrapper>
+            )}
+
+            {shouldShowBody2 && (
+                <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mv4]}>{translate(`referralProgram.${CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE}.body2`)}</Text>
+            )}
+
+            <MenuItem
+                ref={popoverAnchor}
+                title={translate('requestorStep.learnMore')}
+                icon={Expensicons.QuestionMark}
+                shouldShowRightIcon
+                iconRight={Expensicons.NewWindow}
+                disabled={isExecuting}
+                shouldBlockSelection
+                onPress={singleExecution(() => Link.openExternalLink(CONST.REFERRAL_PROGRAM.LEARN_MORE_LINK))}
+                onSecondaryInteraction={(e) => ReportActionContextMenu.showContextMenu(CONTEXT_MENU_TYPES.LINK, e, CONST.REFERRAL_PROGRAM.LEARN_MORE_LINK, popoverAnchor.current)}
+            />
+        </HeaderPageLayout>
     );
 }
 

From f969c88b88450c7b30584be885e5596a1f3f76d2 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Sat, 2 Dec 2023 15:42:35 +0100
Subject: [PATCH 02/18] remove body2

---
 src/languages/en.ts              | 1 -
 src/languages/es.ts              | 1 -
 src/pages/ReferralDetailsPage.js | 9 ++-------
 3 files changed, 2 insertions(+), 9 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 8f772f1260bb..f7ccbf311157 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1975,7 +1975,6 @@ export default {
             buttonText1: `Get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Get $${CONST.REFERRAL_PROGRAM.REVENUE} for every referral`,
             body1: 'If you know anyone who’s spending too much time on expenses (literally anyone – your neighbor, your boss, your friend in accounting), send them your Expensify referral link:',
-            body2: `When they start an annual subscription, you’ll get $${CONST.REFERRAL_PROGRAM.REVENUE}. Easy as that.`,
         },
         copyReferralLink: 'Copy referral link',
     },
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 3887891299df..37ce7be6e8ee 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2460,7 +2460,6 @@ export default {
             buttonText1: `Recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Recibe $${CONST.REFERRAL_PROGRAM.REVENUE} por cada recomendación`,
             body1: 'Si conoces a alguien que dedique demasiado tiempo a los gastos (literalmente cualquiera: tu vecino, tu jefe, tu amigo de contabilidad), envíale tu enlace de invitación de Expensify:',
-            body2: `Cuando comiencen una suscripción anual, obtendrás $${CONST.REFERRAL_PROGRAM.REVENUE}. Así de fácil.`,
         },
         copyReferralLink: 'Copiar enlace de invitación',
     },
diff --git a/src/pages/ReferralDetailsPage.js b/src/pages/ReferralDetailsPage.js
index 117092763a91..e615a5e58f7f 100644
--- a/src/pages/ReferralDetailsPage.js
+++ b/src/pages/ReferralDetailsPage.js
@@ -56,7 +56,6 @@ function ReferralDetailsPage({route, account}) {
     const contentHeader = translate(`referralProgram.${contentType}.header`);
     const contentBody = translate(`referralProgram.${contentType}.body1`);
     const isShareCode = contentType === CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE;
-    const shouldShowBody2 = isShareCode;
     const shouldShowClipboard = contentType === CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND || isShareCode;
     const referralLink = `${CONST.REFERRAL_PROGRAM.LINK}/?thanks=${encodeURIComponent(account.primaryLogin)}`;
 
@@ -73,8 +72,8 @@ function ReferralDetailsPage({route, account}) {
             headerContainerStyles={[styles.staticHeaderImage, styles.justifyContentCenter]}
             backgroundColor={theme.PAGE_THEMES[SCREENS.SETTINGS.WORKSPACES].backgroundColor}
         >
-            <Text style={[styles.textHeadline, styles.textAlignCenter, styles.mb3, styles.mt8]}>{contentHeader}</Text>
-            <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mb6]}>{contentBody}</Text>
+            <Text style={[styles.textHeadline, styles.textAlignCenter, styles.mb3, styles.mt8, styles.ph4]}>{contentHeader}</Text>
+            <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mb6, styles.ph4]}>{contentBody}</Text>
 
             {shouldShowClipboard && (
                 <ContextMenuItem
@@ -87,10 +86,6 @@ function ReferralDetailsPage({route, account}) {
                 />
             )}
 
-            {shouldShowBody2 && (
-                <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mv4]}>{translate(`referralProgram.${CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE}.body2`)}</Text>
-            )}
-
             <MenuItem
                 ref={popoverAnchor}
                 title={translate('requestorStep.learnMore')}

From 8baed2d0cf67d2f998f1c54ca60420119372cf52 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Tue, 5 Dec 2023 15:15:56 +0100
Subject: [PATCH 03/18] update strings

---
 src/languages/en.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 49849839760f..5caa8722b7d4 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1968,13 +1968,13 @@ export default {
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND]: {
             buttonText1: 'Refer a friend, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
-            header: `Refer a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: `Send your Expensify referral link to a friend or anyone else you know who spends too much time on expenses. When they start an annual subscription, you'll get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
+            header: `Invite a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
+            body1: 'Be the first to invite a friend (or anyone else) to Expensify and get $250 if they become an Expensify customer. Share your invite link by text, email, or post it on social media!',
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE]: {
             buttonText1: `Get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            header: `Get $${CONST.REFERRAL_PROGRAM.REVENUE} for every referral`,
-            body1: 'If you know anyone who’s spending too much time on expenses (literally anyone – your neighbor, your boss, your friend in accounting), send them your Expensify referral link:',
+            header: `Invite a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
+            body1: 'Be the first to invite a friend (or anyone else) to Expensify and get $250 if they become an Expensify customer. Share your invite link by text, email, or post it on social media!',
         },
         copyReferralLink: 'Copy referral link',
     },

From c378ca3453f1f928dc36446957918c23ddda942b Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Tue, 5 Dec 2023 15:16:21 +0100
Subject: [PATCH 04/18] rename key

---
 src/languages/en.ts              | 10 +++++-----
 src/languages/es.ts              | 10 +++++-----
 src/pages/ReferralDetailsPage.js |  2 +-
 3 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 5caa8722b7d4..628a4bbccdb0 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1951,30 +1951,30 @@ export default {
             buttonText1: 'Start a chat, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
             header: `Start a chat, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: `Get paid to talk to your friends! Start a chat with a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
+            body: `Get paid to talk to your friends! Start a chat with a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.MONEY_REQUEST]: {
             buttonText1: 'Request money, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
             header: `Request money, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: `It pays to get paid! Request money from a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
+            body: `It pays to get paid! Request money from a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SEND_MONEY]: {
             buttonText1: 'Send money, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
             header: `Send money, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: `You gotta send money to make money! Send money to a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
+            body: `You gotta send money to make money! Send money to a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND]: {
             buttonText1: 'Refer a friend, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
             header: `Invite a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: 'Be the first to invite a friend (or anyone else) to Expensify and get $250 if they become an Expensify customer. Share your invite link by text, email, or post it on social media!',
+            body: 'Be the first to invite a friend (or anyone else) to Expensify and get $250 if they become an Expensify customer. Share your invite link by text, email, or post it on social media!',
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE]: {
             buttonText1: `Get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Invite a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: 'Be the first to invite a friend (or anyone else) to Expensify and get $250 if they become an Expensify customer. Share your invite link by text, email, or post it on social media!',
+            body: 'Be the first to invite a friend (or anyone else) to Expensify and get $250 if they become an Expensify customer. Share your invite link by text, email, or post it on social media!',
         },
         copyReferralLink: 'Copy referral link',
     },
diff --git a/src/languages/es.ts b/src/languages/es.ts
index 855dd6d0e0d2..c5452e81901f 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2436,30 +2436,30 @@ export default {
             buttonText1: 'Inicia un chat y ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Inicia un chat y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: `¡Gana dinero por hablar con tus amigos! Inicia un chat con una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
+            body: `¡Gana dinero por hablar con tus amigos! Inicia un chat con una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.MONEY_REQUEST]: {
             buttonText1: 'Pide dinero, ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Pide dinero y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: `¡Vale la pena cobrar! Pide dinero a una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
+            body: `¡Vale la pena cobrar! Pide dinero a una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SEND_MONEY]: {
             buttonText1: 'Envía dinero, ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Envía dinero y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: `¡Hay que enviar dinero para ganar dinero! Envía dinero a una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
+            body: `¡Hay que enviar dinero para ganar dinero! Envía dinero a una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND]: {
             buttonText1: 'Recomienda a un amigo y ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Recomienda a un amigo y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body1: `Envía tu enlace de invitación de Expensify a un amigo o a cualquier otra persona que conozcas que dedique demasiado tiempo a los gastos. Cuando comiencen una suscripción anual, obtendrás $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
+            body: `Envía tu enlace de invitación de Expensify a un amigo o a cualquier otra persona que conozcas que dedique demasiado tiempo a los gastos. Cuando comiencen una suscripción anual, obtendrás $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE]: {
             buttonText1: `Recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Recibe $${CONST.REFERRAL_PROGRAM.REVENUE} por cada recomendación`,
-            body1: 'Si conoces a alguien que dedique demasiado tiempo a los gastos (literalmente cualquiera: tu vecino, tu jefe, tu amigo de contabilidad), envíale tu enlace de invitación de Expensify:',
+            body: 'Si conoces a alguien que dedique demasiado tiempo a los gastos (literalmente cualquiera: tu vecino, tu jefe, tu amigo de contabilidad), envíale tu enlace de invitación de Expensify:',
         },
         copyReferralLink: 'Copiar enlace de invitación',
     },
diff --git a/src/pages/ReferralDetailsPage.js b/src/pages/ReferralDetailsPage.js
index e615a5e58f7f..b9f8dcc6f356 100644
--- a/src/pages/ReferralDetailsPage.js
+++ b/src/pages/ReferralDetailsPage.js
@@ -54,7 +54,7 @@ function ReferralDetailsPage({route, account}) {
     }
 
     const contentHeader = translate(`referralProgram.${contentType}.header`);
-    const contentBody = translate(`referralProgram.${contentType}.body1`);
+    const contentBody = translate(`referralProgram.${contentType}.body`);
     const isShareCode = contentType === CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE;
     const shouldShowClipboard = contentType === CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND || isShareCode;
     const referralLink = `${CONST.REFERRAL_PROGRAM.LINK}/?thanks=${encodeURIComponent(account.primaryLogin)}`;

From 588b8a59e8eab669a5e18c6f71f33ae6aea18617 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Tue, 5 Dec 2023 18:20:38 +0100
Subject: [PATCH 05/18] update es strings

---
 src/languages/en.ts | 2 +-
 src/languages/es.ts | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index 628a4bbccdb0..57c217d85bae 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1974,7 +1974,7 @@ export default {
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE]: {
             buttonText1: `Get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Invite a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: 'Be the first to invite a friend (or anyone else) to Expensify and get $250 if they become an Expensify customer. Share your invite link by text, email, or post it on social media!',
+            body: `Be the first to invite a friend (or anyone else) to Expensify and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer. Share your invite link by text, email, or post it on social media!`,
         },
         copyReferralLink: 'Copy referral link',
     },
diff --git a/src/languages/es.ts b/src/languages/es.ts
index c5452e81901f..4dc149834fb5 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2453,13 +2453,13 @@ export default {
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND]: {
             buttonText1: 'Recomienda a un amigo y ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            header: `Recomienda a un amigo y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `Envía tu enlace de invitación de Expensify a un amigo o a cualquier otra persona que conozcas que dedique demasiado tiempo a los gastos. Cuando comiencen una suscripción anual, obtendrás $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
+            header: `Invita a un amigo y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE}`,
+            body: `Sé el primero en invitar a un amigo (o a cualquier otra persona) a Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierte en cliente de Expensify. Comparte tu enlace de invitación por SMS, email o publícalo en las redes sociales.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE]: {
             buttonText1: `Recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            header: `Recibe $${CONST.REFERRAL_PROGRAM.REVENUE} por cada recomendación`,
-            body: 'Si conoces a alguien que dedique demasiado tiempo a los gastos (literalmente cualquiera: tu vecino, tu jefe, tu amigo de contabilidad), envíale tu enlace de invitación de Expensify:',
+            header: `Invita a un amigo y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE}`,
+            body: `Sé el primero en invitar a un amigo (o a cualquier otra persona) a Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierte en cliente de Expensify. Comparte tu enlace de invitación por SMS, email o publícalo en las redes sociales.`,
         },
         copyReferralLink: 'Copiar enlace de invitación',
     },

From b2aae83d45368321347d561438209cc25955dc31 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:16:34 +0100
Subject: [PATCH 06/18] remove hasOutstandingIOU from MoneyRequestAction

---
 .../ReportActionItem/MoneyRequestAction.js     | 18 +-----------------
 1 file changed, 1 insertion(+), 17 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestAction.js b/src/components/ReportActionItem/MoneyRequestAction.js
index 57c1934be23d..15e45315b9ec 100644
--- a/src/components/ReportActionItem/MoneyRequestAction.js
+++ b/src/components/ReportActionItem/MoneyRequestAction.js
@@ -16,7 +16,6 @@ import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import reportActionPropTypes from '@pages/home/report/reportActionPropTypes';
 import iouReportPropTypes from '@pages/iouReportPropTypes';
-import reportPropTypes from '@pages/reportPropTypes';
 import useThemeStyles from '@styles/useThemeStyles';
 import * as Report from '@userActions/Report';
 import CONST from '@src/CONST';
@@ -44,9 +43,6 @@ const propTypes = {
     checkIfContextMenuActive: PropTypes.func,
 
     /* Onyx Props */
-    /** chatReport associated with iouReport */
-    chatReport: reportPropTypes,
-
     /** IOU report data object */
     iouReport: iouReportPropTypes,
 
@@ -69,7 +65,6 @@ const propTypes = {
 const defaultProps = {
     contextMenuAnchor: undefined,
     checkIfContextMenuActive: () => {},
-    chatReport: {},
     iouReport: {},
     reportActions: {},
     isHovered: false,
@@ -84,7 +79,6 @@ function MoneyRequestAction({
     isMostRecentIOUReportAction,
     contextMenuAnchor,
     checkIfContextMenuActive,
-    chatReport,
     iouReport,
     reportActions,
     isHovered,
@@ -119,14 +113,7 @@ function MoneyRequestAction({
     let shouldShowPendingConversionMessage = false;
     const isDeletedParentAction = ReportActionsUtils.isDeletedParentAction(action);
     const isReversedTransaction = ReportActionsUtils.isReversedTransaction(action);
-    if (
-        !_.isEmpty(iouReport) &&
-        !_.isEmpty(reportActions) &&
-        chatReport.hasOutstandingIOU &&
-        isMostRecentIOUReportAction &&
-        action.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD &&
-        network.isOffline
-    ) {
+    if (!_.isEmpty(iouReport) && !_.isEmpty(reportActions) && isMostRecentIOUReportAction && action.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD && network.isOffline) {
         shouldShowPendingConversionMessage = IOUUtils.isIOUReportPendingCurrencyConversion(iouReport);
     }
 
@@ -155,9 +142,6 @@ MoneyRequestAction.displayName = 'MoneyRequestAction';
 
 export default compose(
     withOnyx({
-        chatReport: {
-            key: ({chatReportID}) => `${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`,
-        },
         iouReport: {
             key: ({requestReportID}) => `${ONYXKEYS.COLLECTION.REPORT}${requestReportID}`,
         },

From f867e8ba54a94fe19ca3c3f47d2c78b183511614 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:18:13 +0100
Subject: [PATCH 07/18] remove hasOutstandingIOU from updateIOUOwnerAndTotal

---
 src/libs/IOUUtils.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/libs/IOUUtils.ts b/src/libs/IOUUtils.ts
index afbbcc2684a0..3a7f32e986ff 100644
--- a/src/libs/IOUUtils.ts
+++ b/src/libs/IOUUtils.ts
@@ -57,8 +57,6 @@ function updateIOUOwnerAndTotal(iouReport: OnyxEntry<Report>, actorAccountID: nu
             iouReportUpdate.managerID = iouReport.ownerAccountID;
             iouReportUpdate.total = -iouReportUpdate.total;
         }
-
-        iouReportUpdate.hasOutstandingIOU = iouReportUpdate.total !== 0;
     }
 
     return iouReportUpdate;

From eeab94cc63cd51fb9469809b14c8dee1d78f8d13 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:18:53 +0100
Subject: [PATCH 08/18] remove hasOutstandingIOU from createOption

---
 src/libs/OptionsListUtils.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js
index 4678ce395f76..0c8e658ad8c9 100644
--- a/src/libs/OptionsListUtils.js
+++ b/src/libs/OptionsListUtils.js
@@ -498,7 +498,6 @@ function createOption(accountIDs, personalDetails, report, reportActions = {}, {
         result.iouReportID = report.iouReportID;
         result.keyForList = String(report.reportID);
         result.tooltipText = ReportUtils.getReportParticipantsTitle(report.participantAccountIDs || []);
-        result.hasOutstandingIOU = report.hasOutstandingIOU;
         result.isWaitingOnBankAccount = report.isWaitingOnBankAccount;
         result.policyID = report.policyID;
 

From 066b2882287ad45b2ec7453317d7b7b1c412873a Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:19:34 +0100
Subject: [PATCH 09/18] remove hasOutstandingIOU from
 hasNonReimbursableTransactions

---
 src/libs/ReportUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 1266f145de30..2d4ab5b72255 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -1598,7 +1598,7 @@ function getMoneyRequestReimbursableTotal(report: OnyxEntry<Report>, allReportsD
     if (isMoneyRequestReport(report)) {
         moneyRequestReport = report;
     }
-    if (allAvailableReports && report?.hasOutstandingIOU && report?.iouReportID) {
+    if (allAvailableReports && report?.iouReportID) {
         moneyRequestReport = allAvailableReports[`${ONYXKEYS.COLLECTION.REPORT}${report.iouReportID}`];
     }
     if (moneyRequestReport) {

From 506f30624dffaa019ca20849d36b03de52b2d30c Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:20:29 +0100
Subject: [PATCH 10/18] remove hasOutstandingIOU from
 getMoneyRequestSpendBreakdown

---
 src/libs/ReportUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 2d4ab5b72255..cbb3360eaabb 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -1620,7 +1620,7 @@ function getMoneyRequestSpendBreakdown(report: OnyxEntry<Report>, allReportsDict
     if (isMoneyRequestReport(report)) {
         moneyRequestReport = report;
     }
-    if (allAvailableReports && report?.hasOutstandingIOU && report?.iouReportID) {
+    if (allAvailableReports && report?.iouReportID) {
         moneyRequestReport = allAvailableReports[`${ONYXKEYS.COLLECTION.REPORT}${report.iouReportID}`];
     }
     if (moneyRequestReport) {

From c80a01405cd8bab436a82559e26ac420aed9eafb Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:23:56 +0100
Subject: [PATCH 11/18] remove hasOutstandingIOU from getMoneyRequestReportName

---
 src/libs/ReportUtils.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index cbb3360eaabb..9f69c29453f6 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -1714,7 +1714,7 @@ function getMoneyRequestReportName(report: OnyxEntry<Report>, policy: OnyxEntry<
         return Localize.translateLocal('iou.payerSpentAmount', {payer: payerName, amount: formattedAmount});
     }
 
-    if (!!report?.hasOutstandingIOU || isDraftExpenseReport(report) || moneyRequestTotal === 0) {
+    if ((report?.stateNum === CONST.REPORT.STATE_NUM.PROCESSING && report?.statusNum === CONST.REPORT.STATUS.SUBMITTED) || isDraftExpenseReport(report) || moneyRequestTotal === 0) {
         return Localize.translateLocal('iou.payerOwesAmount', {payer: payerName, amount: formattedAmount});
     }
 

From 061d10e3efbb65d4b3cda3f3d292f6704008a138 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:24:25 +0100
Subject: [PATCH 12/18] remove hasOutstandingIOU from getOptionData

---
 src/libs/SidebarUtils.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/libs/SidebarUtils.ts b/src/libs/SidebarUtils.ts
index bace29e06d28..3773fcd309b9 100644
--- a/src/libs/SidebarUtils.ts
+++ b/src/libs/SidebarUtils.ts
@@ -303,7 +303,6 @@ function getOptionData(
     result.iouReportID = report.iouReportID;
     result.keyForList = String(report.reportID);
     result.tooltipText = ReportUtils.getReportParticipantsTitle(report.participantAccountIDs ?? []);
-    result.hasOutstandingIOU = report.hasOutstandingIOU;
     result.hasOutstandingChildRequest = report.hasOutstandingChildRequest;
     result.parentReportID = report.parentReportID ?? '';
     result.isWaitingOnBankAccount = report.isWaitingOnBankAccount;

From 57e5fa4dd3cf9b4eafa57867ce3a361633bbbaca Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:28:02 +0100
Subject: [PATCH 13/18] remove hasOutstandingIOU from MoneyRequestAction

---
 .../ReportActionItem/MoneyRequestAction.js     | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/src/components/ReportActionItem/MoneyRequestAction.js b/src/components/ReportActionItem/MoneyRequestAction.js
index 15e45315b9ec..040682990d2c 100644
--- a/src/components/ReportActionItem/MoneyRequestAction.js
+++ b/src/components/ReportActionItem/MoneyRequestAction.js
@@ -16,6 +16,7 @@ import * as ReportActionsUtils from '@libs/ReportActionsUtils';
 import * as ReportUtils from '@libs/ReportUtils';
 import reportActionPropTypes from '@pages/home/report/reportActionPropTypes';
 import iouReportPropTypes from '@pages/iouReportPropTypes';
+import reportPropTypes from '@pages/reportPropTypes';
 import useThemeStyles from '@styles/useThemeStyles';
 import * as Report from '@userActions/Report';
 import CONST from '@src/CONST';
@@ -43,6 +44,9 @@ const propTypes = {
     checkIfContextMenuActive: PropTypes.func,
 
     /* Onyx Props */
+    /** chatReport associated with iouReport */
+    chatReport: reportPropTypes,
+
     /** IOU report data object */
     iouReport: iouReportPropTypes,
 
@@ -65,6 +69,7 @@ const propTypes = {
 const defaultProps = {
     contextMenuAnchor: undefined,
     checkIfContextMenuActive: () => {},
+    chatReport: {},
     iouReport: {},
     reportActions: {},
     isHovered: false,
@@ -79,6 +84,7 @@ function MoneyRequestAction({
     isMostRecentIOUReportAction,
     contextMenuAnchor,
     checkIfContextMenuActive,
+    chatReport,
     iouReport,
     reportActions,
     isHovered,
@@ -113,7 +119,14 @@ function MoneyRequestAction({
     let shouldShowPendingConversionMessage = false;
     const isDeletedParentAction = ReportActionsUtils.isDeletedParentAction(action);
     const isReversedTransaction = ReportActionsUtils.isReversedTransaction(action);
-    if (!_.isEmpty(iouReport) && !_.isEmpty(reportActions) && isMostRecentIOUReportAction && action.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD && network.isOffline) {
+    if (
+        !_.isEmpty(iouReport) &&
+        !_.isEmpty(reportActions) &&
+        chatReport.iouReportID &&
+        isMostRecentIOUReportAction &&
+        action.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD &&
+        network.isOffline
+    ) {
         shouldShowPendingConversionMessage = IOUUtils.isIOUReportPendingCurrencyConversion(iouReport);
     }
 
@@ -142,6 +155,9 @@ MoneyRequestAction.displayName = 'MoneyRequestAction';
 
 export default compose(
     withOnyx({
+        chatReport: {
+            key: ({chatReportID}) => `${ONYXKEYS.COLLECTION.REPORT}${chatReportID}`,
+        },
         iouReport: {
             key: ({requestReportID}) => `${ONYXKEYS.COLLECTION.REPORT}${requestReportID}`,
         },

From 114865924161d4233b311346cd2150e48c443bbb Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 13:31:53 +0100
Subject: [PATCH 14/18] revert changes

---
 src/languages/en.ts              |  15 ++--
 src/languages/es.ts              |  15 ++--
 src/pages/ReferralDetailsPage.js | 114 ++++++++++++++++++-------------
 3 files changed, 81 insertions(+), 63 deletions(-)

diff --git a/src/languages/en.ts b/src/languages/en.ts
index efd073496ed5..817f06f6b344 100755
--- a/src/languages/en.ts
+++ b/src/languages/en.ts
@@ -1955,30 +1955,31 @@ export default {
             buttonText1: 'Start a chat, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
             header: `Start a chat, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `Get paid to talk to your friends! Start a chat with a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
+            body1: `Get paid to talk to your friends! Start a chat with a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.MONEY_REQUEST]: {
             buttonText1: 'Request money, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
             header: `Request money, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `It pays to get paid! Request money from a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
+            body1: `It pays to get paid! Request money from a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SEND_MONEY]: {
             buttonText1: 'Send money, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
             header: `Send money, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `You gotta send money to make money! Send money to a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
+            body1: `You gotta send money to make money! Send money to a new Expensify account and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND]: {
             buttonText1: 'Refer a friend, ',
             buttonText2: `get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
-            header: `Invite a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: 'Be the first to invite a friend (or anyone else) to Expensify and get $250 if they become an Expensify customer. Share your invite link by text, email, or post it on social media!',
+            header: `Refer a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
+            body1: `Send your Expensify referral link to a friend or anyone else you know who spends too much time on expenses. When they start an annual subscription, you'll get $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE]: {
             buttonText1: `Get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            header: `Invite a friend, get $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `Be the first to invite a friend (or anyone else) to Expensify and get $${CONST.REFERRAL_PROGRAM.REVENUE} if they become an Expensify customer. Share your invite link by text, email, or post it on social media!`,
+            header: `Get $${CONST.REFERRAL_PROGRAM.REVENUE} for every referral`,
+            body1: 'If you know anyone who’s spending too much time on expenses (literally anyone – your neighbor, your boss, your friend in accounting), send them your Expensify referral link:',
+            body2: `When they start an annual subscription, you’ll get $${CONST.REFERRAL_PROGRAM.REVENUE}. Easy as that.`,
         },
         copyReferralLink: 'Copy referral link',
     },
diff --git a/src/languages/es.ts b/src/languages/es.ts
index d38fcec82c2c..b219021daa0f 100644
--- a/src/languages/es.ts
+++ b/src/languages/es.ts
@@ -2440,30 +2440,31 @@ export default {
             buttonText1: 'Inicia un chat y ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Inicia un chat y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `¡Gana dinero por hablar con tus amigos! Inicia un chat con una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
+            body1: `¡Gana dinero por hablar con tus amigos! Inicia un chat con una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.MONEY_REQUEST]: {
             buttonText1: 'Pide dinero, ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Pide dinero y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `¡Vale la pena cobrar! Pide dinero a una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
+            body1: `¡Vale la pena cobrar! Pide dinero a una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SEND_MONEY]: {
             buttonText1: 'Envía dinero, ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
             header: `Envía dinero y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `¡Hay que enviar dinero para ganar dinero! Envía dinero a una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
+            body1: `¡Hay que enviar dinero para ganar dinero! Envía dinero a una cuenta nueva de Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierten en clientes de Expensify.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND]: {
             buttonText1: 'Recomienda a un amigo y ',
             buttonText2: `recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            header: `Invita a un amigo y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `Sé el primero en invitar a un amigo (o a cualquier otra persona) a Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierte en cliente de Expensify. Comparte tu enlace de invitación por SMS, email o publícalo en las redes sociales.`,
+            header: `Recomienda a un amigo y recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
+            body1: `Envía tu enlace de invitación de Expensify a un amigo o a cualquier otra persona que conozcas que dedique demasiado tiempo a los gastos. Cuando comiencen una suscripción anual, obtendrás $${CONST.REFERRAL_PROGRAM.REVENUE}.`,
         },
         [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE]: {
             buttonText1: `Recibe $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            header: `Invita a un amigo y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE}`,
-            body: `Sé el primero en invitar a un amigo (o a cualquier otra persona) a Expensify y obtiene $${CONST.REFERRAL_PROGRAM.REVENUE} si se convierte en cliente de Expensify. Comparte tu enlace de invitación por SMS, email o publícalo en las redes sociales.`,
+            header: `Recibe $${CONST.REFERRAL_PROGRAM.REVENUE} por cada recomendación`,
+            body1: 'Si conoces a alguien que dedique demasiado tiempo a los gastos (literalmente cualquiera: tu vecino, tu jefe, tu amigo de contabilidad), envíale tu enlace de invitación de Expensify:',
+            body2: `Cuando comiencen una suscripción anual, obtendrás $${CONST.REFERRAL_PROGRAM.REVENUE}. Así de fácil.`,
         },
         copyReferralLink: 'Copiar enlace de invitación',
     },
diff --git a/src/pages/ReferralDetailsPage.js b/src/pages/ReferralDetailsPage.js
index b9f8dcc6f356..60b5d23b39da 100644
--- a/src/pages/ReferralDetailsPage.js
+++ b/src/pages/ReferralDetailsPage.js
@@ -1,25 +1,23 @@
 import PropTypes from 'prop-types';
-import React, {useRef} from 'react';
+import React from 'react';
+import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import _ from 'underscore';
-import ContextMenuItem from '@components/ContextMenuItem';
-import HeaderPageLayout from '@components/HeaderPageLayout';
+import Button from '@components/Button';
+import CopyTextToClipboard from '@components/CopyTextToClipboard';
+import FixedFooter from '@components/FixedFooter';
+import HeaderWithBackButton from '@components/HeaderWithBackButton';
 import Icon from '@components/Icon';
-import * as Expensicons from '@components/Icon/Expensicons';
 import {PaymentHands} from '@components/Icon/Illustrations';
-import MenuItem from '@components/MenuItem';
+import ScreenWrapper from '@components/ScreenWrapper';
 import Text from '@components/Text';
+import TextLink from '@components/TextLink';
 import useLocalize from '@hooks/useLocalize';
-import useSingleExecution from '@hooks/useSingleExecution';
-import Clipboard from '@libs/Clipboard';
-import useTheme from '@styles/themes/useTheme';
+import Navigation from '@libs/Navigation/Navigation';
 import useThemeStyles from '@styles/useThemeStyles';
-import * as Link from '@userActions/Link';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
-import SCREENS from '@src/SCREENS';
-import {CONTEXT_MENU_TYPES} from './home/report/ContextMenu/ContextMenuActions';
-import * as ReportActionContextMenu from './home/report/ContextMenu/ReportActionContextMenu';
+import ROUTES from '@src/ROUTES';
 
 const propTypes = {
     /** Navigation route context info provided by react navigation */
@@ -42,11 +40,8 @@ const defaultProps = {
 };
 
 function ReferralDetailsPage({route, account}) {
-    const theme = useTheme();
     const styles = useThemeStyles();
     const {translate} = useLocalize();
-    const popoverAnchor = useRef(null);
-    const {isExecuting, singleExecution} = useSingleExecution();
     let {contentType} = route.params;
 
     if (!_.includes(_.values(CONST.REFERRAL_PROGRAM.CONTENT_TYPES), contentType)) {
@@ -54,50 +49,71 @@ function ReferralDetailsPage({route, account}) {
     }
 
     const contentHeader = translate(`referralProgram.${contentType}.header`);
-    const contentBody = translate(`referralProgram.${contentType}.body`);
+    const contentBody = translate(`referralProgram.${contentType}.body1`);
     const isShareCode = contentType === CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE;
+    const shouldShowBody2 = isShareCode;
     const shouldShowClipboard = contentType === CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND || isShareCode;
-    const referralLink = `${CONST.REFERRAL_PROGRAM.LINK}/?thanks=${encodeURIComponent(account.primaryLogin)}`;
+
+    function generateReferralURL(email) {
+        return `${CONST.REFERRAL_PROGRAM.LINK}/?thanks=${encodeURIComponent(email)}`;
+    }
+
+    function getFallbackRoute() {
+        const fallbackRoutes = {
+            [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.MONEY_REQUEST]: ROUTES.MONEY_REQUEST_PARTICIPANTS.getRoute(CONST.IOU.TYPE.REQUEST),
+            [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SEND_MONEY]: ROUTES.MONEY_REQUEST_PARTICIPANTS.getRoute(CONST.IOU.TYPE.SEND),
+            [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.START_CHAT]: ROUTES.NEW_CHAT,
+            [CONST.REFERRAL_PROGRAM.CONTENT_TYPES.REFER_FRIEND]: ROUTES.SEARCH,
+        };
+
+        return fallbackRoutes[contentType];
+    }
 
     return (
-        <HeaderPageLayout
-            title={translate('common.referral')}
-            headerContent={
+        <ScreenWrapper
+            includeSafeAreaPaddingBottom={false}
+            shouldEnableMaxHeight
+            testID={ReferralDetailsPage.displayName}
+        >
+            <HeaderWithBackButton
+                title={translate('common.referral')}
+                onBackButtonPress={() => Navigation.goBack(getFallbackRoute())}
+            />
+            <View style={[styles.justifyContentCenter, styles.alignItemsCenter, styles.ph5, styles.flex1]}>
                 <Icon
                     src={PaymentHands}
                     width={178}
                     height={232}
                 />
-            }
-            headerContainerStyles={[styles.staticHeaderImage, styles.justifyContentCenter]}
-            backgroundColor={theme.PAGE_THEMES[SCREENS.SETTINGS.WORKSPACES].backgroundColor}
-        >
-            <Text style={[styles.textHeadline, styles.textAlignCenter, styles.mb3, styles.mt8, styles.ph4]}>{contentHeader}</Text>
-            <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mb6, styles.ph4]}>{contentBody}</Text>
-
-            {shouldShowClipboard && (
-                <ContextMenuItem
-                    isAnonymousAction
-                    text={translate('referralProgram.copyReferralLink')}
-                    icon={Expensicons.Copy}
-                    successIcon={Expensicons.Checkmark}
-                    successText={translate('qrCodes.copied')}
-                    onPress={() => Clipboard.setString(referralLink)}
+                <Text style={[styles.textHeadline, styles.textAlignCenter, styles.mb3, styles.mt8]}>{contentHeader}</Text>
+                <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mb6]}>{contentBody}</Text>
+                {shouldShowClipboard && (
+                    <View style={[styles.border, styles.pv2, styles.ph3, styles.mb6]}>
+                        <CopyTextToClipboard
+                            text={translate('referralProgram.copyReferralLink')}
+                            textStyles={[styles.colorMuted]}
+                            urlToCopy={generateReferralURL(account.primaryLogin)}
+                        />
+                    </View>
+                )}
+                {shouldShowBody2 && (
+                    <Text style={[styles.textAlignCenter, styles.inlineSystemMessage, styles.mb6]}>
+                        {translate(`referralProgram.${CONST.REFERRAL_PROGRAM.CONTENT_TYPES.SHARE_CODE}.body2`)}
+                    </Text>
+                )}
+                <TextLink href={CONST.REFERRAL_PROGRAM.LEARN_MORE_LINK}>{translate('requestorStep.learnMore')}</TextLink>
+            </View>
+            <FixedFooter>
+                <Button
+                    success
+                    style={[styles.w100]}
+                    text={translate('common.buttonConfirm')}
+                    onPress={() => Navigation.goBack(getFallbackRoute())}
+                    pressOnEnter
+                    enterKeyEventListenerPriority={1}
                 />
-            )}
-
-            <MenuItem
-                ref={popoverAnchor}
-                title={translate('requestorStep.learnMore')}
-                icon={Expensicons.QuestionMark}
-                shouldShowRightIcon
-                iconRight={Expensicons.NewWindow}
-                disabled={isExecuting}
-                shouldBlockSelection
-                onPress={singleExecution(() => Link.openExternalLink(CONST.REFERRAL_PROGRAM.LEARN_MORE_LINK))}
-                onSecondaryInteraction={(e) => ReportActionContextMenu.showContextMenu(CONTEXT_MENU_TYPES.LINK, e, CONST.REFERRAL_PROGRAM.LEARN_MORE_LINK, popoverAnchor.current)}
-            />
-        </HeaderPageLayout>
+            </FixedFooter>
+        </ScreenWrapper>
     );
 }
 

From 5cba6221880cd73bbe8a8cf5f4c10d5fb862a4cd Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 7 Dec 2023 19:05:51 +0100
Subject: [PATCH 15/18] fix tests

---
 tests/unit/SidebarOrderTest.js | 24 ++++++++++++++++--------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/tests/unit/SidebarOrderTest.js b/tests/unit/SidebarOrderTest.js
index 6eef3e40bf1c..3eda3a58f806 100644
--- a/tests/unit/SidebarOrderTest.js
+++ b/tests/unit/SidebarOrderTest.js
@@ -309,11 +309,12 @@ describe('Sidebar', () => {
                 type: CONST.REPORT.TYPE.IOU,
                 ownerAccountID: 2,
                 managerID: 2,
-                hasOutstandingIOU: true,
                 hasOutstandingChildRequest: true,
                 total: 10000,
                 currency: 'USD',
                 chatReportID: report3.reportID,
+                stateNum: CONST.REPORT.STATE_NUM.PROCESSING,
+                statusNum: CONST.REPORT.STATUS.SUBMITTED,
             };
             report3.iouReportID = iouReport.reportID;
 
@@ -371,11 +372,11 @@ describe('Sidebar', () => {
                 ownerAccountID: 7,
                 managerID: 7,
                 policyName: 'Workspace',
-                hasOutstandingIOU: true,
                 total: -10000,
                 currency: 'USD',
                 state: CONST.REPORT.STATE.SUBMITTED,
                 stateNum: CONST.REPORT.STATE_NUM.PROCESSING,
+                statusNum: CONST.REPORT.STATUS.SUBMITTED,
                 chatReportID: report3.reportID,
                 parentReportID: report3.reportID,
             };
@@ -570,11 +571,13 @@ describe('Sidebar', () => {
                 type: CONST.REPORT.TYPE.IOU,
                 ownerAccountID: 2,
                 managerID: 2,
-                hasOutstandingIOU: true,
                 hasOutstandingChildRequest: true,
                 total: 10000,
                 currency: 'USD',
                 chatReportID: report3.reportID,
+                state: CONST.REPORT.STATE.SUBMITTED,
+                stateNum: CONST.REPORT.STATE_NUM.PROCESSING,
+                statusNum: CONST.REPORT.STATUS.SUBMITTED,
             };
             report3.iouReportID = iouReport.reportID;
             const currentReportId = report2.reportID;
@@ -908,55 +911,60 @@ describe('Sidebar', () => {
                 type: CONST.REPORT.TYPE.IOU,
                 ownerAccountID: 2,
                 managerID: 2,
-                hasOutstandingIOU: true,
                 hasOutstandingChildRequest: true,
                 total: 10000,
                 currency: 'USD',
                 chatReportID: report3.reportID,
+                stateNum: CONST.REPORT.STATE_NUM.PROCESSING,
+                statusNum: CONST.REPORT.STATUS.SUBMITTED,
             };
             const iouReport2 = {
                 ...LHNTestUtils.getFakeReport([9, 10]),
                 type: CONST.REPORT.TYPE.IOU,
                 ownerAccountID: 2,
                 managerID: 3,
-                hasOutstandingIOU: true,
                 hasOutstandingChildRequest: true,
                 total: 10000,
                 currency: 'USD',
                 chatReportID: report3.reportID,
+                stateNum: CONST.REPORT.STATE_NUM.PROCESSING,
+                statusNum: CONST.REPORT.STATUS.SUBMITTED,
             };
             const iouReport3 = {
                 ...LHNTestUtils.getFakeReport([11, 12]),
                 type: CONST.REPORT.TYPE.IOU,
                 ownerAccountID: 2,
                 managerID: 4,
-                hasOutstandingIOU: true,
                 hasOutstandingChildRequest: true,
                 total: 100000,
                 currency: 'USD',
                 chatReportID: report3.reportID,
+                stateNum: CONST.REPORT.STATE_NUM.PROCESSING,
+                statusNum: CONST.REPORT.STATUS.SUBMITTED,
             };
             const iouReport4 = {
                 ...LHNTestUtils.getFakeReport([11, 12]),
                 type: CONST.REPORT.TYPE.IOU,
                 ownerAccountID: 2,
                 managerID: 5,
-                hasOutstandingIOU: true,
                 hasOutstandingChildRequest: true,
                 total: 10000,
                 currency: 'USD',
                 chatReportID: report3.reportID,
+                stateNum: CONST.REPORT.STATE_NUM.PROCESSING,
+                statusNum: CONST.REPORT.STATUS.SUBMITTED,
             };
             const iouReport5 = {
                 ...LHNTestUtils.getFakeReport([11, 12]),
                 type: CONST.REPORT.TYPE.IOU,
                 ownerAccountID: 2,
                 managerID: 6,
-                hasOutstandingIOU: true,
                 hasOutstandingChildRequest: true,
                 total: 10000,
                 currency: 'USD',
                 chatReportID: report3.reportID,
+                stateNum: CONST.REPORT.STATE_NUM.PROCESSING,
+                statusNum: CONST.REPORT.STATUS.SUBMITTED,
             };
 
             report1.iouReportID = iouReport1.reportID;

From f8a8381e9111c8d52c0b9e71c5494dc4d724af1a Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 11 Dec 2023 12:46:39 +0100
Subject: [PATCH 16/18] remove hasOutstandingIOU from src

---
 .../ReportActionItem/MoneyRequestPreview.js   |  3 ---
 .../ReportActionItem/ReportPreview.js         |  3 ---
 src/components/optionPropTypes.js             |  3 ---
 src/libs/E2E/apiMocks/openApp.ts              | 27 -------------------
 src/libs/E2E/apiMocks/openReport.ts           |  1 -
 src/libs/OptionsListUtils.js                  |  1 -
 src/libs/ReportUtils.ts                       |  7 -----
 src/libs/SidebarUtils.ts                      |  1 -
 src/libs/actions/IOU.js                       |  7 -----
 src/pages/home/ReportScreen.js                |  4 +--
 src/pages/home/report/ReportActionItem.js     |  6 -----
 src/pages/home/report/ReportActionsList.js    |  4 +--
 .../report/ReportActionsListItemRenderer.js   |  6 -----
 src/pages/home/report/ReportActionsView.js    |  4 ---
 src/pages/home/sidebar/SidebarLinksData.js    |  1 -
 src/pages/reportPropTypes.js                  |  3 ---
 src/types/onyx/Report.ts                      |  3 ---
 17 files changed, 2 insertions(+), 82 deletions(-)

diff --git a/src/components/ReportActionItem/MoneyRequestPreview.js b/src/components/ReportActionItem/MoneyRequestPreview.js
index 8dcdb32e530a..54eee7a8cc13 100644
--- a/src/components/ReportActionItem/MoneyRequestPreview.js
+++ b/src/components/ReportActionItem/MoneyRequestPreview.js
@@ -77,9 +77,6 @@ const propTypes = {
 
         /** Currency of outstanding amount of this transaction */
         currency: PropTypes.string,
-
-        /** Does the iouReport have an outstanding IOU? */
-        hasOutstandingIOU: PropTypes.bool,
     }),
 
     /** True if this is this IOU is a split instead of a 1:1 request */
diff --git a/src/components/ReportActionItem/ReportPreview.js b/src/components/ReportActionItem/ReportPreview.js
index 615e91dc5fc4..0eb0e9bd262b 100644
--- a/src/components/ReportActionItem/ReportPreview.js
+++ b/src/components/ReportActionItem/ReportPreview.js
@@ -69,9 +69,6 @@ const propTypes = {
         /** Currency of outstanding amount of this transaction */
         currency: PropTypes.string,
 
-        /** Does the iouReport have an outstanding IOU? */
-        hasOutstandingIOU: PropTypes.bool,
-
         /** Is the iouReport waiting for the submitter to add a credit bank account? */
         isWaitingOnBankAccount: PropTypes.bool,
     }),
diff --git a/src/components/optionPropTypes.js b/src/components/optionPropTypes.js
index d5ef485b8276..4cfadea33d60 100644
--- a/src/components/optionPropTypes.js
+++ b/src/components/optionPropTypes.js
@@ -40,9 +40,6 @@ export default PropTypes.shape({
     // Whether the report corresponds to a chat room
     isChatRoom: PropTypes.bool,
 
-    // Whether the option has an outstanding IOU
-    hasOutstandingIOU: PropTypes.bool,
-
     // Custom icon to render on the right side of the option
     customIcon: PropTypes.shape({
         // The icon source
diff --git a/src/libs/E2E/apiMocks/openApp.ts b/src/libs/E2E/apiMocks/openApp.ts
index a0583d8439c0..42d13716407d 100644
--- a/src/libs/E2E/apiMocks/openApp.ts
+++ b/src/libs/E2E/apiMocks/openApp.ts
@@ -1527,7 +1527,6 @@ const openApp = (): Response => ({
                         '<a href="mailto:applause.expensifail.com@expensify.cash" target="_blank" rel="noreferrer noopener">applause.expensifail.com@expensify.cash</a>. Learn more ' +
                         '<a href="https://www.expensify.com/inbox?policyID=C28C2634DD7226B8&amp;taskID=ForwardToExpensifyCash" target="_blank" rel="noreferrer noopener">here.' +
                         '</a> For questions, just reply to this message.',
-                    hasOutstandingIOU: false,
                 },
                 report_98258458: {
                     reportID: '98258458',
@@ -1549,7 +1548,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: true,
                     lastMessageHtml: '',
-                    hasOutstandingIOU: false,
                 },
                 report_98344717: {
                     reportID: '98344717',
@@ -1571,7 +1569,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Requested \u20b41.67 from applausetester+perf2@applause.expensifail.com',
-                    hasOutstandingIOU: false,
                 },
                 report_98345050: {
                     reportID: '98345050',
@@ -1593,7 +1590,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Cancelled the \u20b440.00 request',
-                    hasOutstandingIOU: false,
                 },
                 report_98345315: {
                     reportID: '98345315',
@@ -1615,7 +1611,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: '<a href="mailto:applausetester+perf2@applause.expensifail.com">applausetester+perf2@applause.expensifail.com</a>',
-                    hasOutstandingIOU: false,
                 },
                 report_98345625: {
                     reportID: '98345625',
@@ -1637,7 +1632,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Say hello\ud83d\ude10',
-                    hasOutstandingIOU: false,
                 },
                 report_98345679: {
                     reportID: '98345679',
@@ -1659,7 +1653,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: true,
                     lastMessageHtml: '',
-                    hasOutstandingIOU: false,
                 },
                 report_98414813: {
                     reportID: '98414813',
@@ -1681,7 +1674,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Split \u20b45.00 with applausetester+perf2@applause.expensifail.com and fake6@gmail.com',
-                    hasOutstandingIOU: false,
                 },
                 report_98817646: {
                     reportID: '98817646',
@@ -1703,7 +1695,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'RR',
-                    hasOutstandingIOU: true,
                     iouReportID: '2543745284790730',
                 },
                 report_358751490033727: {
@@ -1726,7 +1717,6 @@ const openApp = (): Response => ({
                     visibility: 'restricted',
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'STAGING_CHAT_MESSAGE_A2C534B7-3509-416E-A0AD-8463831C29DD',
-                    hasOutstandingIOU: false,
                 },
                 report_663424408122117: {
                     reportID: '663424408122117',
@@ -1748,7 +1738,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: '',
-                    hasOutstandingIOU: false,
                 },
                 report_944123936554214: {
                     reportID: '944123936554214',
@@ -1770,7 +1759,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: true,
                     lastMessageHtml: '',
-                    hasOutstandingIOU: false,
                 },
                 report_2242399088152511: {
                     reportID: '2242399088152511',
@@ -1792,7 +1780,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: '<p>Hi there, thanks for reaching out! How may I help?</p>',
-                    hasOutstandingIOU: false,
                 },
                 report_2576922422943214: {
                     reportID: '2576922422943214',
@@ -1814,7 +1801,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Test',
-                    hasOutstandingIOU: false,
                 },
                 report_2752461403207161: {
                     reportID: '2752461403207161',
@@ -1836,7 +1822,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: '',
-                    hasOutstandingIOU: false,
                 },
                 report_3785654888638968: {
                     reportID: '3785654888638968',
@@ -1858,7 +1843,6 @@ const openApp = (): Response => ({
                     visibility: 'restricted',
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Room renamed to #jack',
-                    hasOutstandingIOU: false,
                 },
                 report_4867098979334014: {
                     reportID: '4867098979334014',
@@ -1880,7 +1864,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Requested \u20ac200.00 from Christoph for Essen mit Kunden',
-                    hasOutstandingIOU: true,
                     iouReportID: '4249286573496381',
                 },
                 report_5277760851229035: {
@@ -1905,7 +1888,6 @@ const openApp = (): Response => ({
                     lastMessageHtml:
                         'fff<br />f<br />f<br />f<br />f<br />f<br />f<br />f<br />f<br /><br />f<br />f<br />f<br />f<br /><br />f<br />' +
                         'f<br />f<br />f<br />f<br />f<br /><br />f<br />f<br />f<br />f<br />f<br />ff',
-                    hasOutstandingIOU: false,
                 },
                 report_5324367938904284: {
                     reportID: '5324367938904284',
@@ -1927,7 +1909,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Iviviviv8b',
-                    hasOutstandingIOU: false,
                 },
                 report_5654270288238256: {
                     reportID: '5654270288238256',
@@ -1949,7 +1930,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: '',
-                    hasOutstandingIOU: false,
                 },
                 report_6194900075541844: {
                     reportID: '6194900075541844',
@@ -1971,7 +1951,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: '',
-                    hasOutstandingIOU: false,
                 },
                 report_6801643744224146: {
                     reportID: '6801643744224146',
@@ -1994,7 +1973,6 @@ const openApp = (): Response => ({
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml:
                         "\ud83d\udc4b Welcome to Expensify! I'm Concierge. Is there anything I can help with? Click the + icon on the homescreen to explore the features you can use.",
-                    hasOutstandingIOU: false,
                 },
                 report_7658708888047100: {
                     reportID: '7658708888047100',
@@ -2016,7 +1994,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Hi there! How can I help?\u00a0',
-                    hasOutstandingIOU: false,
                 },
                 report_7756405299640824: {
                     reportID: '7756405299640824',
@@ -2038,7 +2015,6 @@ const openApp = (): Response => ({
                     visibility: 'restricted',
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: 'Room renamed to #jackd23',
-                    hasOutstandingIOU: false,
                 },
                 report_7819732651025410: {
                     reportID: '7819732651025410',
@@ -2060,7 +2036,6 @@ const openApp = (): Response => ({
                     visibility: null,
                     isOwnPolicyExpenseChat: false,
                     lastMessageHtml: '',
-                    hasOutstandingIOU: false,
                 },
                 report_2543745284790730: {
                     reportID: '2543745284790730',
@@ -2072,7 +2047,6 @@ const openApp = (): Response => ({
                     cachedTotal: '($1,473.11)',
                     total: 147311,
                     stateNum: 1,
-                    hasOutstandingIOU: true,
                 },
                 report_4249286573496381: {
                     reportID: '4249286573496381',
@@ -2084,7 +2058,6 @@ const openApp = (): Response => ({
                     cachedTotal: '($212.78)',
                     total: 21278,
                     stateNum: 1,
-                    hasOutstandingIOU: true,
                 },
             },
         },
diff --git a/src/libs/E2E/apiMocks/openReport.ts b/src/libs/E2E/apiMocks/openReport.ts
index 1d0b5a4c54ac..eb5df2394e11 100644
--- a/src/libs/E2E/apiMocks/openReport.ts
+++ b/src/libs/E2E/apiMocks/openReport.ts
@@ -32,7 +32,6 @@ export default (): Response => ({
                 isOwnPolicyExpenseChat: false,
                 lastMessageHtml: 'terry+hightraffic@margelo.io owes \u20ac12.00',
                 iouReportID: '206636935813547',
-                hasOutstandingIOU: false,
                 hasOutstandingChildRequest: false,
                 policyName: null,
                 hasParentAccess: null,
diff --git a/src/libs/OptionsListUtils.js b/src/libs/OptionsListUtils.js
index 80289ded15fd..95a8c52649d3 100644
--- a/src/libs/OptionsListUtils.js
+++ b/src/libs/OptionsListUtils.js
@@ -456,7 +456,6 @@ function createOption(accountIDs, personalDetails, report, reportActions = {}, {
         searchText: null,
         isDefaultRoom: false,
         isPinned: false,
-        hasOutstandingIOU: false,
         isWaitingOnBankAccount: false,
         iouReportID: null,
         isIOUReportOwner: null,
diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 6c61adba1c8e..7594443b2e3b 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -107,7 +107,6 @@ type OptimisticExpenseReport = Pick<
     | 'policyID'
     | 'type'
     | 'ownerAccountID'
-    | 'hasOutstandingIOU'
     | 'currency'
     | 'reportName'
     | 'state'
@@ -197,7 +196,6 @@ type OptimisticChatReport = Pick<
     Report,
     | 'type'
     | 'chatType'
-    | 'hasOutstandingIOU'
     | 'isOwnPolicyExpenseChat'
     | 'isPinned'
     | 'lastActorAccountID'
@@ -297,7 +295,6 @@ type TransactionDetails =
 type OptimisticIOUReport = Pick<
     Report,
     | 'cachedTotal'
-    | 'hasOutstandingIOU'
     | 'type'
     | 'chatReportID'
     | 'currency'
@@ -2553,8 +2550,6 @@ function buildOptimisticIOUReport(payeeAccountID: number, payerAccountID: number
     const personalDetails = getPersonalDetailsForAccountID(payerAccountID);
     const payerEmail = 'login' in personalDetails ? personalDetails.login : '';
     return {
-        // If we're sending money, hasOutstandingIOU should be false
-        hasOutstandingIOU: !isSendingMoney,
         type: CONST.REPORT.TYPE.IOU,
         cachedTotal: formattedTotal,
         chatReportID,
@@ -2608,7 +2603,6 @@ function buildOptimisticExpenseReport(chatReportID: string, policyID: string, pa
         policyID,
         type: CONST.REPORT.TYPE.EXPENSE,
         ownerAccountID: payeeAccountID,
-        hasOutstandingIOU: true,
         currency: outputCurrency,
 
         // We don't translate reportName because the server response is always in English
@@ -3087,7 +3081,6 @@ function buildOptimisticChatReport(
     return {
         type: CONST.REPORT.TYPE.CHAT,
         chatType,
-        hasOutstandingIOU: false,
         isOwnPolicyExpenseChat,
         isPinned: reportName === CONST.REPORT.WORKSPACE_CHAT_ROOMS.ADMINS || isNewlyCreatedWorkspaceChat,
         lastActorAccountID: 0,
diff --git a/src/libs/SidebarUtils.ts b/src/libs/SidebarUtils.ts
index e0f3cdf37da5..af80265a57e9 100644
--- a/src/libs/SidebarUtils.ts
+++ b/src/libs/SidebarUtils.ts
@@ -260,7 +260,6 @@ function getOptionData(
         keyForList: null,
         searchText: null,
         isPinned: false,
-        hasOutstandingIOU: false,
         hasOutstandingChildRequest: false,
         isIOUReportOwner: null,
         iouReportAmount: 0,
diff --git a/src/libs/actions/IOU.js b/src/libs/actions/IOU.js
index 744f3f4c575b..c65b56313a2d 100644
--- a/src/libs/actions/IOU.js
+++ b/src/libs/actions/IOU.js
@@ -264,7 +264,6 @@ function buildOnyxDataForMoneyRequest(
                 ...chatReport,
                 lastReadTime: DateUtils.getDBTime(),
                 lastMessageTranslationKey: '',
-                hasOutstandingIOU: iouReport.total !== 0,
                 iouReportID: iouReport.reportID,
                 ...(isNewChatReport ? {pendingFields: {createChat: CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD}} : {}),
             },
@@ -409,7 +408,6 @@ function buildOnyxDataForMoneyRequest(
             onyxMethod: Onyx.METHOD.MERGE,
             key: `${ONYXKEYS.COLLECTION.REPORT}${chatReport.reportID}`,
             value: {
-                hasOutstandingIOU: chatReport.hasOutstandingIOU,
                 iouReportID: chatReport.iouReportID,
                 lastReadTime: chatReport.lastReadTime,
                 pendingFields: null,
@@ -2259,7 +2257,6 @@ function deleteMoneyRequest(transactionID, reportAction, isSingleTransactionView
                       onyxMethod: Onyx.METHOD.MERGE,
                       key: `${ONYXKEYS.COLLECTION.REPORT}${chatReport.reportID}`,
                       value: {
-                          hasOutstandingIOU: false,
                           hasOutstandingChildRequest: false,
                           iouReportID: null,
                           lastMessageText: ReportActionsUtils.getLastVisibleMessage(iouReport.chatReportID, {[reportPreviewAction.reportActionID]: null}).lastMessageText,
@@ -2604,7 +2601,6 @@ function getPayMoneyRequestParams(chatReport, iouReport, recipient, paymentMetho
                 ...chatReport,
                 lastReadTime: DateUtils.getDBTime(),
                 lastVisibleActionCreated: optimisticIOUReportAction.created,
-                hasOutstandingIOU: false,
                 hasOutstandingChildRequest: false,
                 iouReportID: null,
                 lastMessageText: optimisticIOUReportAction.message[0].text,
@@ -2628,7 +2624,6 @@ function getPayMoneyRequestParams(chatReport, iouReport, recipient, paymentMetho
                 ...iouReport,
                 lastMessageText: optimisticIOUReportAction.message[0].text,
                 lastMessageHtml: optimisticIOUReportAction.message[0].html,
-                hasOutstandingIOU: false,
                 hasOutstandingChildRequest: false,
                 statusNum: CONST.REPORT.STATUS.REIMBURSED,
             },
@@ -2823,7 +2818,6 @@ function submitReport(expenseReport) {
                       key: `${ONYXKEYS.COLLECTION.REPORT}${parentReport.reportID}`,
                       value: {
                           ...parentReport,
-                          hasOutstandingIOU: false,
                           hasOutstandingChildRequest: false,
                           iouReportID: null,
                       },
@@ -2868,7 +2862,6 @@ function submitReport(expenseReport) {
                       onyxMethod: Onyx.METHOD.MERGE,
                       key: `${ONYXKEYS.COLLECTION.REPORT}${parentReport.reportID}`,
                       value: {
-                          hasOutstandingIOU: parentReport.hasOutstandingIOU,
                           hasOutstandingChildRequest: parentReport.hasOutstandingChildRequest,
                           iouReportID: expenseReport.reportID,
                       },
diff --git a/src/pages/home/ReportScreen.js b/src/pages/home/ReportScreen.js
index 8db899a8f73f..50d6531096fc 100644
--- a/src/pages/home/ReportScreen.js
+++ b/src/pages/home/ReportScreen.js
@@ -99,9 +99,7 @@ const propTypes = {
 const defaultProps = {
     isSidebarLoaded: false,
     reportActions: [],
-    report: {
-        hasOutstandingIOU: false,
-    },
+    report: {},
     reportMetadata: {
         isLoadingInitialReportActions: true,
         isLoadingOlderReportActions: false,
diff --git a/src/pages/home/report/ReportActionItem.js b/src/pages/home/report/ReportActionItem.js
index e172627d04ef..3e4eebffe48f 100644
--- a/src/pages/home/report/ReportActionItem.js
+++ b/src/pages/home/report/ReportActionItem.js
@@ -103,10 +103,6 @@ const propTypes = {
     /** Draft message - if this is set the comment is in 'edit' mode */
     draftMessage: PropTypes.string,
 
-    /* Whether the option has an outstanding IOU */
-    // eslint-disable-next-line react/no-unused-prop-types
-    hasOutstandingIOU: PropTypes.bool,
-
     /** Stores user's preferred skin tone */
     preferredSkinTone: PropTypes.oneOfType([PropTypes.number, PropTypes.string]),
 
@@ -128,7 +124,6 @@ const defaultProps = {
     preferredSkinTone: CONST.EMOJI_DEFAULT_SKIN_TONE,
     emojiReactions: {},
     shouldShowSubscriptAvatar: false,
-    hasOutstandingIOU: false,
     iouReport: undefined,
     shouldHideThreadDividerLine: false,
     userWallet: {},
@@ -788,7 +783,6 @@ export default compose(
             prevProps.displayAsGroup === nextProps.displayAsGroup &&
             prevProps.draftMessage === nextProps.draftMessage &&
             prevProps.isMostRecentIOUReportAction === nextProps.isMostRecentIOUReportAction &&
-            prevProps.hasOutstandingIOU === nextProps.hasOutstandingIOU &&
             prevProps.shouldDisplayNewMarker === nextProps.shouldDisplayNewMarker &&
             _.isEqual(prevProps.emojiReactions, nextProps.emojiReactions) &&
             _.isEqual(prevProps.action, nextProps.action) &&
diff --git a/src/pages/home/report/ReportActionsList.js b/src/pages/home/report/ReportActionsList.js
index 183665891929..55995a8059e7 100644
--- a/src/pages/home/report/ReportActionsList.js
+++ b/src/pages/home/report/ReportActionsList.js
@@ -131,7 +131,6 @@ function ReportActionsList({
     isSmallScreenWidth,
     personalDetailsList,
     currentUserPersonalDetails,
-    hasOutstandingIOU,
     loadNewerChats,
     loadOlderChats,
     onLayout,
@@ -383,14 +382,13 @@ function ReportActionsList({
                 index={index}
                 report={report}
                 linkedReportActionID={linkedReportActionID}
-                hasOutstandingIOU={hasOutstandingIOU}
                 sortedReportActions={sortedReportActions}
                 mostRecentIOUReportActionID={mostRecentIOUReportActionID}
                 shouldHideThreadDividerLine={shouldHideThreadDividerLine}
                 shouldDisplayNewMarker={shouldDisplayNewMarker(reportAction, index)}
             />
         ),
-        [report, linkedReportActionID, hasOutstandingIOU, sortedReportActions, mostRecentIOUReportActionID, shouldHideThreadDividerLine, shouldDisplayNewMarker],
+        [report, linkedReportActionID, sortedReportActions, mostRecentIOUReportActionID, shouldHideThreadDividerLine, shouldDisplayNewMarker],
     );
 
     // Native mobile does not render updates flatlist the changes even though component did update called.
diff --git a/src/pages/home/report/ReportActionsListItemRenderer.js b/src/pages/home/report/ReportActionsListItemRenderer.js
index 0273a3f31805..516053d1fe6a 100644
--- a/src/pages/home/report/ReportActionsListItemRenderer.js
+++ b/src/pages/home/report/ReportActionsListItemRenderer.js
@@ -19,9 +19,6 @@ const propTypes = {
     /** Report for this action */
     report: reportPropTypes.isRequired,
 
-    /** Whether the option has an outstanding IOU */
-    hasOutstandingIOU: PropTypes.bool,
-
     /** Sorted actions prepared for display */
     sortedReportActions: PropTypes.arrayOf(PropTypes.shape(reportActionPropTypes)).isRequired,
 
@@ -40,7 +37,6 @@ const propTypes = {
 
 const defaultProps = {
     mostRecentIOUReportActionID: '',
-    hasOutstandingIOU: false,
     linkedReportActionID: '',
 };
 
@@ -48,7 +44,6 @@ function ReportActionsListItemRenderer({
     reportAction,
     index,
     report,
-    hasOutstandingIOU,
     sortedReportActions,
     mostRecentIOUReportActionID,
     shouldHideThreadDividerLine,
@@ -80,7 +75,6 @@ function ReportActionsListItemRenderer({
                 _.contains([CONST.REPORT.ACTIONS.TYPE.IOU, CONST.REPORT.ACTIONS.TYPE.REPORTPREVIEW], reportAction.actionName)
             }
             isMostRecentIOUReportAction={reportAction.reportActionID === mostRecentIOUReportActionID}
-            hasOutstandingIOU={hasOutstandingIOU}
             index={index}
         />
     );
diff --git a/src/pages/home/report/ReportActionsView.js b/src/pages/home/report/ReportActionsView.js
index e7b293babdf5..2758437a3962 100755
--- a/src/pages/home/report/ReportActionsView.js
+++ b/src/pages/home/report/ReportActionsView.js
@@ -315,10 +315,6 @@ function arePropsEqual(oldProps, newProps) {
         return false;
     }
 
-    if (lodashGet(newProps.report, 'hasOutstandingIOU') !== lodashGet(oldProps.report, 'hasOutstandingIOU')) {
-        return false;
-    }
-
     if (newProps.isComposerFullSize !== oldProps.isComposerFullSize) {
         return false;
     }
diff --git a/src/pages/home/sidebar/SidebarLinksData.js b/src/pages/home/sidebar/SidebarLinksData.js
index 4f55d5eafca9..97f119bbd2e8 100644
--- a/src/pages/home/sidebar/SidebarLinksData.js
+++ b/src/pages/home/sidebar/SidebarLinksData.js
@@ -148,7 +148,6 @@ const chatReportSelector = (report) =>
         iouReportID: report.iouReportID,
         total: report.total,
         nonReimbursableTotal: report.nonReimbursableTotal,
-        hasOutstandingIOU: report.hasOutstandingIOU,
         hasOutstandingChildRequest: report.hasOutstandingChildRequest,
         isWaitingOnBankAccount: report.isWaitingOnBankAccount,
         statusNum: report.statusNum,
diff --git a/src/pages/reportPropTypes.js b/src/pages/reportPropTypes.js
index a3bbbda5c0bf..c89ea761f582 100644
--- a/src/pages/reportPropTypes.js
+++ b/src/pages/reportPropTypes.js
@@ -7,9 +7,6 @@ export default PropTypes.shape({
     /** The specific type of chat */
     chatType: PropTypes.oneOf(['', ..._.values(CONST.REPORT.CHAT_TYPE)]),
 
-    /** Whether there is an outstanding amount in IOU */
-    hasOutstandingIOU: PropTypes.bool,
-
     /** List of icons for report participants */
     icons: PropTypes.arrayOf(avatarPropTypes),
 
diff --git a/src/types/onyx/Report.ts b/src/types/onyx/Report.ts
index a077bf1a3281..5016bc1ba2d8 100644
--- a/src/types/onyx/Report.ts
+++ b/src/types/onyx/Report.ts
@@ -7,9 +7,6 @@ type Report = {
     /** The specific type of chat */
     chatType?: ValueOf<typeof CONST.REPORT.CHAT_TYPE>;
 
-    /** Whether there is an outstanding amount in IOU */
-    hasOutstandingIOU?: boolean;
-
     /** Whether the report has a child that is an outstanding money request that is awaiting action from the current user */
     hasOutstandingChildRequest?: boolean;
 

From ad9d3c2167aaf9901c5059e36efdaebd5afed223 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 11 Dec 2023 12:46:46 +0100
Subject: [PATCH 17/18] remove hasOutstandingIOU from tests

---
 tests/actions/IOUTest.js           | 17 -----------------
 tests/unit/OptionsListUtilsTest.js |  1 -
 tests/unit/ReportUtilsTest.js      |  6 ------
 tests/unit/SidebarFilterTest.js    |  4 ----
 tests/unit/SidebarOrderTest.js     |  1 -
 tests/utils/LHNTestUtils.js        |  3 ---
 6 files changed, 32 deletions(-)

diff --git a/tests/actions/IOUTest.js b/tests/actions/IOUTest.js
index 18793e88d624..97c1bf35732f 100644
--- a/tests/actions/IOUTest.js
+++ b/tests/actions/IOUTest.js
@@ -83,7 +83,6 @@ describe('actions/IOU', () => {
                                     // They should be linked together
                                     expect(chatReport.participantAccountIDs).toEqual([CARLOS_ACCOUNT_ID]);
                                     expect(chatReport.iouReportID).toBe(iouReport.reportID);
-                                    expect(chatReport.hasOutstandingIOU).toBe(true);
 
                                     resolve();
                                 },
@@ -206,7 +205,6 @@ describe('actions/IOU', () => {
             let chatReport = {
                 reportID: 1234,
                 type: CONST.REPORT.TYPE.CHAT,
-                hasOutstandingIOU: false,
                 participantAccountIDs: [CARLOS_ACCOUNT_ID],
             };
             const createdAction = {
@@ -249,7 +247,6 @@ describe('actions/IOU', () => {
 
                                     // They should be linked together
                                     expect(chatReport.iouReportID).toBe(iouReportID);
-                                    expect(chatReport.hasOutstandingIOU).toBe(true);
 
                                     resolve();
                                 },
@@ -370,7 +367,6 @@ describe('actions/IOU', () => {
             let chatReport = {
                 reportID: chatReportID,
                 type: CONST.REPORT.TYPE.CHAT,
-                hasOutstandingIOU: true,
                 iouReportID,
                 participantAccountIDs: [CARLOS_ACCOUNT_ID],
             };
@@ -581,7 +577,6 @@ describe('actions/IOU', () => {
                                         // They should be linked together
                                         expect(chatReport.participantAccountIDs).toEqual([CARLOS_ACCOUNT_ID]);
                                         expect(chatReport.iouReportID).toBe(iouReport.reportID);
-                                        expect(chatReport.hasOutstandingIOU).toBe(true);
 
                                         resolve();
                                     },
@@ -815,7 +810,6 @@ describe('actions/IOU', () => {
             let carlosChatReport = {
                 reportID: NumberUtils.rand64(),
                 type: CONST.REPORT.TYPE.CHAT,
-                hasOutstandingIOU: false,
                 participantAccountIDs: [CARLOS_ACCOUNT_ID],
             };
             const carlosCreatedAction = {
@@ -827,7 +821,6 @@ describe('actions/IOU', () => {
             let julesChatReport = {
                 reportID: NumberUtils.rand64(),
                 type: CONST.REPORT.TYPE.CHAT,
-                hasOutstandingIOU: true,
                 iouReportID: julesIOUReportID,
                 participantAccountIDs: [JULES_ACCOUNT_ID],
             };
@@ -985,16 +978,13 @@ describe('actions/IOU', () => {
                                     expect(groupChat.pendingFields).toStrictEqual({createChat: CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD});
 
                                     // The 1:1 chat reports and the IOU reports should be linked together
-                                    expect(carlosChatReport.hasOutstandingIOU).toBe(true);
                                     expect(carlosChatReport.iouReportID).toBe(carlosIOUReport.reportID);
                                     expect(carlosIOUReport.chatReportID).toBe(carlosChatReport.reportID);
                                     expect(carlosIOUReport.notificationPreference).toBe(CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN);
 
-                                    expect(julesChatReport.hasOutstandingIOU).toBe(true);
                                     expect(julesChatReport.iouReportID).toBe(julesIOUReport.reportID);
                                     expect(julesIOUReport.chatReportID).toBe(julesChatReport.reportID);
 
-                                    expect(vitChatReport.hasOutstandingIOU).toBe(true);
                                     expect(vitChatReport.iouReportID).toBe(vitIOUReport.reportID);
                                     expect(vitIOUReport.chatReportID).toBe(vitChatReport.reportID);
                                     expect(carlosIOUReport.notificationPreference).toBe(CONST.REPORT.NOTIFICATION_PREFERENCE.HIDDEN);
@@ -1233,7 +1223,6 @@ describe('actions/IOU', () => {
                                     expect(chatReport).toBeTruthy();
                                     expect(chatReport).toHaveProperty('reportID');
                                     expect(chatReport).toHaveProperty('iouReportID');
-                                    expect(chatReport.hasOutstandingIOU).toBe(true);
 
                                     iouReport = _.find(allReports, (report) => report.type === CONST.REPORT.TYPE.IOU);
                                     expect(iouReport).toBeTruthy();
@@ -1313,7 +1302,6 @@ describe('actions/IOU', () => {
                                     chatReport = _.find(allReports, (r) => r.type === CONST.REPORT.TYPE.CHAT);
                                     iouReport = _.find(allReports, (r) => r.type === CONST.REPORT.TYPE.IOU);
 
-                                    expect(chatReport.hasOutstandingIOU).toBe(false);
                                     expect(chatReport.iouReportID).toBeFalsy();
 
                                     // expect(iouReport.status).toBe(CONST.REPORT.STATUS.REIMBURSED);
@@ -1364,7 +1352,6 @@ describe('actions/IOU', () => {
                                     chatReport = _.find(allReports, (r) => r.type === CONST.REPORT.TYPE.CHAT);
                                     iouReport = _.find(allReports, (r) => r.type === CONST.REPORT.TYPE.IOU);
 
-                                    expect(chatReport.hasOutstandingIOU).toBe(false);
                                     expect(chatReport.iouReportID).toBeFalsy();
 
                                     // expect(iouReport.status).toBe(CONST.REPORT.STATUS.REIMBURSED);
@@ -1925,7 +1912,6 @@ describe('actions/IOU', () => {
             expect(chatReport).toBeTruthy();
             expect(chatReport).toHaveProperty('reportID');
             expect(chatReport).toHaveProperty('iouReportID');
-            expect(chatReport.hasOutstandingIOU).toBe(true);
 
             // Then one of them should be an IOU report with relevant properties
             iouReport = _.find(allReports, (report) => report.type === CONST.REPORT.TYPE.IOU);
@@ -2492,7 +2478,6 @@ describe('actions/IOU', () => {
             expect(iouReport).toBeTruthy();
             expect(iouReport).toHaveProperty('reportID');
             expect(iouReport).toHaveProperty('chatReportID');
-            expect(iouReport.hasOutstandingIOU).toBeTruthy();
             expect(iouReport.total).toBe(30000);
 
             const ioupreview = ReportActionsUtils.getReportPreviewAction(chatReport.reportID, iouReport.reportID);
@@ -2510,7 +2495,6 @@ describe('actions/IOU', () => {
             expect(iouReport).toBeTruthy();
             expect(iouReport).toHaveProperty('reportID');
             expect(iouReport).toHaveProperty('chatReportID');
-            expect(iouReport.hasOutstandingIOU).toBeTruthy();
             expect(iouReport.total).toBe(20000);
 
             // When we resume fetch
@@ -2520,7 +2504,6 @@ describe('actions/IOU', () => {
             expect(iouReport).toBeTruthy();
             expect(iouReport).toHaveProperty('reportID');
             expect(iouReport).toHaveProperty('chatReportID');
-            expect(iouReport.hasOutstandingIOU).toBeTruthy();
             expect(iouReport.total).toBe(20000);
         });
 
diff --git a/tests/unit/OptionsListUtilsTest.js b/tests/unit/OptionsListUtilsTest.js
index 2f4294e53c73..45ddf44b244a 100644
--- a/tests/unit/OptionsListUtilsTest.js
+++ b/tests/unit/OptionsListUtilsTest.js
@@ -99,7 +99,6 @@ describe('OptionsListUtils', () => {
             participantAccountIDs: [8],
             reportName: 'Mister Sinister',
             iouReportID: 100,
-            hasOutstandingIOU: true,
             type: CONST.REPORT.TYPE.CHAT,
         },
 
diff --git a/tests/unit/ReportUtilsTest.js b/tests/unit/ReportUtilsTest.js
index e0c98b1793f1..d060adb4c072 100644
--- a/tests/unit/ReportUtilsTest.js
+++ b/tests/unit/ReportUtilsTest.js
@@ -254,7 +254,6 @@ describe('ReportUtils', () => {
             const report = {
                 ...LHNTestUtils.getFakeReport(),
                 ownerAccountID: undefined,
-                hasOutstandingIOU: true,
             };
             expect(ReportUtils.requiresAttentionFromCurrentUser(report)).toBe(false);
         });
@@ -266,7 +265,6 @@ describe('ReportUtils', () => {
             Onyx.merge(`${ONYXKEYS.COLLECTION.REPORT}1`, {
                 reportID: '1',
                 ownerAccountID: 99,
-                hasOutstandingIOU: true,
             }).then(() => {
                 expect(ReportUtils.requiresAttentionFromCurrentUser(report)).toBe(false);
             });
@@ -274,7 +272,6 @@ describe('ReportUtils', () => {
         it('returns false when the report has no outstanding IOU but is waiting for a bank account and the logged user is the report owner', () => {
             const report = {
                 ...LHNTestUtils.getFakeReport(),
-                hasOutstandingIOU: false,
                 ownerAccountID: currentUserAccountID,
                 isWaitingOnBankAccount: true,
             };
@@ -283,7 +280,6 @@ describe('ReportUtils', () => {
         it('returns false when the report has outstanding IOU and is not waiting for a bank account and the logged user is the report owner', () => {
             const report = {
                 ...LHNTestUtils.getFakeReport(),
-                hasOutstandingIOU: true,
                 ownerAccountID: currentUserAccountID,
                 isWaitingOnBankAccount: false,
             };
@@ -292,7 +288,6 @@ describe('ReportUtils', () => {
         it('returns false when the report has no oustanding IOU but is waiting for a bank account and the logged user is not the report owner', () => {
             const report = {
                 ...LHNTestUtils.getFakeReport(),
-                hasOutstandingIOU: false,
                 ownerAccountID: 97,
                 isWaitingOnBankAccount: true,
             };
@@ -319,7 +314,6 @@ describe('ReportUtils', () => {
             const report = {
                 ...LHNTestUtils.getFakeReport(),
                 ownerAccountID: 99,
-                hasOutstandingIOU: true,
                 hasOutstandingChildRequest: true,
                 isWaitingOnBankAccount: false,
             };
diff --git a/tests/unit/SidebarFilterTest.js b/tests/unit/SidebarFilterTest.js
index e421e16e270f..dd2985ea34a8 100644
--- a/tests/unit/SidebarFilterTest.js
+++ b/tests/unit/SidebarFilterTest.js
@@ -295,8 +295,6 @@ describe('Sidebar', () => {
             // 4. isUnread
             // 5. isPinned
             // 6. hasDraft
-            // There is one setting not represented here, which is hasOutstandingIOU. In order to test that setting, there must be
-            // additional reports in Onyx, so it's being left out for now. It's identical to the logic for hasDraft and isPinned though.
 
             // Given these combinations of booleans which result in the report being filtered out (not shown).
             const booleansWhichRemovesActiveReport = [
@@ -620,8 +618,6 @@ describe('Sidebar', () => {
         // 4. isUnread
         // 5. isPinned
         // 6. hasDraft
-        // There is one setting not represented here, which is hasOutstandingIOU. In order to test that setting, there must be
-        // additional reports in Onyx, so it's being left out for now. It's identical to the logic for hasDraft and isPinned though.
 
         // Given these combinations of booleans which result in the report being filtered out (not shown).
         const booleansWhichRemovesActiveReport = [
diff --git a/tests/unit/SidebarOrderTest.js b/tests/unit/SidebarOrderTest.js
index 824e8e6b78e4..44d6dd57de91 100644
--- a/tests/unit/SidebarOrderTest.js
+++ b/tests/unit/SidebarOrderTest.js
@@ -889,7 +889,6 @@ describe('Sidebar', () => {
             };
             const report3 = {
                 ...LHNTestUtils.getFakeReport([5, 6]),
-                hasOutstandingIOU: false,
 
                 // This has to be added after the IOU report is generated
                 iouReportID: null,
diff --git a/tests/utils/LHNTestUtils.js b/tests/utils/LHNTestUtils.js
index 546853b8893b..8385b3fd3e4b 100644
--- a/tests/utils/LHNTestUtils.js
+++ b/tests/utils/LHNTestUtils.js
@@ -196,9 +196,6 @@ function getFakeReportAction(actor = 'email1@test.com', millisecondsInThePast =
 }
 
 /**
- * There is one setting not represented here, which is hasOutstandingIOU. In order to test that setting, there must be
- * additional reports in Onyx, so it's being left out for now.
- *
  * @param {boolean} isArchived
  * @param {boolean} isUserCreatedPolicyRoom
  * @param {boolean} hasAddWorkspaceError

From 9939213804d745fb5950f69179736a645eabb6be Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 11 Dec 2023 16:20:34 +0100
Subject: [PATCH 18/18] integrate isProcessingReport helper

---
 src/libs/ReportUtils.ts | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/libs/ReportUtils.ts b/src/libs/ReportUtils.ts
index 7594443b2e3b..6a59d39ce9e4 100644
--- a/src/libs/ReportUtils.ts
+++ b/src/libs/ReportUtils.ts
@@ -748,6 +748,13 @@ function isConciergeChatReport(report: OnyxEntry<Report>): boolean {
     return report?.participantAccountIDs?.length === 1 && Number(report.participantAccountIDs?.[0]) === CONST.ACCOUNT_ID.CONCIERGE && !isChatThread(report);
 }
 
+/**
+ * Returns true if report is still being processed
+ */
+function isProcessingReport(report: OnyxEntry<Report>): boolean {
+    return report?.stateNum === CONST.REPORT.STATE_NUM.PROCESSING && report?.statusNum === CONST.REPORT.STATUS.SUBMITTED;
+}
+
 /**
  * Check if the report is a single chat report that isn't a thread
  * and personal detail of participant is optimistic data
@@ -1725,7 +1732,7 @@ function getMoneyRequestReportName(report: OnyxEntry<Report>, policy: OnyxEntry<
         return Localize.translateLocal('iou.payerSpentAmount', {payer: payerName, amount: formattedAmount});
     }
 
-    if ((report?.stateNum === CONST.REPORT.STATE_NUM.PROCESSING && report?.statusNum === CONST.REPORT.STATUS.SUBMITTED) || isDraftExpenseReport(report) || moneyRequestTotal === 0) {
+    if (isProcessingReport(report) || isDraftExpenseReport(report) || moneyRequestTotal === 0) {
         return Localize.translateLocal('iou.payerOwesAmount', {payer: payerName, amount: formattedAmount});
     }
 
@@ -4339,6 +4346,7 @@ export {
     isPublicRoom,
     isPublicAnnounceRoom,
     isConciergeChatReport,
+    isProcessingReport,
     isCurrentUserTheOnlyParticipant,
     hasAutomatedExpensifyAccountIDs,
     hasExpensifyGuidesEmails,