From d4a8f7053ae982ee529406399e8c7f7fc3b16836 Mon Sep 17 00:00:00 2001
From: JD Francis <jd@audius.co>
Date: Thu, 7 Nov 2024 13:36:47 -0600
Subject: [PATCH] Make web & mobile comments use the same squashNewlines method
 & tweak it to allow 10 lines

---
 packages/common/src/utils/formatUtil.ts          | 16 +++++++++++++---
 .../src/components/core/UserGeneratedText.tsx    | 14 ++++++++------
 .../user-generated-text/UserGeneratedTextV2.tsx  |  6 ++++--
 3 files changed, 25 insertions(+), 11 deletions(-)

diff --git a/packages/common/src/utils/formatUtil.ts b/packages/common/src/utils/formatUtil.ts
index 0072abfdcf6..1c61e256ace 100644
--- a/packages/common/src/utils/formatUtil.ts
+++ b/packages/common/src/utils/formatUtil.ts
@@ -111,11 +111,21 @@ export const formatShareText = (title: string, creator: string) => {
 }
 
 /**
- * Reduces multiple sequential newlines (> 3) into max `\n\n` and
+ * Reduces multiple sequential newlines (> newlineCount) into max `\n\n` and
  * trims both leading and trailing newlines
  */
-export const squashNewLines = (str: string | null) => {
-  return str ? str.replace(/\n\s*\n\s*\n/g, '\n\n').trim() : str
+export const squashNewLines = (str: string | null, newlineMax: number = 2) => {
+  return str
+    ? str
+        .replace(
+          new RegExp(
+            `\\n\\s*(\\n\\s*){${Math.max(newlineMax - 2, 1)}}\\n`,
+            'g'
+          ),
+          '\n'.repeat(newlineMax)
+        )
+        .trim()
+    : str
 }
 
 /** Trims a string to alphanumeric values only */
diff --git a/packages/mobile/src/components/core/UserGeneratedText.tsx b/packages/mobile/src/components/core/UserGeneratedText.tsx
index 95ed8dcefed..3559aaf5f1f 100644
--- a/packages/mobile/src/components/core/UserGeneratedText.tsx
+++ b/packages/mobile/src/components/core/UserGeneratedText.tsx
@@ -306,11 +306,13 @@ export const UserGeneratedText = (props: UserGeneratedTextProps) => {
   }, [])
 
   const renderText = useCallback(
-    (text: string) => (
-      <Text suppressHighlighting {...other}>
-        {text}
-      </Text>
-    ),
+    (text: string) => {
+      return (
+        <Text suppressHighlighting {...other}>
+          {text}
+        </Text>
+      )
+    },
     // eslint-disable-next-line react-hooks/exhaustive-deps
     []
   )
@@ -330,7 +332,7 @@ export const UserGeneratedText = (props: UserGeneratedTextProps) => {
             email
             url={false}
             style={[{ marginBottom: 3 }, style]}
-            text={squashNewLines(children) as string}
+            text={squashNewLines(children, 10) as string}
             matchers={[
               // Handle matcher e.g. @handle
               ...(mentions
diff --git a/packages/web/src/components/user-generated-text/UserGeneratedTextV2.tsx b/packages/web/src/components/user-generated-text/UserGeneratedTextV2.tsx
index 85f5891ea9e..f36c9731a5d 100644
--- a/packages/web/src/components/user-generated-text/UserGeneratedTextV2.tsx
+++ b/packages/web/src/components/user-generated-text/UserGeneratedTextV2.tsx
@@ -17,7 +17,8 @@ import {
   formatCollectionName,
   formatUserName,
   handleRegex,
-  decodeHashId
+  decodeHashId,
+  squashNewLines
 } from '@audius/common/utils'
 import { Text, TextProps } from '@audius/harmony'
 import { CommentMention, ResolveApi, Track, User, Playlist } from '@audius/sdk'
@@ -299,6 +300,7 @@ export const UserGeneratedTextV2 = forwardRef(function (
   )
 
   const matchers: Matcher[] = [
+    // link matcher
     {
       pattern:
         /https?:\/\/([\w_-]+(?:(?:\.[\w_-]+)+))([\w.,@?^=%&:/~+#-]*[\w@?^=%&/~+#-])/g,
@@ -324,7 +326,7 @@ export const UserGeneratedTextV2 = forwardRef(function (
   // Function to split the text and insert rendered elements for matched tokens
   const parseText = (text: string) => {
     // Start with the entire text as a single unprocessed string
-    let elements: ReactNode[] = [text]
+    let elements: ReactNode[] = [squashNewLines(text, 10)]
     let key = 0
 
     // Process each matcher sequentially