Prevent italic or strikethrough emojis on Android

android/src/main/java/com/expensify/livemarkdown/MarkdownRange.java

@@ -0,0 +1,38 @@
+package com.expensify.livemarkdown;
+
+import org.json.JSONException;
+import org.json.JSONObject;
+
+public class MarkdownRange {
+  public final String type;
+  public final int start;
+  public final int end;
+  public final int length;
+  public final int depth;
+  public int index;
+
+  public MarkdownRange(String type, int start, int length, int depth, int index) {
+    this.type = type;
+    this.start = start;
+    this.length = length;
+    this.end = start + length;
+    this.depth = depth;
+    this.index = index;
+  }
+
+  public MarkdownRange(JSONObject range, int index) {
+    try {
+      this.type = range.getString("type");
+      this.start = range.getInt("start");
+      this.length = range.getInt("length");
+      this.end = start + length;
+      this.depth = range.optInt("depth", 1);
+      this.index = index;
+
+    } catch (JSONException e) {
+      throw new RuntimeException(e);
+
+    }
+  }
+}
+

android/src/main/java/com/expensify/livemarkdown/MarkdownUtils.java

@@ -16,6 +16,8 @@
 
 import java.io.IOException;
 import java.io.InputStream;
+import java.util.ArrayList;
+import java.util.List;
 import java.util.Objects;
 
 public class MarkdownUtils {
@@ -66,6 +68,83 @@ public void setMarkdownStyle(@NonNull MarkdownStyle markdownStyle) {
     mMarkdownStyle = markdownStyle;
   }
 
+  private void splitRangesOnEmojis(List<MarkdownRange> markdownRanges, String type) {
+    List<MarkdownRange> emojiRanges = new ArrayList<>();
+    List<MarkdownRange> styleRanges = new ArrayList<>();
+    int index = 0;
+    for (MarkdownRange range : markdownRanges) {
+      if (range.type.equals("emoji")) {
+        emojiRanges.add(range);
+      } else if (range.type.equals(type)) {
+        styleRanges.add(range);
+      }
+      range.index = index;
+      index += 1;
+    }
+
+    int i = 0;
+    int j = 0;
+    while (i < emojiRanges.size() && j < styleRanges.size()) {
+      MarkdownRange emojiRange = emojiRanges.get(i);
+      MarkdownRange styleRange = styleRanges.get(j);
+
+      if (styleRange.end < emojiRange.start) {
+        // Next style range
+        j += 1;
+        continue;
+      } else if (emojiRange.start >= styleRange.start && emojiRange.end <= styleRange.end) {
+        // Split range
+        MarkdownRange startRange = new MarkdownRange(styleRange.type, styleRange.start, emojiRange.start - styleRange.start, styleRange.depth, styleRange.index);
+        MarkdownRange endRange = new MarkdownRange(styleRange.type, emojiRange.end, styleRange.end - emojiRange.end, styleRange.depth, styleRange.index);
+        styleRanges.add(j + 1, endRange);
+        styleRanges.add(j + 1, startRange);
+        styleRanges.remove(j);
+        j += 1;
+      }
+      i += 1;
+    }
+
+
+    // Replace style ranges with splitted ones
+    index = -1;
+    int addedElements = 0;
+    for (MarkdownRange range : styleRanges) {
+      if (index != range.index) {
+        markdownRanges.remove(range.index + addedElements);
+        index = range.index;
+        addedElements -= 1;
+      }
+
+      if (range.length > 0) {
+        addedElements += 1;
+        markdownRanges.add(index + addedElements, range);
+      }
+    }
+  }
+
+
+  private List<MarkdownRange> parseRanges(String rangesJSON, String innerText) {
+    List<MarkdownRange> markdownRanges = new ArrayList<>();
+    try {
+      JSONArray ranges = new JSONArray(rangesJSON);
+      for (int i = 0; i < ranges.length(); i++) {
+        JSONObject range = ranges.getJSONObject(i);
+        MarkdownRange markdownRange = new MarkdownRange(range, i);
+        if (markdownRange.length == 0 || markdownRange.end > innerText.length()) {
+          continue;
+        }
+        markdownRanges.add(markdownRange);
+      }
+    } catch (JSONException e) {
+      return new ArrayList<>();
+    }
+    splitRangesOnEmojis(markdownRanges, "italic");
+    splitRangesOnEmojis(markdownRanges, "strikethrough");
+    return markdownRanges;
+  }
+
+
+
   public void applyMarkdownFormatting(SpannableStringBuilder ssb) {
     Objects.requireNonNull(mMarkdownStyle, "mMarkdownStyle is null");
 
@@ -81,22 +160,9 @@ public void applyMarkdownFormatting(SpannableStringBuilder ssb) {
       mPrevOutput = output;
     }
 
-    try {
-      JSONArray ranges = new JSONArray(output);
-      for (int i = 0; i < ranges.length(); i++) {
-        JSONObject range = ranges.getJSONObject(i);
-        String type = range.getString("type");
-        int start = range.getInt("start");
-        int length = range.getInt("length");
-        int depth = range.optInt("depth", 1);
-        int end = start + length;
-        if (length == 0 || end > input.length()) {
-          continue;
-        }
-        applyRange(ssb, type, start, end, depth);
-      }
-    } catch (JSONException e) {
-      // Do nothing
+    List<MarkdownRange> ranges = parseRanges(output, input);
+    for (MarkdownRange range : ranges) {
+      applyRange(ssb, range.type, range.start, range.end, range.depth);
     }
   }
 

parser/index.ts

@@ -239,6 +239,8 @@ function getTagPriority(tag: string) {
       return 2;
     case 'h1':
       return 1;
+    case 'emoji':
+      return -1;
     default:
       return 0;
   }

src/web/utils/blockUtils.ts

@@ -26,7 +26,13 @@ function addStyleToBlock(targetElement: HTMLElement, type: NodeType, markdownSty
       node.style.textDecoration = 'line-through';
       break;
     case 'emoji':
-      Object.assign(node.style, {...markdownStyle.emoji, verticalAlign: 'middle'});
+      Object.assign(node.style, {
+        ...markdownStyle.emoji,
+        verticalAlign: 'middle',
+        fontStyle: 'normal',
+        textDecoration: 'none',
+        display: 'inline-block',
+      });
       break;
     case 'mention-here':
       Object.assign(node.style, markdownStyle.mentionHere);
@@ -49,7 +55,6 @@ function addStyleToBlock(targetElement: HTMLElement, type: NodeType, markdownSty
     case 'pre':
       Object.assign(node.style, markdownStyle.pre);
       break;
-
     case 'blockquote':
       Object.assign(node.style, {
         ...markdownStyle.blockquote,