Skip to content

Commit

Permalink
Edge cases
Browse files Browse the repository at this point in the history
  • Loading branch information
ibrkhalil committed Oct 18, 2023
1 parent fb87c5b commit d778eef
Show file tree
Hide file tree
Showing 3 changed files with 21 additions and 14 deletions.
18 changes: 12 additions & 6 deletions src/status_im2/contexts/chat/messages/list/view.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@
(= :message (:type first-not-visible)))
first-not-visible))))))


(defn list-on-end-reached
[scroll-y]
;; FIXME: that's a bit of a hack but we need to update `scroll-y` once the new messages
Expand Down Expand Up @@ -270,19 +269,19 @@
[message/message message-data context keyboard-shown?])]))

(defn scroll-handler
[event scroll-y *animate-topbar-name]
[event scroll-y animate-topbar-name?]
(let [content-size-y (- (oops/oget event "nativeEvent.contentSize.height")
(oops/oget event "nativeEvent.layoutMeasurement.height"))
current-y (oops/oget event "nativeEvent.contentOffset.y")]
(if
(< 145 (- content-size-y current-y))
(reset! *animate-topbar-name true)
(reset! *animate-topbar-name false))
(reset! animate-topbar-name? true)
(reset! animate-topbar-name? false))
(reanimated/set-shared-value scroll-y (- content-size-y current-y))))

(defn f-messages-list-content
[{:keys [chat insets scroll-y content-height cover-bg-color keyboard-shown? inner-state-atoms
*animate-topbar-name]}]
animate-topbar-name?]}]
(let [theme (quo.theme/use-theme-value)
{window-height :height} (rn/get-window)
{:keys [keyboard-height]} (hooks/use-keyboard)
Expand Down Expand Up @@ -320,6 +319,9 @@
:render-fn render-fn
:on-viewable-items-changed on-viewable-items-changed
:on-content-size-change (fn [_ y]
(when (and (< 145 (reanimated/get-shared-value scroll-y))
(not @animate-topbar-name?))
(reset! animate-topbar-name? true))
;; NOTE(alwx): here we set the initial value of `scroll-y`
;; which is needed because by default the chat is
;; scrolled to the bottom and no initial `on-scroll`
Expand Down Expand Up @@ -349,7 +351,7 @@
:on-momentum-scroll-end state/stop-scrolling
:scroll-event-throttle 16
:on-scroll (fn [event]
(scroll-handler event scroll-y *animate-topbar-name)
(scroll-handler event scroll-y animate-topbar-name?)
(on-scroll event show-floating-scroll-down-button?))
:style (add-inverted-y-android
{:background-color (if all-loaded?
Expand All @@ -370,6 +372,10 @@
:on-layout (fn [e]
(let [layout-height (oops/oget e
"nativeEvent.layout.height")]
(js/setTimeout
#(when (< 145 (reanimated/get-shared-value scroll-y))
(reset! animate-topbar-name? true))
500)
(reset! messages-view-height layout-height)))
:scroll-enabled (not recording?)
:content-inset-adjustment-behavior :never}]]))
Expand Down
6 changes: 3 additions & 3 deletions src/status_im2/contexts/chat/messages/navigation/view.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@

(defn f-view
[{:keys [theme scroll-y chat chat-screen-loaded? all-loaded? display-name online? photo-path
back-icon *animate-topbar-name]}]
back-icon animate-topbar-name?]}]
(let [{:keys [group-chat chat-id]} chat
opacity-animation (reanimated/interpolate scroll-y
[50
Expand All @@ -34,12 +34,12 @@
translate-animation (reanimated/use-shared-value 50)
title-opacity-animation (reanimated/use-shared-value 0)]
(rn/use-effect (fn []
(if @*animate-topbar-name
(if @animate-topbar-name?
(do (reanimated/animate title-opacity-animation 1)
(reanimated/animate translate-animation 0))
(do (reanimated/animate title-opacity-animation 0)
(reanimated/animate translate-animation 50))))
[@*animate-topbar-name])
[@animate-topbar-name?])
[rn/view {:style (style/navigation-view chat-screen-loaded?)}
[reanimated/view
{:style (style/animated-background-view all-loaded? opacity-animation nil)}]
Expand Down
11 changes: 6 additions & 5 deletions src/status_im2/contexts/chat/messages/view.cljs
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,11 @@
[utils.re-frame :as rf]))

(defn f-chat
[{:keys [extra-keyboard-height show-floating-scroll-down-button?] :as inner-state-atoms}]
[{:keys [extra-keyboard-height show-floating-scroll-down-button? animate-topbar-name?]
:as inner-state-atoms}]
(let [insets (safe-area/get-insets)
scroll-y (reanimated/use-shared-value 0)
content-height (reanimated/use-shared-value 0)
*animate-topbar-name (reagent/atom false)
{:keys [keyboard-height keyboard-shown]} (hooks/use-keyboard)
{:keys [chat-id
contact-request-state
Expand Down Expand Up @@ -72,11 +72,11 @@
:cover-bg-color :turquoise
:keyboard-shown? keyboard-shown
:inner-state-atoms inner-state-atoms
:*animate-topbar-name *animate-topbar-name}]
:animate-topbar-name? animate-topbar-name?}]

[messages.navigation/navigation-view
{:scroll-y scroll-y
:*animate-topbar-name *animate-topbar-name
:animate-topbar-name? animate-topbar-name?
:back-icon back-icon
:chat chat
:chat-screen-loaded? chat-screen-loaded?
Expand All @@ -98,5 +98,6 @@
{:extra-keyboard-height (reagent/atom 0)
:show-floating-scroll-down-button? (reagent/atom false)
:messages-view-height (reagent/atom 0)
:messages-view-header-height (reagent/atom 0)}]
:messages-view-header-height (reagent/atom 0)
:animate-topbar-name? (reagent/atom false)}]
[:f> f-chat inner-state-atoms]))

0 comments on commit d778eef

Please sign in to comment.