diff --git a/src/status_im/contexts/chat/messenger/composer/edit/view.cljs b/src/status_im/contexts/chat/messenger/composer/edit/view.cljs index 5daba1c0bf..40cb0b6839 100644 --- a/src/status_im/contexts/chat/messenger/composer/edit/view.cljs +++ b/src/status_im/contexts/chat/messenger/composer/edit/view.cljs @@ -12,7 +12,7 @@ [utils.re-frame :as rf])) (defn edit-message - [{:keys [text-value input-ref]}] + [{:keys [text-value input-ref input-height]}] (let [theme (quo.theme/use-theme)] [rn/view {:style style/container @@ -32,7 +32,7 @@ {:size 24 :icon-only? true :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} :i/close]])) diff --git a/src/status_im/contexts/chat/messenger/composer/utils.cljs b/src/status_im/contexts/chat/messenger/composer/utils.cljs index 843bea8b4a..734ed72e93 100644 --- a/src/status_im/contexts/chat/messenger/composer/utils.cljs +++ b/src/status_im/contexts/chat/messenger/composer/utils.cljs @@ -101,12 +101,16 @@ (rf/dispatch [:chat.ui/cancel-message-reply])) (defn cancel-edit-message - [text-value input-ref] + [text-value input-ref input-height] (reset! text-value "") ;; 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 ;; 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 ""})) (rf/dispatch [:chat.ui/set-input-content-height constants/input-height]) (rf/dispatch [:chat.ui/cancel-message-edit])) diff --git a/src/status_im/contexts/chat/messenger/composer/view.cljs b/src/status_im/contexts/chat/messenger/composer/view.cljs index 080d7a3d46..9103e14f1d 100644 --- a/src/status_im/contexts/chat/messenger/composer/view.cljs +++ b/src/status_im/contexts/chat/messenger/composer/view.cljs @@ -105,8 +105,9 @@ [:<> [reply/view state (:input-ref props)] [edit/view - {:text-value (:text-value state) - :input-ref (:input-ref props)}]] + {:text-value (:text-value state) + :input-height (:height animations) + :input-ref (:input-ref props)}]] [reanimated/touchable-opacity {:active-opacity 1 :on-press (fn [] diff --git a/src/status_im/contexts/chat/messenger/messages/list/view.cljs b/src/status_im/contexts/chat/messenger/messages/list/view.cljs index cc2908f1b2..47d5b81e03 100644 --- a/src/status_im/contexts/chat/messenger/messages/list/view.cljs +++ b/src/status_im/contexts/chat/messenger/messages/list/view.cljs @@ -102,18 +102,43 @@ ;; https://github.com/status-im/status-mobile/issues/17426 [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 [insets able-to-send-message?] - (let [images (rf/sub [:chats/sending-image]) - height (if able-to-send-message? - (+ composer.constants/composer-default-height - (if (ff/enabled? ::ff/shell.jump-to) - jump-to.constants/floating-shell-button-height - 0) - (if (seq images) composer.constants/images-container-height 0) - (:bottom insets)) - (- 70 (:bottom insets)))] - [rn/view {:style {:height height}}])) + (let [header-data {:insets insets + :able-to-send-message? able-to-send-message? + :input-content-height (:input-content-height (rf/sub [:chats/current-chat-input])) + :images (rf/sub [:chats/sending-image]) + :reply (rf/sub [:chats/reply-message]) + :edit (rf/sub [:chats/edit-message]) + :link-previews? (or (rf/sub [:chats/link-previews?]) + (rf/sub [:chats/status-link-previews?]))}] + [rn/view {:style {:height (header-height header-data)}}])) (defn list-footer-avatar [{:keys [distance-from-list-top display-name online? profile-picture theme group-chat color