diff --git a/src/status_im/ui/screens/desktop/main/chat/styles.cljs b/src/status_im/ui/screens/desktop/main/chat/styles.cljs index 2f4ca138ce..db481f51b1 100644 --- a/src/status_im/ui/screens/desktop/main/chat/styles.cljs +++ b/src/status_im/ui/screens/desktop/main/chat/styles.cljs @@ -66,8 +66,7 @@ {:height 56 :justify-content :center}) -(def messages-scrollview-inner - {:padding-vertical 46}) +(def messages-list-vertical-padding 46) (def photo-style {:border-radius 20 diff --git a/src/status_im/ui/screens/desktop/main/chat/views.cljs b/src/status_im/ui/screens/desktop/main/chat/views.cljs index 0f23af3202..3ac7c9f21d 100644 --- a/src/status_im/ui/screens/desktop/main/chat/views.cljs +++ b/src/status_im/ui/screens/desktop/main/chat/views.cljs @@ -135,16 +135,19 @@ current-public-key (re-frame/subscribe [:get-current-public-key])] [react/view {:style styles/messages-view} [react/scroll-view {:scrollEventThrottle 16 + :headerHeight styles/messages-list-vertical-padding + :footerWidth styles/messages-list-vertical-padding + :enableArrayScrollingOptimization true :on-scroll (fn [e] (let [ne (.-nativeEvent e) y (.-y (.-contentOffset ne))] - (when (zero? y) + (when (<= y 0) (when @scroll-timer (js/clearTimeout @scroll-timer)) (reset! scroll-timer (js/setTimeout #(re-frame/dispatch [:load-more-messages]) 300))) (reset! scroll-height (+ y (.-height (.-layoutMeasurement ne)))))) :on-content-size-change #(.scrollToEnd @scroll-ref) :ref #(reset! scroll-ref %)} - [react/view {:style styles/messages-scrollview-inner} + [react/view (doall (for [[index {:keys [from content message-id type value] :as message-obj}] (map-indexed vector (reverse @messages))] ^{:key (or message-id (str type value))}