From 9f712ffb68533b6508fd65aefabce864f4f5f939 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Sat, 4 Mar 2023 00:26:38 +0700
Subject: [PATCH 01/13] fix 15438 maintain white space in display name

---
 src/components/DisplayNames/index.js          | 4 ++--
 src/components/MenuItem.js                    | 1 +
 src/pages/home/report/ParticipantLocalTime.js | 1 +
 src/styles/styles.js                          | 2 ++
 4 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/DisplayNames/index.js b/src/components/DisplayNames/index.js
index fd23a011bf69..48a6f95025a7 100644
--- a/src/components/DisplayNames/index.js
+++ b/src/components/DisplayNames/index.js
@@ -71,7 +71,7 @@ class DisplayNames extends PureComponent {
             // No need for any complex text-splitting, just return a simple Text component
             return (
                 <Text
-                    style={this.props.textStyles}
+                    style={[...this.props.textStyles, styles.preWrap]}
                     numberOfLines={this.props.numberOfLines}
                 >
                     {this.props.fullTitle}
@@ -100,7 +100,7 @@ class DisplayNames extends PureComponent {
                             >
                                 {/*  // We need to get the refs to all the names which will be used to correct
                                     the horizontal position of the tooltip */}
-                                <Text ref={el => this.childRefs[index] = el} style={this.props.textStyles}>
+                                <Text ref={el => this.childRefs[index] = el} style={[...this.props.textStyles, styles.preWrap]}>
                                     {displayName}
                                 </Text>
                             </Tooltip>
diff --git a/src/components/MenuItem.js b/src/components/MenuItem.js
index 33563bb029be..bb6efb7c2fe7 100644
--- a/src/components/MenuItem.js
+++ b/src/components/MenuItem.js
@@ -58,6 +58,7 @@ const MenuItem = (props) => {
         (props.icon ? styles.ml3 : undefined),
         (props.shouldShowBasicTitle ? undefined : styles.textStrong),
         (props.interactive && props.disabled ? {...styles.disabledText, ...styles.userSelectNone} : undefined),
+        styles.preWrap,
     ], props.style);
     const descriptionTextStyle = StyleUtils.combineStyles([
         styles.textLabelSupporting,
diff --git a/src/pages/home/report/ParticipantLocalTime.js b/src/pages/home/report/ParticipantLocalTime.js
index a93d2e57adcc..4c0610697f28 100644
--- a/src/pages/home/report/ParticipantLocalTime.js
+++ b/src/pages/home/report/ParticipantLocalTime.js
@@ -65,6 +65,7 @@ class ParticipantLocalTime extends PureComponent {
                     style={[
                         styles.chatItemComposeSecondaryRowSubText,
                         styles.chatItemComposeSecondaryRowOffset,
+                        styles.preWrap,
                     ]}
                     numberOfLines={1}
                 >
diff --git a/src/styles/styles.js b/src/styles/styles.js
index 7637bf42119d..951e3844c7ed 100644
--- a/src/styles/styles.js
+++ b/src/styles/styles.js
@@ -297,6 +297,7 @@ const styles = {
 
     textHeadline: {
         ...headlineFont,
+        ...whiteSpace.preWrap,
         color: themeColors.heading,
         fontSize: variables.fontSizeXLarge,
     },
@@ -1349,6 +1350,7 @@ const styles = {
         fontWeight: fontWeightBold,
         lineHeight: variables.lineHeightXLarge,
         ...wordBreak.breakWord,
+        ...whiteSpace.preWrap,
     },
 
     chatItemMessageHeaderTimestamp: {

From 088cbfce7c2673c202905d9fdcd46d229237fa82 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Mon, 6 Mar 2023 17:20:03 +0700
Subject: [PATCH 02/13] fix: remain the white space in the last message text

---
 src/components/LHNOptionsList/OptionRowLHN.js | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/LHNOptionsList/OptionRowLHN.js b/src/components/LHNOptionsList/OptionRowLHN.js
index c57d51d29eb2..082cd4d32b06 100644
--- a/src/components/LHNOptionsList/OptionRowLHN.js
+++ b/src/components/LHNOptionsList/OptionRowLHN.js
@@ -72,8 +72,8 @@ const OptionRowLHN = (props) => {
         ? [styles.ml1, StyleUtils.getBackgroundColorWithOpacityStyle(themeColors.icon, 0.5)]
         : [styles.ml1];
     const alternateTextStyle = StyleUtils.combineStyles(props.viewMode === CONST.OPTION_MODE.COMPACT
-        ? [textStyle, styles.optionAlternateText, styles.textLabelSupporting, styles.optionAlternateTextCompact, styles.ml2]
-        : [textStyle, styles.optionAlternateText, styles.textLabelSupporting], props.style);
+        ? [textStyle, styles.optionAlternateText, styles.preWrap, styles.textLabelSupporting, styles.optionAlternateTextCompact, styles.ml2]
+        : [textStyle, styles.optionAlternateText, styles.preWrap, styles.textLabelSupporting], props.style);
     const contentContainerStyles = props.viewMode === CONST.OPTION_MODE.COMPACT
         ? [styles.flex1, styles.flexRow, styles.overflowHidden, styles.alignItemsCenter]
         : [styles.flex1];

From 8125ed5fad82e54f32f6a5dea156dfbdccec0058 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Tue, 7 Mar 2023 09:44:35 +0700
Subject: [PATCH 03/13] fix: remain the white space in the subtitle

---
 src/components/Header.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Header.js b/src/components/Header.js
index a69317122aad..092fd56f5acc 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -34,7 +34,7 @@ const Header = props => (
             </Text>
             {/* If there's no subtitle then display a fragment to avoid an empty space which moves the main title */}
             {_.isString(props.subtitle)
-                ? Boolean(props.subtitle) && <Text style={[styles.mutedTextLabel]} numberOfLines={1}>{props.subtitle}</Text>
+                ? Boolean(props.subtitle) && <Text style={[styles.mutedTextLabel, styles.preWrap]} numberOfLines={1}>{props.subtitle}</Text>
                 : props.subtitle}
         </View>
         {props.shouldShowEnvironmentBadge && (

From 26fd1e0066caa2b056f0a9d0318571430355553a Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Tue, 7 Mar 2023 10:31:08 +0700
Subject: [PATCH 04/13] fix: remain the white space in the workspace name

---
 src/components/LHNOptionsList/OptionRowLHN.js | 6 +++---
 src/pages/ReportDetailsPage.js                | 1 +
 src/pages/ReportSettingsPage.js               | 4 ++--
 src/pages/home/HeaderView.js                  | 1 +
 4 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/components/LHNOptionsList/OptionRowLHN.js b/src/components/LHNOptionsList/OptionRowLHN.js
index 082cd4d32b06..69c11870fc4e 100644
--- a/src/components/LHNOptionsList/OptionRowLHN.js
+++ b/src/components/LHNOptionsList/OptionRowLHN.js
@@ -67,10 +67,10 @@ const OptionRowLHN = (props) => {
         : styles.sidebarLinkText;
     const textUnreadStyle = optionItem.isUnread
         ? [textStyle, styles.sidebarLinkTextBold] : [textStyle];
-    const displayNameStyle = StyleUtils.combineStyles([styles.optionDisplayName, styles.optionDisplayNameCompact, ...textUnreadStyle], props.style);
+    const displayNameStyle = StyleUtils.combineStyles([styles.optionDisplayName, styles.optionDisplayNameCompact, styles.preWrap, ...textUnreadStyle], props.style);
     const textPillStyle = props.isFocused
-        ? [styles.ml1, StyleUtils.getBackgroundColorWithOpacityStyle(themeColors.icon, 0.5)]
-        : [styles.ml1];
+        ? [styles.ml1, styles.preWrap, StyleUtils.getBackgroundColorWithOpacityStyle(themeColors.icon, 0.5)]
+        : [styles.ml1, styles.preWrap];
     const alternateTextStyle = StyleUtils.combineStyles(props.viewMode === CONST.OPTION_MODE.COMPACT
         ? [textStyle, styles.optionAlternateText, styles.preWrap, styles.textLabelSupporting, styles.optionAlternateTextCompact, styles.ml2]
         : [textStyle, styles.optionAlternateText, styles.preWrap, styles.textLabelSupporting], props.style);
diff --git a/src/pages/ReportDetailsPage.js b/src/pages/ReportDetailsPage.js
index 02bd202c1d2c..3c0ea7b01ad6 100644
--- a/src/pages/ReportDetailsPage.js
+++ b/src/pages/ReportDetailsPage.js
@@ -143,6 +143,7 @@ class ReportDetailsPage extends Component {
                                             styles.optionAlternateText,
                                             styles.textLabelSupporting,
                                             styles.mb2,
+                                            styles.preWrap,
                                         ]}
                                         numberOfLines={1}
                                     >
diff --git a/src/pages/ReportSettingsPage.js b/src/pages/ReportSettingsPage.js
index fca21166d0f6..8cf1d8fc11fc 100644
--- a/src/pages/ReportSettingsPage.js
+++ b/src/pages/ReportSettingsPage.js
@@ -166,7 +166,7 @@ class ReportSettingsPage extends Component {
                                                     <Text style={[styles.textLabelSupporting, styles.lh16, styles.mb1]} numberOfLines={1}>
                                                         {this.props.translate('newRoomPage.roomName')}
                                                     </Text>
-                                                    <Text numberOfLines={1} style={[styles.optionAlternateText]}>
+                                                    <Text numberOfLines={1} style={[styles.optionAlternateText, styles.preWrap]}>
                                                         {this.props.report.reportName}
                                                     </Text>
                                                 </View>
@@ -187,7 +187,7 @@ class ReportSettingsPage extends Component {
                                 <Text style={[styles.textLabelSupporting, styles.lh16, styles.mb1]} numberOfLines={1}>
                                     {this.props.translate('workspace.common.workspace')}
                                 </Text>
-                                <Text numberOfLines={1} style={[styles.optionAlternateText]}>
+                                <Text numberOfLines={1} style={[styles.optionAlternateText, styles.preWrap]}>
                                     {linkedWorkspace.name}
                                 </Text>
                             </View>
diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js
index e1bfd267d8f2..860f94e7d3af 100644
--- a/src/pages/home/HeaderView.js
+++ b/src/pages/home/HeaderView.js
@@ -132,6 +132,7 @@ const HeaderView = (props) => {
                                             styles.sidebarLinkText,
                                             styles.optionAlternateText,
                                             styles.textLabelSupporting,
+                                            styles.preWrap,
                                         ]}
                                         numberOfLines={1}
                                     >

From c47bc5cdde2200c7d0349a3ce62c423307cc480c Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Wed, 8 Mar 2023 15:43:31 +0700
Subject: [PATCH 05/13] fix: change white-space is pre if number of line is 1

---
 src/components/DisplayNames/index.js              |  2 +-
 src/components/Header.js                          |  2 +-
 src/components/LHNOptionsList/OptionRowLHN.js     | 10 +++++-----
 src/components/MenuItem.js                        |  2 +-
 src/pages/ReportDetailsPage.js                    |  2 +-
 src/pages/ReportSettingsPage.js                   |  4 ++--
 src/pages/home/HeaderView.js                      |  4 ++--
 src/pages/home/report/ParticipantLocalTime.js     |  2 +-
 src/pages/home/report/ReportActionItemFragment.js |  2 +-
 src/styles/styles.js                              |  2 +-
 src/styles/utilities/whiteSpace/index.js          |  3 +++
 11 files changed, 19 insertions(+), 16 deletions(-)

diff --git a/src/components/DisplayNames/index.js b/src/components/DisplayNames/index.js
index 48a6f95025a7..4cf6fe235521 100644
--- a/src/components/DisplayNames/index.js
+++ b/src/components/DisplayNames/index.js
@@ -71,7 +71,7 @@ class DisplayNames extends PureComponent {
             // No need for any complex text-splitting, just return a simple Text component
             return (
                 <Text
-                    style={[...this.props.textStyles, styles.preWrap]}
+                    style={[...this.props.textStyles, (this.props.numberOfLines === 1 ? styles.pre : styles.preWrap)]}
                     numberOfLines={this.props.numberOfLines}
                 >
                     {this.props.fullTitle}
diff --git a/src/components/Header.js b/src/components/Header.js
index 092fd56f5acc..01752e8e0740 100644
--- a/src/components/Header.js
+++ b/src/components/Header.js
@@ -34,7 +34,7 @@ const Header = props => (
             </Text>
             {/* If there's no subtitle then display a fragment to avoid an empty space which moves the main title */}
             {_.isString(props.subtitle)
-                ? Boolean(props.subtitle) && <Text style={[styles.mutedTextLabel, styles.preWrap]} numberOfLines={1}>{props.subtitle}</Text>
+                ? Boolean(props.subtitle) && <Text style={[styles.mutedTextLabel, styles.pre]} numberOfLines={1}>{props.subtitle}</Text>
                 : props.subtitle}
         </View>
         {props.shouldShowEnvironmentBadge && (
diff --git a/src/components/LHNOptionsList/OptionRowLHN.js b/src/components/LHNOptionsList/OptionRowLHN.js
index 69c11870fc4e..2f7737b6688b 100644
--- a/src/components/LHNOptionsList/OptionRowLHN.js
+++ b/src/components/LHNOptionsList/OptionRowLHN.js
@@ -67,13 +67,13 @@ const OptionRowLHN = (props) => {
         : styles.sidebarLinkText;
     const textUnreadStyle = optionItem.isUnread
         ? [textStyle, styles.sidebarLinkTextBold] : [textStyle];
-    const displayNameStyle = StyleUtils.combineStyles([styles.optionDisplayName, styles.optionDisplayNameCompact, styles.preWrap, ...textUnreadStyle], props.style);
+    const displayNameStyle = StyleUtils.combineStyles([styles.optionDisplayName, styles.optionDisplayNameCompact, ...textUnreadStyle], props.style);
     const textPillStyle = props.isFocused
-        ? [styles.ml1, styles.preWrap, StyleUtils.getBackgroundColorWithOpacityStyle(themeColors.icon, 0.5)]
-        : [styles.ml1, styles.preWrap];
+        ? [styles.ml1, StyleUtils.getBackgroundColorWithOpacityStyle(themeColors.icon, 0.5)]
+        : [styles.ml1];
     const alternateTextStyle = StyleUtils.combineStyles(props.viewMode === CONST.OPTION_MODE.COMPACT
-        ? [textStyle, styles.optionAlternateText, styles.preWrap, styles.textLabelSupporting, styles.optionAlternateTextCompact, styles.ml2]
-        : [textStyle, styles.optionAlternateText, styles.preWrap, styles.textLabelSupporting], props.style);
+        ? [textStyle, styles.optionAlternateText, styles.pre, styles.textLabelSupporting, styles.optionAlternateTextCompact, styles.ml2]
+        : [textStyle, styles.optionAlternateText, styles.pre, styles.textLabelSupporting], props.style);
     const contentContainerStyles = props.viewMode === CONST.OPTION_MODE.COMPACT
         ? [styles.flex1, styles.flexRow, styles.overflowHidden, styles.alignItemsCenter]
         : [styles.flex1];
diff --git a/src/components/MenuItem.js b/src/components/MenuItem.js
index bb6efb7c2fe7..2942f250ce83 100644
--- a/src/components/MenuItem.js
+++ b/src/components/MenuItem.js
@@ -58,7 +58,7 @@ const MenuItem = (props) => {
         (props.icon ? styles.ml3 : undefined),
         (props.shouldShowBasicTitle ? undefined : styles.textStrong),
         (props.interactive && props.disabled ? {...styles.disabledText, ...styles.userSelectNone} : undefined),
-        styles.preWrap,
+        styles.pre,
     ], props.style);
     const descriptionTextStyle = StyleUtils.combineStyles([
         styles.textLabelSupporting,
diff --git a/src/pages/ReportDetailsPage.js b/src/pages/ReportDetailsPage.js
index 3c0ea7b01ad6..3806e701ee73 100644
--- a/src/pages/ReportDetailsPage.js
+++ b/src/pages/ReportDetailsPage.js
@@ -143,7 +143,7 @@ class ReportDetailsPage extends Component {
                                             styles.optionAlternateText,
                                             styles.textLabelSupporting,
                                             styles.mb2,
-                                            styles.preWrap,
+                                            styles.pre,
                                         ]}
                                         numberOfLines={1}
                                     >
diff --git a/src/pages/ReportSettingsPage.js b/src/pages/ReportSettingsPage.js
index 8cf1d8fc11fc..f6d0f74f88f0 100644
--- a/src/pages/ReportSettingsPage.js
+++ b/src/pages/ReportSettingsPage.js
@@ -166,7 +166,7 @@ class ReportSettingsPage extends Component {
                                                     <Text style={[styles.textLabelSupporting, styles.lh16, styles.mb1]} numberOfLines={1}>
                                                         {this.props.translate('newRoomPage.roomName')}
                                                     </Text>
-                                                    <Text numberOfLines={1} style={[styles.optionAlternateText, styles.preWrap]}>
+                                                    <Text numberOfLines={1} style={[styles.optionAlternateText, styles.pre]}>
                                                         {this.props.report.reportName}
                                                     </Text>
                                                 </View>
@@ -187,7 +187,7 @@ class ReportSettingsPage extends Component {
                                 <Text style={[styles.textLabelSupporting, styles.lh16, styles.mb1]} numberOfLines={1}>
                                     {this.props.translate('workspace.common.workspace')}
                                 </Text>
-                                <Text numberOfLines={1} style={[styles.optionAlternateText, styles.preWrap]}>
+                                <Text numberOfLines={1} style={[styles.optionAlternateText, styles.pre]}>
                                     {linkedWorkspace.name}
                                 </Text>
                             </View>
diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js
index 860f94e7d3af..66b534446742 100644
--- a/src/pages/home/HeaderView.js
+++ b/src/pages/home/HeaderView.js
@@ -123,7 +123,7 @@ const HeaderView = (props) => {
                                     displayNamesWithTooltips={displayNamesWithTooltips}
                                     tooltipEnabled
                                     numberOfLines={1}
-                                    textStyles={[styles.headerText, styles.textNoWrap]}
+                                    textStyles={[styles.headerText]}
                                     shouldUseFullTitle={isChatRoom || isPolicyExpenseChat}
                                 />
                                 {(isChatRoom || isPolicyExpenseChat) && (
@@ -132,7 +132,7 @@ const HeaderView = (props) => {
                                             styles.sidebarLinkText,
                                             styles.optionAlternateText,
                                             styles.textLabelSupporting,
-                                            styles.preWrap,
+                                            styles.pre,
                                         ]}
                                         numberOfLines={1}
                                     >
diff --git a/src/pages/home/report/ParticipantLocalTime.js b/src/pages/home/report/ParticipantLocalTime.js
index 4c0610697f28..ab1b3dcc4b5d 100644
--- a/src/pages/home/report/ParticipantLocalTime.js
+++ b/src/pages/home/report/ParticipantLocalTime.js
@@ -65,7 +65,7 @@ class ParticipantLocalTime extends PureComponent {
                     style={[
                         styles.chatItemComposeSecondaryRowSubText,
                         styles.chatItemComposeSecondaryRowOffset,
-                        styles.preWrap,
+                        styles.pre,
                     ]}
                     numberOfLines={1}
                 >
diff --git a/src/pages/home/report/ReportActionItemFragment.js b/src/pages/home/report/ReportActionItemFragment.js
index c4f593517df5..04a57a1178a2 100644
--- a/src/pages/home/report/ReportActionItemFragment.js
+++ b/src/pages/home/report/ReportActionItemFragment.js
@@ -140,7 +140,7 @@ const ReportActionItemFragment = (props) => {
                 <Tooltip text={props.tooltipText}>
                     <Text
                         numberOfLines={props.isSingleLine ? 1 : undefined}
-                        style={[styles.chatItemMessageHeaderSender]}
+                        style={[styles.chatItemMessageHeaderSender, (props.isSingleLine ? styles.pre : styles.preWrap)]}
                     >
                         {Str.htmlDecode(props.fragment.text)}
                     </Text>
diff --git a/src/styles/styles.js b/src/styles/styles.js
index 951e3844c7ed..248e8272c832 100644
--- a/src/styles/styles.js
+++ b/src/styles/styles.js
@@ -1350,7 +1350,6 @@ const styles = {
         fontWeight: fontWeightBold,
         lineHeight: variables.lineHeightXLarge,
         ...wordBreak.breakWord,
-        ...whiteSpace.preWrap,
     },
 
     chatItemMessageHeaderTimestamp: {
@@ -2844,6 +2843,7 @@ const styles = {
         flexShrink: 0,
         maxWidth: variables.badgeMaxWidth,
         fontSize: variables.fontSizeSmall,
+        whiteSpace: 'pre',
         ...spacing.ph2,
     },
 
diff --git a/src/styles/utilities/whiteSpace/index.js b/src/styles/utilities/whiteSpace/index.js
index 7a7ac524d2cc..a7051cda6c21 100644
--- a/src/styles/utilities/whiteSpace/index.js
+++ b/src/styles/utilities/whiteSpace/index.js
@@ -5,4 +5,7 @@ export default {
     preWrap: {
         whiteSpace: 'pre-wrap',
     },
+    pre: {
+        whiteSpace: 'pre',
+    },
 };

From 3b8cd1411a86d2f373c1897c0e04fabdc39cf531 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Wed, 8 Mar 2023 15:48:42 +0700
Subject: [PATCH 06/13] fix: small issue

---
 src/styles/styles.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/styles/styles.js b/src/styles/styles.js
index 248e8272c832..735e294175a4 100644
--- a/src/styles/styles.js
+++ b/src/styles/styles.js
@@ -2843,7 +2843,7 @@ const styles = {
         flexShrink: 0,
         maxWidth: variables.badgeMaxWidth,
         fontSize: variables.fontSizeSmall,
-        whiteSpace: 'pre',
+        ...whiteSpace.pre,
         ...spacing.ph2,
     },
 

From df57c5422d82505e2ff92a2a6abad173f65093f6 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Wed, 8 Mar 2023 15:54:09 +0700
Subject: [PATCH 07/13] fix: add white space is pre to override

---
 src/pages/DetailsPage.js                    | 2 +-
 src/pages/ReportDetailsPage.js              | 2 +-
 src/pages/settings/InitialSettingsPage.js   | 2 +-
 src/pages/workspace/WorkspaceInitialPage.js | 1 +
 4 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/pages/DetailsPage.js b/src/pages/DetailsPage.js
index dcc6d74270b0..15e372c7201b 100755
--- a/src/pages/DetailsPage.js
+++ b/src/pages/DetailsPage.js
@@ -147,7 +147,7 @@ class DetailsPage extends React.PureComponent {
                                     )}
                                 </AttachmentModal>
                                 {details.displayName && (
-                                    <Text style={[styles.textHeadline, styles.mb6]} numberOfLines={1}>
+                                    <Text style={[styles.textHeadline, styles.mb6, styles.pre]} numberOfLines={1}>
                                         {isSMSLogin ? this.props.toLocalPhone(details.displayName) : details.displayName}
                                     </Text>
                                 )}
diff --git a/src/pages/ReportDetailsPage.js b/src/pages/ReportDetailsPage.js
index 3806e701ee73..f2d6d83b8946 100644
--- a/src/pages/ReportDetailsPage.js
+++ b/src/pages/ReportDetailsPage.js
@@ -133,7 +133,7 @@ class ReportDetailsPage extends Component {
                                             displayNamesWithTooltips={displayNamesWithTooltips}
                                             tooltipEnabled
                                             numberOfLines={1}
-                                            textStyles={[styles.textHeadline, styles.mb2, styles.textAlignCenter]}
+                                            textStyles={[styles.textHeadline, styles.mb2, styles.textAlignCenter, styles.pre]}
                                             shouldUseFullTitle={isChatRoom || isPolicyExpenseChat}
                                         />
                                     </View>
diff --git a/src/pages/settings/InitialSettingsPage.js b/src/pages/settings/InitialSettingsPage.js
index a5696d3e02e5..9ba796652bc2 100755
--- a/src/pages/settings/InitialSettingsPage.js
+++ b/src/pages/settings/InitialSettingsPage.js
@@ -273,7 +273,7 @@ class InitialSettingsPage extends React.Component {
                                     </Pressable>
 
                                     <Pressable style={[styles.mt1, styles.mw100]} onPress={this.openProfileSettings}>
-                                        <Text style={[styles.textHeadline]} numberOfLines={1}>
+                                        <Text style={[styles.textHeadline, styles.pre]} numberOfLines={1}>
                                             {this.props.currentUserPersonalDetails.displayName
                                                 ? this.props.currentUserPersonalDetails.displayName
                                                 : Str.removeSMSDomain(this.props.session.email)}
diff --git a/src/pages/workspace/WorkspaceInitialPage.js b/src/pages/workspace/WorkspaceInitialPage.js
index d2dacbe2f45c..8c39071ffb22 100644
--- a/src/pages/workspace/WorkspaceInitialPage.js
+++ b/src/pages/workspace/WorkspaceInitialPage.js
@@ -218,6 +218,7 @@ class WorkspaceInitialPage extends React.Component {
                                                             style={[
                                                                 styles.textHeadline,
                                                                 styles.alignSelfCenter,
+                                                                styles.pre,
                                                             ]}
                                                         >
                                                             {this.props.policy.name}

From afa126493d4055e21ebbad50f51254ab7d55a189 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Thu, 9 Mar 2023 10:29:55 +0700
Subject: [PATCH 08/13] fix: workspace name in the room

---
 src/components/LHNOptionsList/OptionRowLHN.js | 2 +-
 src/pages/home/HeaderView.js                  | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/components/LHNOptionsList/OptionRowLHN.js b/src/components/LHNOptionsList/OptionRowLHN.js
index 2f7737b6688b..d1d7830f312e 100644
--- a/src/components/LHNOptionsList/OptionRowLHN.js
+++ b/src/components/LHNOptionsList/OptionRowLHN.js
@@ -67,7 +67,7 @@ const OptionRowLHN = (props) => {
         : styles.sidebarLinkText;
     const textUnreadStyle = optionItem.isUnread
         ? [textStyle, styles.sidebarLinkTextBold] : [textStyle];
-    const displayNameStyle = StyleUtils.combineStyles([styles.optionDisplayName, styles.optionDisplayNameCompact, ...textUnreadStyle], props.style);
+    const displayNameStyle = StyleUtils.combineStyles([styles.optionDisplayName, styles.optionDisplayNameCompact, styles.pre, ...textUnreadStyle], props.style);
     const textPillStyle = props.isFocused
         ? [styles.ml1, StyleUtils.getBackgroundColorWithOpacityStyle(themeColors.icon, 0.5)]
         : [styles.ml1];
diff --git a/src/pages/home/HeaderView.js b/src/pages/home/HeaderView.js
index 66b534446742..899b85370928 100644
--- a/src/pages/home/HeaderView.js
+++ b/src/pages/home/HeaderView.js
@@ -123,7 +123,7 @@ const HeaderView = (props) => {
                                     displayNamesWithTooltips={displayNamesWithTooltips}
                                     tooltipEnabled
                                     numberOfLines={1}
-                                    textStyles={[styles.headerText]}
+                                    textStyles={[styles.headerText, styles.pre]}
                                     shouldUseFullTitle={isChatRoom || isPolicyExpenseChat}
                                 />
                                 {(isChatRoom || isPolicyExpenseChat) && (

From e9340ff4cc97935ea47928716f8e47d40d17688d Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Fri, 10 Mar 2023 12:37:18 +0700
Subject: [PATCH 09/13] fix: add blank line

---
 src/pages/workspace/WorkspaceNewRoomPage.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/pages/workspace/WorkspaceNewRoomPage.js b/src/pages/workspace/WorkspaceNewRoomPage.js
index 73162899d7ea..2117f26f4520 100644
--- a/src/pages/workspace/WorkspaceNewRoomPage.js
+++ b/src/pages/workspace/WorkspaceNewRoomPage.js
@@ -116,6 +116,7 @@ class WorkspaceNewRoomPage extends React.Component {
             _.filter(this.props.policies, policy => policy && policy.type === CONST.POLICY.TYPE.FREE),
             policy => ({label: policy.name.replace(/ /g, '\u00a0'), key: policy.id, value: policy.id}),
         );
+
         const visibilityOptions = _.map(_.filter(_.values(CONST.REPORT.VISIBILITY), visibilityOption => visibilityOption !== CONST.REPORT.VISIBILITY.PUBLIC_ANNOUNCE), visibilityOption => ({
             label: this.props.translate(`newRoomPage.visibilityOptions.${visibilityOption}`),
             value: visibilityOption,

From 7fe3725cbfb363956ffe4d1a0d8272d796a4682e Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Wed, 15 Mar 2023 09:33:00 +0700
Subject: [PATCH 10/13] fix: revert hacky fix

---
 src/pages/workspace/WorkspaceNewRoomPage.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/workspace/WorkspaceNewRoomPage.js b/src/pages/workspace/WorkspaceNewRoomPage.js
index 2117f26f4520..4db4670ac63e 100644
--- a/src/pages/workspace/WorkspaceNewRoomPage.js
+++ b/src/pages/workspace/WorkspaceNewRoomPage.js
@@ -114,7 +114,7 @@ class WorkspaceNewRoomPage extends React.Component {
         // Workspaces are policies with type === 'free'
         const workspaceOptions = _.map(
             _.filter(this.props.policies, policy => policy && policy.type === CONST.POLICY.TYPE.FREE),
-            policy => ({label: policy.name.replace(/ /g, '\u00a0'), key: policy.id, value: policy.id}),
+            policy => ({label: policy.name, key: policy.id, value: policy.id}),
         );
 
         const visibilityOptions = _.map(_.filter(_.values(CONST.REPORT.VISIBILITY), visibilityOption => visibilityOption !== CONST.REPORT.VISIBILITY.PUBLIC_ANNOUNCE), visibilityOption => ({

From 4536505927c03c650abaf33cc03fdcc703bf7a93 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Fri, 17 Mar 2023 09:12:45 +0700
Subject: [PATCH 11/13] fix: workspace name in the banner

---
 src/components/ArchivedReportFooter.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/components/ArchivedReportFooter.js b/src/components/ArchivedReportFooter.js
index 44dd223e8bbc..b46385fa7297 100644
--- a/src/components/ArchivedReportFooter.js
+++ b/src/components/ArchivedReportFooter.js
@@ -74,6 +74,7 @@ const ArchivedReportFooter = (props) => {
             })}
             shouldRenderHTML={archiveReason !== CONST.REPORT.ARCHIVE_REASON.DEFAULT}
             shouldShowIcon
+            textStyles={styles.pre}
         />
     );
 };

From 46245192880279ec22f58a2a9361b054dfe1daf2 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Mon, 20 Mar 2023 13:21:19 +0700
Subject: [PATCH 12/13] fix: workspace name in html

---
 src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js | 4 ++++
 src/components/OptionRow.js                                 | 4 ++--
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js b/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js
index 4f4f18d53da5..fbda8b4941dd 100755
--- a/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js
+++ b/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js
@@ -44,6 +44,10 @@ const customHTMLElementModels = {
         tagName: 'email-comment',
         mixedUAStyles: {whiteSpace: 'normal'},
     }),
+    strong: defaultHTMLElementModels.span.extend({
+        tagName: 'strong',
+        mixedUAStyles: {whiteSpace: 'pre'},
+    }),
 };
 
 const defaultViewProps = {style: [styles.alignItemsStart, styles.userSelectText]};
diff --git a/src/components/OptionRow.js b/src/components/OptionRow.js
index 532ae783bdd6..d64569840f8d 100644
--- a/src/components/OptionRow.js
+++ b/src/components/OptionRow.js
@@ -118,8 +118,8 @@ class OptionRow extends Component {
             : styles.sidebarLinkText;
         const textUnreadStyle = (this.props.boldStyle || this.props.option.boldStyle)
             ? [textStyle, styles.sidebarLinkTextBold] : [textStyle];
-        const displayNameStyle = StyleUtils.combineStyles(styles.optionDisplayName, textUnreadStyle, this.props.style);
-        const alternateTextStyle = StyleUtils.combineStyles(textStyle, styles.optionAlternateText, styles.textLabelSupporting, this.props.style);
+        const displayNameStyle = StyleUtils.combineStyles(styles.optionDisplayName, textUnreadStyle, this.props.style, styles.pre);
+        const alternateTextStyle = StyleUtils.combineStyles(textStyle, styles.optionAlternateText, styles.textLabelSupporting, this.props.style, styles.pre);
         const contentContainerStyles = [styles.flex1];
         const sidebarInnerRowStyle = StyleSheet.flatten([
             styles.chatLinkRowPressable,

From da2a31de533a2aa11dacd25fd0bba3a845b04f97 Mon Sep 17 00:00:00 2001
From: tienifr <christianwen18@gmail.com>
Date: Tue, 21 Mar 2023 01:33:02 +0700
Subject: [PATCH 13/13] fix: remove redundant

---
 src/components/ArchivedReportFooter.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/ArchivedReportFooter.js b/src/components/ArchivedReportFooter.js
index b46385fa7297..44dd223e8bbc 100644
--- a/src/components/ArchivedReportFooter.js
+++ b/src/components/ArchivedReportFooter.js
@@ -74,7 +74,6 @@ const ArchivedReportFooter = (props) => {
             })}
             shouldRenderHTML={archiveReason !== CONST.REPORT.ARCHIVE_REASON.DEFAULT}
             shouldShowIcon
-            textStyles={styles.pre}
         />
     );
 };
