Edge case

src/status_im/chat/models/input.cljs

@@ -107,14 +107,15 @@
   [{:keys [db] :as cofx} message]
   (let [current-chat-id (:current-chat-id db)
         text            (get-in message [:content :text])]
-    {:db       (-> db
-                   (assoc-in [:chat/inputs current-chat-id :metadata :editing-message]
-                             message)
-                   (assoc-in [:chat/inputs current-chat-id :metadata :responding-to-message] nil)
-                   (update-in [:chat/inputs current-chat-id :metadata]
-                              dissoc
-                              :sending-image))
-     :dispatch [:mention/to-input-field text current-chat-id]}))
+    {:db         (-> db
+                     (assoc-in [:chat/inputs current-chat-id :metadata :editing-message]
+                               message)
+                     (assoc-in [:chat/inputs current-chat-id :metadata :responding-to-message] nil)
+                     (update-in [:chat/inputs current-chat-id :metadata]
+                                dissoc
+                                :sending-image))
+     :dispatch-n [[:chat.ui/set-chat-input-text nil current-chat-id]
+                  [:mention/to-input-field text current-chat-id]]}))
 
 (rf/defn show-contact-request-input
   "Sets reference to previous chat message and focuses on input"

src/status_im2/contexts/chat/composer/effects.cljs

@@ -106,34 +106,37 @@
 (defn use-edit
   [{:keys [input-ref]}
    {:keys [text-value saved-cursor-position]}
-   {:keys [edit]}]
+   {:keys [edit]}
+   messages-list-on-layout-finished?]
   (rn/use-effect
    (fn []
      (let [edit-text        (get-in edit [:content :text])
            text-value-count (count @text-value)]
-       (when (and edit @input-ref)
-         ;; A small setTimeout is necessary to ensure the statement is enqueued and will get executed
-         ;; ASAP.
-         ;; https://github.com/software-mansion/react-native-screens/issues/472
-         (js/setTimeout #(.focus ^js @input-ref) 250)
-         (.setNativeProps ^js @input-ref (clj->js {:text edit-text}))
-         (reset! text-value edit-text)
-         (reset! saved-cursor-position (if (zero? text-value-count)
+       (when @messages-list-on-layout-finished?
+         ;; A small setTimeout is necessary to ensure the statement is enqueued and will get
+         ;; executed
+         ;; ASAP. Https://github.com/software-mansion/react-native-screens/issues/472
+         (reset! saved-cursor-position (if edit-text
                                          (count edit-text)
-                                         text-value-count)))))
+                                         text-value-count))
+         (js/setTimeout #(.focus ^js @input-ref) 250))
+       (when (and edit @input-ref)
+         (.setNativeProps ^js @input-ref (clj->js {:text edit-text}))
+         (reset! text-value edit-text))))
    [(:message-id edit)]))
 
 (defn use-reply
   [{:keys [input-ref]}
    {:keys [container-opacity]}
-   {:keys [reply]}]
+   {:keys [reply]}
+   messages-list-on-layout-finished?]
   (rn/use-effect
    (fn []
      (when reply
        (reanimated/animate container-opacity 1))
-     (when (and reply @input-ref)
-       (js/setTimeout #(.focus ^js @input-ref) 250)))
-   [(:message-id reply)]))
+     (when (and reply @input-ref @messages-list-on-layout-finished?)
+       (js/setTimeout #(.focus ^js @input-ref) 250))))
+  [(:message-id reply)])
 
 (defn edit-mentions
   [{:keys [input-ref]} {:keys [text-value cursor-position]} {:keys [input-with-mentions]}]

src/status_im2/contexts/chat/composer/view.cljs

@@ -33,7 +33,8 @@
            blur-height
            opacity
            background-y
-           theme]} props state]
+           theme
+           messages-list-on-layout-finished?]} props state]
   (let [{:keys [chat-screen-loaded?]
          :as   subscriptions}    (utils/init-subs)
         content-height           (reagent/atom (or (:input-content-height ; Actual text height
@@ -73,8 +74,8 @@
                         animations
                         dimensions
                         subscriptions)
-    (effects/use-edit props state subscriptions)
-    (effects/use-reply props animations subscriptions)
+    (effects/use-edit props state subscriptions messages-list-on-layout-finished?)
+    (effects/use-reply props animations subscriptions messages-list-on-layout-finished?)
     (effects/update-input-mention props state subscriptions)
     (effects/edit-mentions props state subscriptions)
     (effects/link-previews props state animations subscriptions)
@@ -147,7 +148,8 @@
          subscriptions]]]]]))
 
 (defn composer
-  [{:keys [insets scroll-to-bottom-fn show-floating-scroll-down-button?]}]
+  [{:keys [insets scroll-to-bottom-fn show-floating-scroll-down-button?
+           messages-list-on-layout-finished?]}]
   (let [window-height (:height (rn/get-window))
         theme         (quo.theme/use-theme-value)
         opacity       (reanimated/use-shared-value 0)
@@ -161,7 +163,8 @@
                        :blur-height                       blur-height
                        :opacity                           opacity
                        :background-y                      background-y
-                       :theme                             theme}
+                       :theme                             theme
+                       :messages-list-on-layout-finished? messages-list-on-layout-finished?}
         props         (utils/init-non-reactive-state)
         state         (utils/init-reactive-state)]
     [rn/view (when platform/ios? {:style {:z-index 1}})

src/status_im2/contexts/chat/messages/list/view.cljs

@@ -298,7 +298,7 @@
 
 (defn f-messages-list-content
   [{:keys [chat insets scroll-y content-height cover-bg-color keyboard-shown? inner-state-atoms
-           big-name-visible? animate-topbar-opacity? composer-active?
+           big-name-visible? animate-topbar-opacity? composer-active? messages-list-on-layout-finished?
            on-end-reached? animate-topbar-name?]}]
   (rn/use-effect (fn []
                    (if (and (not @on-end-reached?)
@@ -412,6 +412,7 @@
        ;;TODO(rasom) https://github.com/facebook/react-native/issues/30034
        :inverted                          (when platform/ios? true)
        :on-layout                         (fn [e]
+                                            (reset! messages-list-on-layout-finished? true)
                                             (let [layout-height (oops/oget e
                                                                            "nativeEvent.layout.height")]
                                               (reset! messages-view-height layout-height)))

src/status_im2/contexts/chat/messages/view.cljs

@@ -15,7 +15,7 @@
 
 (defn f-chat
   [{:keys [show-floating-scroll-down-button? animate-topbar-name?
-           big-name-visible? animate-topbar-opacity? on-end-reached?]
+           big-name-visible? animate-topbar-opacity? on-end-reached? messages-list-on-layout-finished?]
     :as   inner-state-atoms}]
   (let [insets                   (safe-area/get-insets)
         scroll-y                 (reanimated/use-shared-value 0)
@@ -53,18 +53,19 @@
       :keyboard-vertical-offset (- (:bottom insets))}
 
      [list.view/message-list-content-view
-      {:chat                    chat
-       :insets                  insets
-       :scroll-y                scroll-y
-       :content-height          content-height
-       :cover-bg-color          :turquoise
-       :keyboard-shown?         keyboard-shown
-       :inner-state-atoms       inner-state-atoms
-       :animate-topbar-name?    animate-topbar-name?
-       :big-name-visible?       big-name-visible?
-       :animate-topbar-opacity? animate-topbar-opacity?
-       :composer-active?        focused?
-       :on-end-reached?         on-end-reached?}]
+      {:chat                              chat
+       :insets                            insets
+       :scroll-y                          scroll-y
+       :content-height                    content-height
+       :cover-bg-color                    :turquoise
+       :keyboard-shown?                   keyboard-shown
+       :inner-state-atoms                 inner-state-atoms
+       :animate-topbar-name?              animate-topbar-name?
+       :big-name-visible?                 big-name-visible?
+       :animate-topbar-opacity?           animate-topbar-opacity?
+       :composer-active?                  focused?
+       :on-end-reached?                   on-end-reached?
+       :messages-list-on-layout-finished? messages-list-on-layout-finished?}]
 
      [messages.navigation/navigation-view
       {:scroll-y                scroll-y
@@ -86,7 +87,8 @@
          [:f> composer.view/composer
           {:insets                            insets
            :scroll-to-bottom-fn               list.view/scroll-to-bottom
-           :show-floating-scroll-down-button? show-floating-scroll-down-button?}]
+           :show-floating-scroll-down-button? show-floating-scroll-down-button?
+           :messages-list-on-layout-finished? messages-list-on-layout-finished?}]
          [contact-requests.bottom-drawer/view chat-id contact-request-state group-chat]))]))
 
 (defn chat
@@ -99,5 +101,6 @@
          :animate-topbar-name?              (reagent/atom false)
          :big-name-visible?                 (reagent/atom :initial-render)
          :animate-topbar-opacity?           (reagent/atom false)
-         :on-end-reached?                   (reagent/atom false)}]
+         :on-end-reached?                   (reagent/atom false)
+         :messages-list-on-layout-finished? (reagent/atom false)}]
     [:f> f-chat inner-state-atoms]))