status-im
/
status-mobile
mirror of https://github.com/status-im/status-mobile.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

fix Chat input overlaps the last message on IPhone 14 (#17113)

This commit is contained in:
Parvesh Monu 2023-08-30 14:35:14 +05:30 committed by GitHub
parent 551ac22085
commit 5dc874a4cd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 74 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/status_im2/contexts/chat/messages/list/style.cljs
View File

@ -6,7 +6,6 @@
(defonce ^:const cover-height 168) (defonce ^:const cover-height 168)
(defonce ^:const overscroll-cover-height 2000) (defonce ^:const overscroll-cover-height 2000)
(defonce ^:const header-avatar-top-offset -36) (defonce ^:const header-avatar-top-offset -36)
(defonce ^:const messages-list-bottom-offset 16)
(defn keyboard-avoiding-container (defn keyboard-avoiding-container
[{:keys [top]}] [{:keys [top]}]

37
src/status_im2/contexts/chat/messages/list/view.cljs
View File

@ -35,16 +35,11 @@
(defn list-key-fn [{:keys [message-id value]}] (or message-id value)) (defn list-key-fn [{:keys [message-id value]}] (or message-id value))
(defn list-ref [ref] (reset! messages-list-ref ref)) (defn list-ref [ref] (reset! messages-list-ref ref))
(defn scroll-to-offset
[position]
(some-> ^js @messages-list-ref
(.scrollToOffset #js
{:offset position
:animated true})))
(defn scroll-to-bottom (defn scroll-to-bottom
[] []
(scroll-to-offset (- 0 style/messages-list-bottom-offset))) (some-> ^js @messages-list-ref
(.scrollToOffset #js
{:animated true})))
(defn on-scroll (defn on-scroll
[evt] [evt]
@ -129,14 +124,11 @@
[insets able-to-send-message?] [insets able-to-send-message?]
[rn/view [rn/view
{:background-color (colors/theme-colors colors/white colors/neutral-95) {:background-color (colors/theme-colors colors/white colors/neutral-95)
:margin-bottom (when platform/ios? (- style/overscroll-cover-height))
:height (+ (if able-to-send-message? :height (+ (if able-to-send-message?
(+ composer.constants/composer-default-height (+ composer.constants/composer-default-height
jump-to.constants/floating-shell-button-height jump-to.constants/floating-shell-button-height
(:bottom insets)) (:bottom insets))
(- 70 (:bottom insets))) (- 70 (:bottom insets))))}])
(when platform/ios?
(- style/overscroll-cover-height (:top insets))))}])
(defn f-list-footer-avatar (defn f-list-footer-avatar
[{:keys [scroll-y display-name online? profile-picture]}] [{:keys [scroll-y display-name online? profile-picture]}]
@ -301,10 +293,12 @@
:on-viewable-items-changed on-viewable-items-changed :on-viewable-items-changed on-viewable-items-changed
:on-content-size-change (fn [_ y] :on-content-size-change (fn [_ y]
;; NOTE(alwx): here we set the initial value of `scroll-y` ;; NOTE(alwx): here we set the initial value of `scroll-y`
;; which is needed because by default the chat is scrolled to the ;; which is needed because by default the chat is scrolled to
;; the
;; bottom ;; bottom
;; and no initial `on-scroll` event is getting triggered ;; and no initial `on-scroll` event is getting triggered
(let [scroll-y-shared (reanimated/get-shared-value scroll-y) (let [scroll-y-shared (reanimated/get-shared-value
scroll-y)
content-height-shared (reanimated/get-shared-value content-height-shared (reanimated/get-shared-value
content-height)] content-height)]
(when (or (= scroll-y-shared 0) (when (or (= scroll-y-shared 0)
@ -321,7 +315,6 @@
:scroll-indicator-insets {:top (if (:able-to-send-message? context) :scroll-indicator-insets {:top (if (:able-to-send-message? context)
(- composer.constants/composer-default-height 16) (- composer.constants/composer-default-height 16)
0)} 0)}
:keyboard-dismiss-mode :interactive :keyboard-dismiss-mode :interactive
:keyboard-should-persist-taps :always :keyboard-should-persist-taps :always
:on-scroll-begin-drag rn/dismiss-keyboard! :on-scroll-begin-drag rn/dismiss-keyboard!
@ -335,17 +328,23 @@
:style (add-inverted-y-android :style (add-inverted-y-android
{:background-color (if all-loaded? {:background-color (if all-loaded?
(colors/theme-colors (colors/theme-colors
(colors/custom-color cover-bg-color 50 20) (colors/custom-color cover-bg-color
(colors/custom-color cover-bg-color 50 40)) 50
20)
(colors/custom-color cover-bg-color
50
40))
(colors/theme-colors (colors/theme-colors
colors/white colors/white
colors/neutral-95))}) colors/neutral-95))})
;;TODO(rasom) https://github.com/facebook/react-native/issues/30034 ;;TODO(rasom) https://github.com/facebook/react-native/issues/30034
:inverted (when platform/ios? true) :inverted (when platform/ios? true)
:on-layout (fn [e] :on-layout (fn [e]
(let [layout-height (oops/oget e "nativeEvent.layout.height")] (let [layout-height (oops/oget e
"nativeEvent.layout.height")]
(reset! messages-view-height layout-height))) (reset! messages-view-height layout-height)))
:scroll-enabled (not recording?)}]])) :scroll-enabled (not recording?)
:content-inset-adjustment-behavior :never}]]))
(defn message-list-content-view (defn message-list-content-view
[props] [props]