[#8548] No 'Paste' native Android option on longtap in the app input fields (conract-code, wallet recipient address etc)

Signed-off-by: Andrey Shovkoplyas <motor4ik@gmail.com>

src/status_im/ui/screens/add_new/new_chat/views.cljs

@@ -11,13 +11,17 @@
             [status-im.ui.components.toolbar.view :as toolbar.view]
             [status-im.ui.screens.add-new.styles :as add-new.styles]
             [status-im.ui.screens.add-new.new-chat.styles :as styles]
-            [status-im.utils.platform :as platform]))
+            [status-im.utils.platform :as platform]
+            [reagent.core :as reagent]))
 
 (defn- render-row [row _ _]
   [contact-view/contact-view {:contact       row
                               :on-press      #(re-frame/dispatch [:chat.ui/start-chat (:public-key %) {:navigation-reset? true}])
                               :show-forward? true}])
 
+;;TODO workaround for https://github.com/facebook/react-native/issues/23653 (https://github.com/status-im/status-react/issues/8548)
+(def tw (reagent/atom "95%"))
+
 (views/defview new-chat []
   (views/letsubs [contacts      [:contacts/active]
                   error-message [:new-identity-error]]
@@ -26,11 +30,12 @@
      [toolbar.view/simple-toolbar (i18n/label :t/new-chat)]
      [react/view add-new.styles/new-chat-container
       [react/view add-new.styles/new-chat-input-container
-       [react/text-input {:on-change-text      #(re-frame/dispatch [:new-chat/set-new-identity %])
+       [react/text-input {:ref                 (fn [v] (js/setTimeout #(reset! tw (if v "100%" "95%")) 100))
+                          :on-change-text      #(re-frame/dispatch [:new-chat/set-new-identity %])
                           :on-submit-editing   #(when-not error-message
                                                   (re-frame/dispatch [:contact.ui/contact-code-submitted]))
                           :placeholder         (i18n/label :t/enter-contact-code)
-                          :style               add-new.styles/input
+                          :style               (add-new.styles/input @tw)
                           :accessibility-label :enter-contact-code-input
                           :return-key-type     :go}]]
       (when-not platform/desktop?

src/status_im/ui/screens/add_new/styles.cljs

@@ -1,5 +1,5 @@
 (ns status-im.ui.screens.add-new.styles
-  (:require-macros [status-im.utils.styles :refer [defstyle]])
+  (:require-macros [status-im.utils.styles :refer [defstyle defnstyle]])
   (:require [status-im.ui.components.colors :as colors]
             [status-im.ui.components.styles :as styles]))
 
@@ -33,9 +33,9 @@
    :margin-left        3
    :margin-top         24})
 
-(defstyle input
+(defnstyle input [w]
-  {:flex               1
+  {:padding-horizontal 14
-   :padding-horizontal 14
+   :width              w
    :desktop            {:height 30
                         :width "100%"}
    :android            {:padding 0}})

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

@@ -28,7 +28,7 @@
      :on-change-text      #(re-frame/dispatch [:set :new-chat-name %])
      :default-value       new-group-name
      :placeholder         (i18n/label :t/set-a-topic)
-     :style               add-new.styles/input
+     :style               (add-new.styles/input "100%")
      :accessibility-label :chat-name-input}]])
 
 (defn- render-contact [contact]

src/status_im/ui/screens/wallet/components/styles.cljs

@@ -45,11 +45,12 @@
           :padding-top    0
           :height         52}))
 
-(def contact-code-text-input
+(defn contact-code-text-input [w]
   {:text-align-vertical :top
    :padding-top         16
    :padding-left        2
    :padding-right       8
+   :width               w
    :height              72})
 
 (def label

src/status_im/ui/screens/wallet/components/views.cljs

@@ -235,26 +235,29 @@
                        :key-fn    :address
                        :render-fn render-account}]]]))
 
-(defn contact-code []
+;;TODO workaround for https://github.com/facebook/react-native/issues/23653 (https://github.com/status-im/status-react/issues/8548)
-  (let [content (reagent/atom nil)]
+(def tw (reagent/atom "95%"))
-    (fn []
+
-      [simple-screen {:avoid-keyboard? true}
+(views/defview contact-code []
-       [toolbar {:style {:border-bottom-color colors/white-transparent-10}}
+  (views/letsubs [content (reagent/atom nil)]
-        default-action
+    [simple-screen {:avoid-keyboard? true}
-        (i18n/label :t/recipient)]
+     [toolbar {:style {:border-bottom-color colors/white-transparent-10}}
-       [react/view components.styles/flex
+      default-action
-        [cartouche {}
+      (i18n/label :t/recipient)]
-         (i18n/label :t/recipient)
+     [react/view components.styles/flex
-         [text-input {:multiline           true
+      [cartouche {}
-                      :style               styles/contact-code-text-input
+       (i18n/label :t/recipient)
-                      :placeholder         (i18n/label :t/recipient-code)
+       [text-input {:ref                 (fn [v] (js/setTimeout #(reset! tw (if v "100%" "95%")) 100))
-                      :on-change-text      #(reset! content %)
+                    :multiline           true
-                      :accessibility-label :recipient-address-input}]]
+                    :style               (styles/contact-code-text-input @tw)
-        [bottom-buttons/bottom-button
+                    :placeholder         (i18n/label :t/recipient-code)
-         [button/button {:disabled?    (string/blank? @content)
+                    :on-change-text      #(reset! content %)
-                         :on-press     #(re-frame/dispatch [:wallet.send/set-recipient @content])
+                    :accessibility-label :recipient-address-input}]]
-                         :fit-to-text? false}
+      [bottom-buttons/bottom-button
-          (i18n/label :t/done)]]]])))
+       [button/button {:disabled?    (string/blank? @content)
+                       :on-press     #(re-frame/dispatch [:wallet.send/set-recipient @content])
+                       :fit-to-text? false}
+        (i18n/label :t/done)]]]]))
 
 (defn recipient-qr-code []
   [choose-recipient/choose-recipient])