botonic-react: messenger markdown not applied #BLT-1152

packages/botonic-react/src/components/multichannel/multichannel-text.jsx

@@ -287,12 +287,15 @@ export const MultichannelText = props => {
     return (
       <>
         {texts &&
-          texts.map((e, i) => (
+          texts.map((message, i) => (
             <Text key={i} {...propsWithoutChildren}>
-              {e}
+              {whatsappMarkdown(text)}
             </Text>
           ))}
-        <Text {...propsLastText}>{propsLastText.children}</Text>
+        <Text {...propsLastText}>
+          {/* TODO: Review how render buttons and replies in Facebook with markdown */}
+          {whatsappMarkdown(propsLastText.children)}
+        </Text>
       </>
     )
   }

packages/botonic-react/src/components/multichannel/whatsapp/markdown.ts

@@ -15,6 +15,11 @@ const MARKDOWN_BOLD_AND_ITALIC_OPTION2 = /(\*__)(.*?)(__\*)/g
 const MARKDOWN_BOLD_AND_ITALIC_OPTION3 = /(__\*)(.*?)(\*__)/g
 
 export function whatsappMarkdown(text: string) {
+  const textWithItalicAndBold = replaceItalicAndBold(text)
+  return replaceMarkdownLinks(textWithItalicAndBold)
+}
+
+export function replaceItalicAndBold(text: string) {
   const textNormalized = normalizeMarkdown(text)
   const matches = textNormalized.match(MARKDOWN_BOLD_OR_ITALIC_REGEX)
   if (matches) {
@@ -26,22 +31,26 @@ export function whatsappMarkdown(text: string) {
           MARKDOWN_WHATSAPP_BOLD
         )
       }
+
       if (match.startsWith(MARKDOWN_BOLD_OPTION_2)) {
         return replaceAllOccurrences(
           match,
           MARKDOWN_BOLD_OPTION_2,
           MARKDOWN_WHATSAPP_BOLD
         )
       }
+
       if (match.startsWith(MARKDOWN_ITALIC_OPTION_1)) {
         return replaceAllOccurrences(
           match,
           MARKDOWN_ITALIC_OPTION_1,
           MARKDOWN_WHATSAPP_ITALIC
         )
       }
+
       return match
     })
+
     let textWhatsapp = textNormalized
     for (let i = 0; i < matches.length; i++) {
       textWhatsapp = replaceAllOccurrences(
@@ -50,8 +59,10 @@ export function whatsappMarkdown(text: string) {
         matchesResult[i]
       )
     }
+
     return textWhatsapp
   }
+
   return text
 }
 
@@ -86,3 +97,9 @@ function replaceAllOccurrences(
 ) {
   return text.split(searchValue).join(replaceValue)
 }
+
+const REGEX_MARKDOWN_LINK = /\[([^\]]+)\]\(([^)]+)\)/g
+
+function replaceMarkdownLinks(markdown: string) {
+  return markdown.replace(REGEX_MARKDOWN_LINK, '$1: $2')
+}