Merge pull request #30058 from ZhenjaHorbach/iou-skeleton-changes-the…

…-currency-to-/bin/zsh.00 Fix bug with When deleting a money request offline, the IOU skeleton changes the currency to $0.00
Expensify · Oct 25, 2023 · fa86c6a · fa86c6a
2 parents 7232418 + aec3338
commit fa86c6a
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 1 deletion.
diff --git a/src/components/ReportActionItem/MoneyRequestPreview.js b/src/components/ReportActionItem/MoneyRequestPreview.js
@@ -166,6 +166,7 @@ function MoneyRequestPreview(props) {
     const isDistanceRequest = TransactionUtils.isDistanceRequest(props.transaction);
     const isExpensifyCardTransaction = TransactionUtils.isExpensifyCardTransaction(props.transaction);
     const isSettled = ReportUtils.isSettled(props.iouReport.reportID);
+    const isDeleted = lodashGet(props.action, 'pendingAction', null) === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE;
 
     // Show the merchant for IOUs and expenses only if they are custom or not related to scanning smartscan
     const shouldShowMerchant =
@@ -232,6 +233,16 @@ function MoneyRequestPreview(props) {
         return CurrencyUtils.convertToDisplayString(requestAmount, requestCurrency);
     };
 
+    const getDisplayDeleteAmountText = () => {
+        const {amount, currency} = ReportUtils.getTransactionDetails(props.action.originalMessage);
+
+        if (isDistanceRequest) {
+            return CurrencyUtils.convertToDisplayString(TransactionUtils.getAmount(props.action.originalMessage), currency);
+        }
+
+        return CurrencyUtils.convertToDisplayString(amount, currency);
+    };
+
     const childContainer = (
         <View>
             <OfflineWithFeedback
@@ -277,10 +288,11 @@ function MoneyRequestPreview(props) {
                                         style={[
                                             styles.moneyRequestPreviewAmount,
                                             StyleUtils.getAmountFontSizeAndLineHeight(variables.fontSizeXLarge, variables.lineHeightXXLarge, isSmallScreenWidth, windowWidth),
+                                            isDeleted && styles.lineThrough,
                                         ]}
                                         numberOfLines={1}
                                     >
-                                        {getDisplayAmountText()}
+                                        {isDeleted ? getDisplayDeleteAmountText() : getDisplayAmountText()}
                                     </Text>
                                     {ReportUtils.isSettled(props.iouReport.reportID) && !props.isBillSplit && (
                                         <View style={styles.defaultCheckmarkWrapper}>

diff --git a/src/styles/styles.ts b/src/styles/styles.ts
@@ -36,6 +36,7 @@ import writingDirection from './utilities/writingDirection';
 import variables from './variables';
 import colors from './colors';
 import objectFit from './utilities/objectFit';
+import textDecorationLine from './utilities/textDecorationLine';
 
 type AnchorPosition = {
     horizontal: number;
@@ -227,6 +228,7 @@ const styles = (theme: ThemeDefault) =>
         ...userSelect,
         ...textUnderline,
         ...objectFit,
+        ...textDecorationLine,
 
         autoCompleteSuggestionsContainer: {
             backgroundColor: theme.appBG,

diff --git a/src/styles/utilities/textDecorationLine.ts b/src/styles/utilities/textDecorationLine.ts
@@ -0,0 +1,8 @@
+import {TextStyle} from 'react-native';
+
+export default {
+    lineThrough: {
+        textDecorationLine: 'line-through',
+        textDecorationStyle: 'solid',
+    },
+} satisfies Record<string, TextStyle>;