[FIX #1393] Line breaks properly when contact is selected for send command (#2601)

src/status_im/chat/styles/input/input.cljs

@@ -11,8 +11,8 @@
 (def color-command "#70777d")
 (def color-send "rgb(98, 143, 227)")
 
-(def max-input-height 66)
 (def min-input-height 38)
+(def max-input-height (* 4 min-input-height))
 
 (defnstyle root [margin-bottom]
   {:flex-direction   :column
@@ -70,6 +70,18 @@
    :background-color :transparent
    :color            :transparent})
 
+(defnstyle invisible-input-text-height [container-width]
+  {:width            container-width
+   :flex             1
+   :font-size        14
+   :padding-top      5
+   :padding-bottom   5
+   :android          {:padding-top 3}
+   :position         :absolute
+   :left             0
+   :background-color :transparent
+   :color            :transparent})
+
 (defnstyle input-helper-text [left]
   {:color               color-input-helper-text
    :font-size           14

src/status_im/chat/views/input/input.cljs

@@ -105,6 +105,15 @@
                                (set-layout-width-fn w))}
      (or @input-text "")]))
 
+(defn- invisible-input-height [{:keys [set-layout-height-fn container-width]}]
+  (let [input-text    (subscribe [:chat :input-text])]
+    [react/text {:style     (style/invisible-input-text-height container-width)
+                 :on-layout #(let [h (-> (.-nativeEvent %)
+                                         (.-layout)
+                                         (.-height))]
+                               (set-layout-height-fn h))}
+     (or @input-text "")]))
+
 (defn- input-helper [_]
   (let [input-text (subscribe [:chat :input-text])]
     (fn [{:keys [command width]}]
@@ -174,6 +183,8 @@
                command @command]
            [react/animated-view {:style (style/input-root height anim-margin)}
             [invisible-input {:set-layout-width-fn set-layout-width-fn}]
+            [invisible-input-height {:set-layout-height-fn set-layout-height-fn
+                                     :container-width container-width}]
             [basic-text-input {:set-layout-height-fn   set-layout-height-fn
                                :set-container-width-fn set-container-width-fn
                                :height                 height