[android, ios] render markdown-ish formatting in chat messages natively.

use patched RN to make sure that heavily-formatted messages don't slow
our chats down.

Signed-off-by: Igor Mandrigin <i@mandrigin.ru>

components/src/status_im/ui/components/react.cljs

@@ -116,6 +116,7 @@
 (defn prepare-nested-text-props [props]
   (-> props
       (update :style typography/get-nested-style)
+      (assoc :parseBasicMarkdown true)
       (assoc :nested? true)))
 
 ;; Accessor methods for React Components

ios/Podfile.lock

@@ -54,8 +54,8 @@ PODS:
   - nanopb/decode (0.3.8)
   - nanopb/encode (0.3.8)
   - Protobuf (3.6.1)
-  - React (0.59.3):
+  - React (0.59.9):
-    - React/Core (= 0.59.3)
+    - React/Core (= 0.59.9)
   - react-native-background-timer (2.1.0-alpha.6):
     - React
   - react-native-camera (1.1.5):
@@ -68,8 +68,8 @@ PODS:
     - React
   - react-native-webview (5.2.1):
     - React
-  - React/Core (0.59.3):
+  - React/Core (0.59.9):
-    - yoga (= 0.59.3.React)
+    - yoga (= 0.59.9.React)
   - RNKeychain (3.0.0-rc.3):
     - React
   - SQLCipher (3.4.2):
@@ -80,7 +80,7 @@ PODS:
   - SSZipArchive (2.1.4)
   - TouchID (4.4.1):
     - React
-  - yoga (0.59.3.React)
+  - yoga (0.59.9.React)
 
 DEPENDENCIES:
   - Firebase/Core

mobile_files/package.json.orig

@@ -33,7 +33,7 @@
     "querystring-es3": "0.2.1",
     "react": "16.8.3",
     "react-dom": "16.4.2",
-    "react-native": "git+https://github.com/status-im/react-native.git#status-v0.59.3",
+    "react-native": "git+https://github.com/status-im/react-native.git#status-0.59.9",
     "react-native-background-timer": "2.1.0-alpha.6",
     "react-native-camera": "git+https://github.com/status-im/react-native-camera.git#v1.1.5-1-status",
     "react-native-config": "git+https://github.com/status-im/react-native-config.git#0.11.2-1",

src/status_im/chat/models/message_content.cljs

@@ -1,5 +1,6 @@
 (ns status-im.chat.models.message-content
   (:require [clojure.string :as string]
+            [status-im.utils.platform :as platform]
             [status-im.constants :as constants]))
 
 (def stylings [[:bold   constants/regx-bold]
@@ -92,7 +93,9 @@
                                  [(clear-ranges matches text) (assoc metadata type matches)]
                                  [text metadata]))
                              [text {}]
-                             (into stylings actions))]
+                             (if platform/desktop?
+                               (into stylings actions)
+                               actions))]
     (cond-> content
       (seq metadata) (as-> content
                            (assoc content :metadata metadata)

src/status_im/ui/screens/chat/message/message.cljs

@@ -92,7 +92,11 @@
         [quoted-message (:response-to content) outgoing current-public-key])
       (apply react/nested-text
              (cond-> {:style (style/text-message collapsible? outgoing)
-                      :text-break-strategy :balanced}
+                      :text-break-strategy :balanced
+                      :parseBasicMarkdown true
+                      :markdownCodeBackgroundColor colors/black
+                      :markdownCodeForegroundColor colors/green}
+
                (and collapsible? (not expanded?))
                (assoc :number-of-lines constants/lines-collapse-threshold))
              (conj (if-let [render-recipe (:render-recipe content)]

src/status_im/ui/screens/chat/views.cljs

@@ -366,7 +366,6 @@
                                           :row                message
                                           :idx                idx
                                           :list-ref           messages-list-ref}])
-           :initialNumToRender        6
            :inverted                  true
            :onEndReached              #(re-frame/dispatch [:chat.ui/load-more-messages])
            :keyboardShouldPersistTaps :handled}

test/cljs/status_im/test/chat/models/message_content.cljs

@@ -1,15 +1,18 @@
 (ns status-im.test.chat.models.message-content
   (:require [cljs.test :refer-macros [deftest is testing]]
+            [status-im.utils.platform :as platform]
             [status-im.chat.models.message-content :as message-content]))
 
 (deftest enrich-string-content-test
-  (testing "Text content of the message is enriched correctly"
+  (if platform/desktop?
-    (is (not (:metadata (message-content/enrich-content {:text "Plain message"}))))
+    (testing "Text content of the message is enriched correctly"
-    (is (= {:bold [[5 14]]}
+      (is (not (:metadata (message-content/enrich-content {:text "Plain message"}))))
-           (:metadata (message-content/enrich-content {:text "Some *styling* present"}))))
+      (is (= {:bold [[5 14]]}
-    (is (= {:bold [[5 14]]
+             (:metadata (message-content/enrich-content {:text "Some *styling* present"}))))
-            :tag  [[28 33] [38 43]]}
+      (is (= {:bold [[5 14]]
-           (:metadata (message-content/enrich-content {:text "Some *styling* present with #tag1 and #tag2 as well"})))))
+              :tag  [[28 33] [38 43]]}
+             (:metadata (message-content/enrich-content {:text "Some *styling* present with #tag1 and #tag2 as well"}))))))
+
   (testing "right to left is correctly identified"
     (is (not (:rtl? (message-content/enrich-content {:text "You are lucky today!"}))))
     (is (not (:rtl? (message-content/enrich-content {:text "42"}))))
@@ -23,10 +26,20 @@
 (deftest build-render-recipe-test
   (testing "Render tree is build from text"
     (is (not (:render-recipe (message-content/enrich-content {:text "Plain message"}))))
-    (is (= '(["Test " :text]
+    (is (= (if platform/desktop?
-             ["#status" :tag]
+             '(["Test " :text]
-             [" one three " :text]
+               ["#status" :tag]
-             ["#core-chat (@developer)!" :bold]
+               [" one three " :text]
-             [" By the way, " :text]
+               ["#core-chat (@developer)!" :bold]
-             ["nice link(https://link.com)" :italic])
+               [" By the way, " :text]
+               ["nice link(https://link.com)" :italic])
+             '(["Test " :text]
+               ["#status" :tag]
+               [" one three *" :text]
+               ["#core-chat" :tag]
+               [" (" :text]
+               ["@developer" :mention]
+               [")!* By the way, ~nice link(" :text]
+               ["https://link.com" :link]
+               [")~" :text]))
            (:render-recipe (message-content/enrich-content {:text "Test #status one three *#core-chat (@developer)!* By the way, ~nice link(https://link.com)~"}))))))