From b7e5efe0a3fd4ed899928573456f3d8b227d1dcf Mon Sep 17 00:00:00 2001
From: Fedor Indutny <79877362+indutny-signal@users.noreply.github.com>
Date: Tue, 27 Jul 2021 16:39:57 -0700
Subject: [PATCH] Fix rendering of links with emoji

---
 ts/components/conversation/Linkify.stories.tsx |  9 +++++++++
 ts/components/conversation/Linkify.tsx         | 17 +++++++++++------
 2 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/ts/components/conversation/Linkify.stories.tsx b/ts/components/conversation/Linkify.stories.tsx
index 63a1efcd37..a098cad76e 100644
--- a/ts/components/conversation/Linkify.stories.tsx
+++ b/ts/components/conversation/Linkify.stories.tsx
@@ -40,6 +40,15 @@ story.add('Links with Emoji without space', () => {
   return <Linkify {...props} />;
 });
 
+story.add('Links with Emoji and Text', () => {
+  const props = createProps({
+    text:
+      'https://example.com ⚠️ 0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ https://example.com',
+  });
+
+  return <Linkify {...props} />;
+});
+
 story.add('No Link', () => {
   const props = createProps({
     text: 'I am fond of cats',
diff --git a/ts/components/conversation/Linkify.tsx b/ts/components/conversation/Linkify.tsx
index 49a6d775b1..d57a8c8139 100644
--- a/ts/components/conversation/Linkify.tsx
+++ b/ts/components/conversation/Linkify.tsx
@@ -80,7 +80,6 @@ export class Linkify extends React.Component<Props> {
     });
 
     const results: Array<JSX.Element | string> = [];
-    let last = 0;
     let count = 1;
 
     chunkData.forEach(({ chunk, matchData }) => {
@@ -90,9 +89,10 @@ export class Linkify extends React.Component<Props> {
         return;
       }
 
+      let chunkLastIndex = 0;
       matchData.forEach(match => {
-        if (last < match.index) {
-          const textWithNoLink = chunk.slice(last, match.index);
+        if (chunkLastIndex < match.index) {
+          const textWithNoLink = chunk.slice(chunkLastIndex, match.index);
           count += 1;
           results.push(renderNonLink({ text: textWithNoLink, key: count }));
         }
@@ -109,12 +109,17 @@ export class Linkify extends React.Component<Props> {
           results.push(renderNonLink({ text: originalText, key: count }));
         }
 
-        last = match.lastIndex;
+        chunkLastIndex = match.lastIndex;
       });
 
-      if (last < chunk.length) {
+      if (chunkLastIndex < chunk.length) {
         count += 1;
-        results.push(renderNonLink({ text: chunk.slice(last), key: count }));
+        results.push(
+          renderNonLink({
+            text: chunk.slice(chunkLastIndex),
+            key: count,
+          })
+        );
       }
     });