From e7dc2811adba8fb09d6a7ab591cf6bb269416466 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 11 Dec 2023 14:46:56 +0100
Subject: [PATCH 1/3] fix tall emojies

---
 src/components/ReportActionItem/ReportPreview.js | 13 ++++++++++++-
 src/styles/styles.ts                             |  8 ++++----
 2 files changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/components/ReportActionItem/ReportPreview.js b/src/components/ReportActionItem/ReportPreview.js
index 615e91dc5fc4..a7cf2c0d951d 100644
--- a/src/components/ReportActionItem/ReportPreview.js
+++ b/src/components/ReportActionItem/ReportPreview.js
@@ -27,6 +27,7 @@ import reportActionPropTypes from '@pages/home/report/reportActionPropTypes';
 import reportPropTypes from '@pages/reportPropTypes';
 import useTheme from '@styles/themes/useTheme';
 import useThemeStyles from '@styles/useThemeStyles';
+import variables from '@styles/variables';
 import * as IOU from '@userActions/IOU';
 import CONST from '@src/CONST';
 import ONYXKEYS from '@src/ONYXKEYS';
@@ -216,7 +217,17 @@ function ReportPreview(props) {
                     <View style={styles.reportPreviewBoxBody}>
                         <View style={styles.flexRow}>
                             <View style={[styles.flex1, styles.flexRow, styles.alignItemsCenter]}>
-                                <Text style={[styles.textLabelSupporting, styles.mb1, styles.lh20]}>{getPreviewMessage()}</Text>
+                                <Text
+                                    style={[
+                                        styles.textLabelSupporting,
+                                        styles.mb1,
+                                        {
+                                            lineHeight: variables.lineHeightXXLarge,
+                                        },
+                                    ]}
+                                >
+                                    {getPreviewMessage()}
+                                </Text>
                             </View>
                             {!iouSettled && hasErrors && (
                                 <Icon
diff --git a/src/styles/styles.ts b/src/styles/styles.ts
index a880a434b8f2..0d70716b7c27 100644
--- a/src/styles/styles.ts
+++ b/src/styles/styles.ts
@@ -415,7 +415,7 @@ const styles = (theme: ThemeColors) =>
             ...whiteSpace.preWrap,
             color: theme.heading,
             fontSize: variables.fontSizeXLarge,
-            lineHeight: variables.lineHeightXXLarge,
+            lineHeight: variables.lineHeightXXXLarge,
         },
 
         textHeadlineH1: {
@@ -1544,7 +1544,7 @@ const styles = (theme: ThemeColors) =>
         optionDisplayName: {
             fontFamily: fontFamily.EXP_NEUE,
             minHeight: variables.alternateTextHeight,
-            lineHeight: variables.lineHeightXLarge,
+            lineHeight: variables.lineHeightXXLarge,
             ...whiteSpace.noWrap,
         },
 
@@ -1564,7 +1564,7 @@ const styles = (theme: ThemeColors) =>
 
         optionAlternateText: {
             minHeight: variables.alternateTextHeight,
-            lineHeight: variables.lineHeightXLarge,
+            lineHeight: variables.lineHeightXXLarge,
         },
 
         optionAlternateTextCompact: {
@@ -1692,7 +1692,7 @@ const styles = (theme: ThemeColors) =>
             fontFamily: fontFamily.EXP_NEUE_BOLD,
             fontSize: variables.fontSizeNormal,
             fontWeight: fontWeightBold,
-            lineHeight: variables.lineHeightXLarge,
+            lineHeight: variables.lineHeightXXLarge,
             ...wordBreak.breakWord,
         },
 

From 0acc8334ad6ba987a85d391a3929068ed91a3e42 Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Mon, 11 Dec 2023 16:49:46 +0100
Subject: [PATCH 2/3] fix tab lineHeight

---
 src/styles/styles.ts | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/styles/styles.ts b/src/styles/styles.ts
index 0d70716b7c27..ed4258b942f0 100644
--- a/src/styles/styles.ts
+++ b/src/styles/styles.ts
@@ -3617,6 +3617,7 @@ const styles = (theme: ThemeColors) =>
                 fontFamily: isSelected ? fontFamily.EXP_NEUE_BOLD : fontFamily.EXP_NEUE,
                 fontWeight: isSelected ? fontWeightBold : '400',
                 color: isSelected ? theme.text : theme.textSupporting,
+                lineHeight: 14,
             } satisfies TextStyle),
 
         tabBackground: (hovered: boolean, isFocused: boolean, background: string) => ({

From 841969acf698a92538efd7a88e4af2deba15d0cc Mon Sep 17 00:00:00 2001
From: Mykhailo Kravchenko <rezkiy37@gmail.com>
Date: Thu, 21 Dec 2023 10:37:17 +0100
Subject: [PATCH 3/3] use helper

---
 src/components/ReportActionItem/ReportPreview.js | 14 +++-----------
 1 file changed, 3 insertions(+), 11 deletions(-)

diff --git a/src/components/ReportActionItem/ReportPreview.js b/src/components/ReportActionItem/ReportPreview.js
index 26b31c068155..eab9ef6081a9 100644
--- a/src/components/ReportActionItem/ReportPreview.js
+++ b/src/components/ReportActionItem/ReportPreview.js
@@ -14,6 +14,7 @@ import {showContextMenuForReport} from '@components/ShowContextMenuContext';
 import Text from '@components/Text';
 import withLocalize, {withLocalizePropTypes} from '@components/withLocalize';
 import useLocalize from '@hooks/useLocalize';
+import useStyleUtils from '@hooks/useStyleUtils';
 import useTheme from '@hooks/useTheme';
 import useThemeStyles from '@hooks/useThemeStyles';
 import compose from '@libs/compose';
@@ -120,6 +121,7 @@ const defaultProps = {
 function ReportPreview(props) {
     const theme = useTheme();
     const styles = useThemeStyles();
+    const {getLineHeightStyle} = useStyleUtils();
     const {translate} = useLocalize();
 
     const managerID = props.iouReport.managerID || 0;
@@ -244,17 +246,7 @@ function ReportPreview(props) {
                     <View style={styles.reportPreviewBoxBody}>
                         <View style={styles.flexRow}>
                             <View style={[styles.flex1, styles.flexRow, styles.alignItemsCenter]}>
-                                <Text
-                                    style={[
-                                        styles.textLabelSupporting,
-                                        styles.mb1,
-                                        {
-                                            lineHeight: variables.lineHeightXXLarge,
-                                        },
-                                    ]}
-                                >
-                                    {getPreviewMessage()}
-                                </Text>
+                                <Text style={[styles.textLabelSupporting, styles.mb1, getLineHeightStyle(variables.lineHeightXXLarge)]}>{getPreviewMessage()}</Text>
                             </View>
                             {!iouSettled && hasErrors && (
                                 <Icon