Merge pull request Expensify#27216 from bernhardoj/fix/27125-force-ltr

Force markdown text to LTR
abdel-h66 · Sep 19, 2023 · b10e0bc · b10e0bc
2 parents c646000 + d0d133a
commit b10e0bc
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 3 deletions.
diff --git a/src/CONST.ts b/src/CONST.ts
@@ -792,6 +792,10 @@ const CONST = {
 
     INVISIBLE_CODEPOINTS: ['fe0f', '200d', '2066'],
 
+    UNICODE: {
+        LTR: '\u2066',
+    },
+
     TOOLTIP_MAX_LINES: 3,
 
     LOGIN_TYPE: {

diff --git a/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js b/src/components/HTMLEngineProvider/BaseHTMLEngineProvider.js
@@ -6,6 +6,7 @@ import htmlRenderers from './HTMLRenderers';
 import * as HTMLEngineUtils from './htmlEngineUtils';
 import styles from '../../styles/styles';
 import fontFamily from '../../styles/fontFamily';
+import convertToLTR from '../../libs/convertToLTR';
 
 const propTypes = {
     /** Whether text elements should be selectable */
@@ -71,6 +72,10 @@ function BaseHTMLEngineProvider(props) {
             enableCSSInlineProcessing={false}
             systemFonts={_.values(fontFamily)}
             fallbackFonts={fallbackFonts}
+            domVisitors={{
+                // eslint-disable-next-line no-param-reassign
+                onText: (text) => (text.data = convertToLTR(text.data)),
+            }}
         >
             <RenderHTMLConfigProvider
                 defaultTextProps={defaultTextProps}

diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/MentionUserRenderer.js
@@ -11,6 +11,7 @@ import personalDetailsPropType from '../../../pages/personalDetailsPropType';
 import * as StyleUtils from '../../../styles/StyleUtils';
 import * as PersonalDetailsUtils from '../../../libs/PersonalDetailsUtils';
 import TextLink from '../../TextLink';
+import CONST from '../../../CONST';
 
 const propTypes = {
     ...htmlRendererPropTypes,
@@ -31,8 +32,8 @@ const showUserDetails = (email) => Navigation.navigate(ROUTES.getDetailsRoute(em
 function MentionUserRenderer(props) {
     const defaultRendererProps = _.omit(props, ['TDefaultRenderer', 'style']);
 
-    // We need to remove the leading @ from data as it is not part of the login
-    const loginWithoutLeadingAt = props.tnode.data ? props.tnode.data.slice(1) : '';
+    // We need to remove the LTR unicode and leading @ from data as it is not part of the login
+    const loginWithoutLeadingAt = props.tnode.data ? props.tnode.data.replace(CONST.UNICODE.LTR, '').slice(1) : '';
 
     const accountID = _.first(PersonalDetailsUtils.getAccountIDsByLogins([loginWithoutLeadingAt]));
 

diff --git a/src/libs/convertToLTR/index.android.ts b/src/libs/convertToLTR/index.android.ts
@@ -1,9 +1,10 @@
+import CONST from '../../CONST';
 import ConvertToLTR from './types';
 
 /**
  * Android only - convert RTL text to a LTR text using Unicode controls.
  * https://www.w3.org/International/questions/qa-bidi-unicode-controls
  */
-const convertToLTR: ConvertToLTR = (text) => `\u2066${text}`;
+const convertToLTR: ConvertToLTR = (text) => `${CONST.UNICODE.LTR}${text}`;
 
 export default convertToLTR;
diff --git a/src/styles/styles.js b/src/styles/styles.js
@@ -156,6 +156,7 @@ const webViewStyles = (theme) => ({
         fontFamily: fontFamily.EXP_NEUE,
         flex: 1,
         lineHeight: variables.fontSizeNormalHeight,
+        ...writingDirection.ltr,
     },
 });