From 9f1af8a9c261036cbe4ea4b8a8068314ac707d55 Mon Sep 17 00:00:00 2001 From: Ajay Sivan Date: Wed, 21 Dec 2022 14:44:38 +0530 Subject: [PATCH] fix: Chat scroll to bottom (#14570) --- .../contexts/chat/messages/list/view.cljs | 34 ++++++------------- .../contexts/chat/messages/view.cljs | 10 ++---- 2 files changed, 13 insertions(+), 31 deletions(-) diff --git a/src/status_im2/contexts/chat/messages/list/view.cljs b/src/status_im2/contexts/chat/messages/list/view.cljs index c134d4b428..6a531a71b9 100644 --- a/src/status_im2/contexts/chat/messages/list/view.cljs +++ b/src/status_im2/contexts/chat/messages/list/view.cljs @@ -1,8 +1,8 @@ (ns status-im2.contexts.chat.messages.list.view - (:require [oops.core :as oops] + (:require [i18n.i18n :as i18n] + [oops.core :as oops] [quo.react-native :as quo.react] [quo2.core :as quo] - [quo2.foundations.colors :as colors] [react-native.background-timer :as background-timer] [react-native.core :as rn] [react-native.platform :as platform] @@ -24,24 +24,6 @@ (some-> ^js @messages-list-ref (.scrollToOffset #js {:y 0 :animated true}))) -(defn floating-scroll-down-button - [show-input?] - [rn/touchable-without-feedback - {:on-press scroll-to-bottom} - [rn/view - {:style {:position :absolute - :bottom (if show-input? 126 12) - :right 12 - :height 24 - :width 24 - :align-items :center - :justify-content :center - :border-radius (/ 24 2) - :background-color (colors/theme-colors colors/neutral-80-opa-70 colors/white-opa-70)}} - [quo/icon :i/arrow-down - {:color (colors/theme-colors colors/white colors/neutral-100) - :size 12}]]]) - (defonce ^:const threshold-percentage-to-show-floating-scroll-down-button 75) (defonce show-floating-scroll-down-button (reagent/atom false)) @@ -171,7 +153,7 @@ mutual-contact-requests-enabled? one-to-one? (not contact-added?))] - [:<> + [rn/view {:style {:flex 1}} ;;DO NOT use anonymous functions for handlers [rn/flat-list (merge @@ -206,5 +188,11 @@ :inverted (when platform/ios? true) :style (when platform/android? {:scaleY -1}) :on-layout on-messages-view-layout})] - (when @show-floating-scroll-down-button - [floating-scroll-down-button show-input?])])) + [quo/floating-shell-button + (merge {:jump-to + {:on-press #(rf/dispatch [:shell/navigate-to-jump-to]) + :label (i18n/label :t/jump-to)}} + (when @show-floating-scroll-down-button + {:bottom {:on-press scroll-to-bottom}})) + {:position :absolute + :bottom 12}]])) diff --git a/src/status_im2/contexts/chat/messages/view.cljs b/src/status_im2/contexts/chat/messages/view.cljs index ec230e0932..9b36500240 100644 --- a/src/status_im2/contexts/chat/messages/view.cljs +++ b/src/status_im2/contexts/chat/messages/view.cljs @@ -1,6 +1,5 @@ (ns status-im2.contexts.chat.messages.view - (:require [i18n.i18n :as i18n] - [quo2.core :as quo] + (:require [quo2.core :as quo] [re-frame.db] [react-native.core :as rn] [reagent.core :as reagent] @@ -75,12 +74,7 @@ :bottom-space 15}] ;;INPUT COMPOSER (when show-input? - [composer/composer chat-id]) - [quo/floating-shell-button - {:jump-to {:on-press #(rf/dispatch [:shell/navigate-to-jump-to]) - :label (i18n/label :t/jump-to)}} - {:position :absolute - :bottom 117}]])) + [composer/composer chat-id])])) (defn chat []