Disable scroll to the bottom button when composer is active.

status-im · Oct 9, 2023 · d4cc018 · d4cc018
1 parent 1770ff2
commit d4cc018
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 30 deletions.
diff --git a/src/status_im2/contexts/chat/composer/handlers.cljs b/src/status_im2/contexts/chat/composer/handlers.cljs
@@ -18,7 +18,8 @@
    {:keys [text-value focused? lock-selection? saved-cursor-position]}
    {:keys [height saved-height last-height opacity background-y container-opacity]
     :as   animations}
-   {:keys [max-height] :as dimensions}]
+   {:keys [max-height] :as dimensions}
+   show-floating-scroll-down-button?]
   (reset! focused? true)
   (rf/dispatch [:chat.ui/set-input-focused true])
   (reanimated/animate height (reanimated/get-shared-value last-height))
@@ -31,7 +32,8 @@
   (when (and (not-empty @text-value) @input-ref)
     (.setNativeProps ^js @input-ref
                      (clj->js {:selection {:start @saved-cursor-position :end @saved-cursor-position}})))
-  (kb/handle-refocus-emoji-kb-ios props animations dimensions))
+  (kb/handle-refocus-emoji-kb-ios props animations dimensions)
+  (reset! show-floating-scroll-down-button? false))
 
 (defn blur
   [{:keys [text-value focused? lock-selection? cursor-position saved-cursor-position gradient-z-index

diff --git a/src/status_im2/contexts/chat/composer/sub_view.cljs b/src/status_im2/contexts/chat/composer/sub_view.cljs
@@ -47,7 +47,8 @@
          :label               (i18n/label :t/jump-to)
          :style               {:align-self :center}}}
        {}]]
-     (when @show-floating-scroll-down-button?
+     (when (and (not @focused?)
+                @show-floating-scroll-down-button?)
        [quo/floating-shell-button
         {:scroll-to-bottom {:on-press scroll-to-bottom-fn}}
         style/scroll-to-bottom-button])]))

diff --git a/src/status_im2/contexts/chat/composer/view.cljs b/src/status_im2/contexts/chat/composer/view.cljs
@@ -105,34 +105,35 @@
            :menu-items @(:menu-items state)
            :style      (style/input-view state)}
           [rn/text-input
-           {:ref                      #(reset! (:input-ref props) %)
-            :default-value            @(:text-value state)
-            :on-focus                 #(handler/focus props state animations dimensions)
-            :on-blur                  #(handler/blur state animations dimensions subscriptions)
-            :on-content-size-change   #(handler/content-size-change %
-                                                                    state
-                                                                    animations
-                                                                    subscriptions
-                                                                    dimensions
-                                                                    (or keyboard-shown
-                                                                        (:edit subscriptions)))
-            :on-scroll                #(handler/scroll % props state animations dimensions)
-            :on-change-text           #(handler/change-text % props state)
-            :on-selection-change      #(handler/selection-change % props state)
-            :on-selection             #(selection/on-selection % props state)
-            :keyboard-appearance      (quo.theme/theme-value :light :dark)
-            :max-height               max-height
+           {:ref #(reset! (:input-ref props) %)
+            :default-value @(:text-value state)
+            :on-focus
+            #(handler/focus props state animations dimensions show-floating-scroll-down-button?)
+            :on-blur #(handler/blur state animations dimensions subscriptions)
+            :on-content-size-change #(handler/content-size-change %
+                                                                  state
+                                                                  animations
+                                                                  subscriptions
+                                                                  dimensions
+                                                                  (or keyboard-shown
+                                                                      (:edit subscriptions)))
+            :on-scroll #(handler/scroll % props state animations dimensions)
+            :on-change-text #(handler/change-text % props state)
+            :on-selection-change #(handler/selection-change % props state)
+            :on-selection #(selection/on-selection % props state)
+            :keyboard-appearance (quo.theme/theme-value :light :dark)
+            :max-height max-height
             :max-font-size-multiplier 1
-            :multiline                true
-            :placeholder              (i18n/label :t/type-something)
-            :placeholder-text-color   (colors/theme-colors colors/neutral-30 colors/neutral-50)
-            :style                    (style/input-text props
-                                                        state
-                                                        subscriptions
-                                                        {:max-height max-height
-                                                         :theme      theme})
-            :max-length               constants/max-text-size
-            :accessibility-label      :chat-message-input}]]
+            :multiline true
+            :placeholder (i18n/label :t/type-something)
+            :placeholder-text-color (colors/theme-colors colors/neutral-30 colors/neutral-50)
+            :style (style/input-text props
+                                     state
+                                     subscriptions
+                                     {:max-height max-height
+                                      :theme      theme})
+            :max-length constants/max-text-size
+            :accessibility-label :chat-message-input}]]
          (when chat-screen-loaded?
            [:<>
             [gradients/view props state animations show-bottom-gradient?]