From 5e18ff0fc1d06d3be5024c1847b0522b84f99263 Mon Sep 17 00:00:00 2001
From: Ali Toshmatov <alitoshmatov2001@gmail.com>
Date: Tue, 23 May 2023 18:34:03 +0500
Subject: [PATCH] Updated state initialization in MoneyRequestAmount page, and
 improved useEffect in Money request modal to update selectedCurrencyCode when
 openModal response is ready

---
 src/pages/iou/MoneyRequestModal.js            | 11 +++++++++--
 src/pages/iou/steps/MoneyRequestAmountPage.js | 14 ++++++++++----
 2 files changed, 19 insertions(+), 6 deletions(-)

diff --git a/src/pages/iou/MoneyRequestModal.js b/src/pages/iou/MoneyRequestModal.js
index 6d8f82ea5b45..9bc48bc1ba6a 100644
--- a/src/pages/iou/MoneyRequestModal.js
+++ b/src/pages/iou/MoneyRequestModal.js
@@ -113,11 +113,18 @@ const MoneyRequestModal = (props) => {
 
     useEffect(() => {
         PersonalDetails.openMoneyRequestModalPage();
-        IOU.setIOUSelectedCurrency(props.currentUserPersonalDetails.localCurrencyCode);
         IOU.setMoneyRequestDescription('');
-        // eslint-disable-next-line react-hooks/exhaustive-deps -- props.currentUserPersonalDetails will always exist from Onyx and we don't want this effect to run again
     }, []);
 
+    // We update selected currency when PersonalDetails.openMoneyRequestModalPage finishes
+    // props.currentUserPersonalDetails might be stale data or might not exist if user is signing in
+    useEffect(() => {
+        if (_.isUndefined(props.currentUserPersonalDetails.localCurrencyCode)) {
+            return;
+        }
+        IOU.setIOUSelectedCurrency(props.currentUserPersonalDetails.localCurrencyCode);
+    }, [props.currentUserPersonalDetails.localCurrencyCode]);
+
     // User came back online, so let's refetch the currency details based on location
     useOnNetworkReconnect(PersonalDetails.openMoneyRequestModalPage);
 
diff --git a/src/pages/iou/steps/MoneyRequestAmountPage.js b/src/pages/iou/steps/MoneyRequestAmountPage.js
index 3732e638dfe0..50a6a18eec9d 100755
--- a/src/pages/iou/steps/MoneyRequestAmountPage.js
+++ b/src/pages/iou/steps/MoneyRequestAmountPage.js
@@ -44,9 +44,7 @@ const propTypes = {
 };
 
 const defaultProps = {
-    iou: {
-        selectedCurrencyCode: CONST.CURRENCY.USD,
-    },
+    iou: {},
 };
 class MoneyRequestAmountPage extends React.Component {
     constructor(props) {
@@ -66,7 +64,7 @@ class MoneyRequestAmountPage extends React.Component {
         const selectedAmountAsString = props.selectedAmount ? props.selectedAmount.toString() : '';
         this.state = {
             amount: selectedAmountAsString,
-            selectedCurrencyCode: props.iou.selectedCurrencyCode,
+            selectedCurrencyCode: _.isUndefined(props.iou.selectedCurrencyCode) ? CONST.CURRENCY.USD : props.iou.selectedCurrencyCode,
             shouldUpdateSelection: true,
             selection: {
                 start: selectedAmountAsString.length,
@@ -85,6 +83,14 @@ class MoneyRequestAmountPage extends React.Component {
         });
     }
 
+    componentDidUpdate(prevProps) {
+        if (prevProps.iou.selectedCurrencyCode === this.props.iou.selectedCurrencyCode) {
+            return;
+        }
+
+        this.setState({selectedCurrencyCode: this.props.iou.selectedCurrencyCode});
+    }
+
     componentWillUnmount() {
         this.unsubscribeNavFocus();
     }