fix bottom message hidden behind composer with minimised keyboard when replying to message (#20371)

This commit is contained in:
Parvesh Monu 2024-06-13 16:48:21 +05:30 committed by GitHub
parent df939bf85f
commit 5f7d7254e7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 46 additions and 16 deletions

View File

@ -12,7 +12,7 @@
[utils.re-frame :as rf])) [utils.re-frame :as rf]))
(defn edit-message (defn edit-message
[{:keys [text-value input-ref]}] [{:keys [text-value input-ref input-height]}]
(let [theme (quo.theme/use-theme)] (let [theme (quo.theme/use-theme)]
[rn/view [rn/view
{:style style/container {:style style/container
@ -32,7 +32,7 @@
{:size 24 {:size 24
:icon-only? true :icon-only? true
:accessibility-label :edit-cancel-button :accessibility-label :edit-cancel-button
:on-press #(utils/cancel-edit-message text-value input-ref) :on-press #(utils/cancel-edit-message text-value input-ref input-height)
:type :outline} :type :outline}
:i/close]])) :i/close]]))

View File

@ -101,12 +101,16 @@
(rf/dispatch [:chat.ui/cancel-message-reply])) (rf/dispatch [:chat.ui/cancel-message-reply]))
(defn cancel-edit-message (defn cancel-edit-message
[text-value input-ref] [text-value input-ref input-height]
(reset! text-value "") (reset! text-value "")
;; NOTE: adding a timeout to assure the input is blurred on the next tick ;; NOTE: adding a timeout to assure the input is blurred on the next tick
;; after the `text-value` was cleared. Otherwise the height will be calculated ;; after the `text-value` was cleared. Otherwise the height will be calculated
;; with the old `text-value`, leading to wrong composer height after blur. ;; with the old `text-value`, leading to wrong composer height after blur.
(js/setTimeout #(blur-input input-ref) 100) (js/setTimeout
(fn []
(blur-input input-ref)
(reanimated/set-shared-value input-height constants/input-height))
100)
(.setNativeProps ^js @input-ref (clj->js {:text ""})) (.setNativeProps ^js @input-ref (clj->js {:text ""}))
(rf/dispatch [:chat.ui/set-input-content-height constants/input-height]) (rf/dispatch [:chat.ui/set-input-content-height constants/input-height])
(rf/dispatch [:chat.ui/cancel-message-edit])) (rf/dispatch [:chat.ui/cancel-message-edit]))

View File

@ -105,8 +105,9 @@
[:<> [:<>
[reply/view state (:input-ref props)] [reply/view state (:input-ref props)]
[edit/view [edit/view
{:text-value (:text-value state) {:text-value (:text-value state)
:input-ref (:input-ref props)}]] :input-height (:height animations)
:input-ref (:input-ref props)}]]
[reanimated/touchable-opacity [reanimated/touchable-opacity
{:active-opacity 1 {:active-opacity 1
:on-press (fn [] :on-press (fn []

View File

@ -102,18 +102,43 @@
;; https://github.com/status-im/status-mobile/issues/17426 ;; https://github.com/status-im/status-mobile/issues/17426
[quo/skeleton-list (skeleton-list-props :messages parent-height platform/ios?)]])) [quo/skeleton-list (skeleton-list-props :messages parent-height platform/ios?)]]))
(defn header-height
[{:keys [insets able-to-send-message? images reply edit link-previews? input-content-height]}]
(if able-to-send-message?
(cond-> composer.constants/composer-default-height
(ff/enabled? ::ff/shell.jump-to)
(+ jump-to.constants/floating-shell-button-height)
(seq images)
(+ composer.constants/images-container-height)
reply
(+ composer.constants/reply-container-height)
edit
(+ composer.constants/edit-container-height)
link-previews?
(+ composer.constants/links-container-height)
(and input-content-height (not= input-content-height composer.constants/input-height))
(+ composer.constants/input-height)
true
(+ (:bottom insets)))
(- 70 (:bottom insets))))
(defn list-header (defn list-header
[insets able-to-send-message?] [insets able-to-send-message?]
(let [images (rf/sub [:chats/sending-image]) (let [header-data {:insets insets
height (if able-to-send-message? :able-to-send-message? able-to-send-message?
(+ composer.constants/composer-default-height :input-content-height (:input-content-height (rf/sub [:chats/current-chat-input]))
(if (ff/enabled? ::ff/shell.jump-to) :images (rf/sub [:chats/sending-image])
jump-to.constants/floating-shell-button-height :reply (rf/sub [:chats/reply-message])
0) :edit (rf/sub [:chats/edit-message])
(if (seq images) composer.constants/images-container-height 0) :link-previews? (or (rf/sub [:chats/link-previews?])
(:bottom insets)) (rf/sub [:chats/status-link-previews?]))}]
(- 70 (:bottom insets)))] [rn/view {:style {:height (header-height header-data)}}]))
[rn/view {:style {:height height}}]))
(defn list-footer-avatar (defn list-footer-avatar
[{:keys [distance-from-list-top display-name online? profile-picture theme group-chat color [{:keys [distance-from-list-top display-name online? profile-picture theme group-chat color