Don't load chat view until chat is fetched (#19988)

This commit is contained in:
Parvesh Monu 2024-05-17 19:31:29 +05:30 committed by GitHub
parent cfe9d6e539
commit 4c84dd4a1b
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
5 changed files with 106 additions and 75 deletions

View File

@ -114,20 +114,20 @@
(defn list-footer-avatar
[{:keys [distance-from-list-top display-name online? profile-picture theme group-chat color
emoji chat-type chat-name last-message]}]
emoji chat-type chat-name empty-chat?]}]
(let [scale (reanimated/interpolate
distance-from-list-top
[0 (if (seq last-message) messages.constants/header-container-top-margin 0)]
[0 (if empty-chat? 0 messages.constants/header-container-top-margin)]
[1 0.4]
messages.constants/default-extrapolation-option)
top (reanimated/interpolate
distance-from-list-top
[0 (if (seq last-message) messages.constants/header-container-top-margin 0)]
[0 (if empty-chat? 0 messages.constants/header-container-top-margin)]
[-44 -12]
messages.constants/default-extrapolation-option)
left (reanimated/interpolate
distance-from-list-top
[0 (if (seq last-message) messages.constants/header-container-top-margin 0)]
[0 (if empty-chat? 0 messages.constants/header-container-top-margin)]
[16 -8]
messages.constants/default-extrapolation-option)
community-channel? (= chat-type constants/community-chat-type)]
@ -155,15 +155,15 @@
:size :big}])]))
(defn chat-display-name
[{:keys [distance-from-list-top display-name contact theme last-message]}]
[{:keys [distance-from-list-top display-name contact theme empty-chat?]}]
(let [top (reanimated/interpolate
distance-from-list-top
[0 (if (seq last-message) messages.constants/header-container-top-margin 0)]
[0 (if empty-chat? 0 messages.constants/header-container-top-margin)]
[0 -35]
messages.constants/default-extrapolation-option)
left (reanimated/interpolate
distance-from-list-top
[0 (if (seq last-message) messages.constants/header-container-top-margin 0)]
[0 (if empty-chat? 0 messages.constants/header-container-top-margin)]
[0 40]
messages.constants/default-extrapolation-option)]
[reanimated/view
@ -212,11 +212,11 @@
muted?)))}]}]))
(defn bio-and-actions
[{:keys [distance-from-list-top bio chat-id customization-color last-message description]}]
[{:keys [distance-from-list-top bio chat-id customization-color empty-chat? description]}]
(let [has-bio (seq (or bio description))
top (reanimated/interpolate
distance-from-list-top
[0 (if (seq last-message) messages.constants/header-container-top-margin 0)]
[0 (if empty-chat? 0 messages.constants/header-container-top-margin)]
[(if has-bio 8 16) (if has-bio -28 -20)]
messages.constants/default-extrapolation-option)]
[reanimated/view
@ -227,43 +227,43 @@
(defn footer-component
[{:keys [chat distance-from-list-top customization-color]}]
(let [theme (quo.theme/use-theme)
(let [theme (quo.theme/use-theme)
{:keys [chat-id chat-name emoji chat-type
group-chat color description
last-message]} chat
display-name (cond
(= chat-type constants/one-to-one-chat-type)
(first (rf/sub [:contacts/contact-two-names-by-identity chat-id]))
(= chat-type constants/community-chat-type)
(str "# " chat-name)
:else (str emoji chat-name))
{:keys [bio]} (rf/sub [:contacts/contact-by-identity chat-id])
online? (rf/sub [:visibility-status-updates/online? chat-id])
contact (when-not group-chat
(rf/sub [:contacts/contact-by-address chat-id]))
photo-path (if group-chat
(rf/sub [:chats/group-chat-image chat-id])
(rf/sub [:chats/photo-path chat-id]))
top-margin (+ (safe-area/get-top)
messages.constants/top-bar-height
messages.constants/header-container-top-margin
32)
background-color (colors/theme-colors
(colors/resolve-color customization-color theme 20)
(colors/resolve-color customization-color theme 40)
theme)
bottom (reanimated/interpolate
distance-from-list-top
[0 messages.constants/header-container-top-margin]
[32 -4]
messages.constants/default-extrapolation-option)
background-opacity (reanimated/interpolate
distance-from-list-top
[messages.constants/header-container-top-margin
(+ messages.constants/header-animation-distance
messages.constants/header-container-top-margin)]
[1 0]
messages.constants/default-extrapolation-option)]
empty-chat?]} chat
display-name (cond
(= chat-type constants/one-to-one-chat-type)
(first (rf/sub [:contacts/contact-two-names-by-identity chat-id]))
(= chat-type constants/community-chat-type)
(str "# " chat-name)
:else (str emoji chat-name))
{:keys [bio]} (rf/sub [:contacts/contact-by-identity chat-id])
online? (rf/sub [:visibility-status-updates/online? chat-id])
contact (when-not group-chat
(rf/sub [:contacts/contact-by-address chat-id]))
photo-path (if group-chat
(rf/sub [:chats/group-chat-image chat-id])
(rf/sub [:chats/photo-path chat-id]))
top-margin (+ (safe-area/get-top)
messages.constants/top-bar-height
messages.constants/header-container-top-margin
32)
background-color (colors/theme-colors
(colors/resolve-color customization-color theme 20)
(colors/resolve-color customization-color theme 40)
theme)
bottom (reanimated/interpolate
distance-from-list-top
[0 messages.constants/header-container-top-margin]
[32 -4]
messages.constants/default-extrapolation-option)
background-opacity (reanimated/interpolate
distance-from-list-top
[messages.constants/header-container-top-margin
(+ messages.constants/header-animation-distance
messages.constants/header-container-top-margin)]
[1 0]
messages.constants/default-extrapolation-option)]
[:<>
[reanimated/view
{:style (style/background-container background-color background-opacity top-margin)}]
@ -281,21 +281,21 @@
:emoji emoji
:chat-type chat-type
:chat-name chat-name
:last-message last-message}]
:empty-chat? empty-chat?}]
[chat-display-name
{:distance-from-list-top distance-from-list-top
:display-name display-name
:theme theme
:contact contact
:group-chat group-chat
:last-message last-message}]
:empty-chat? empty-chat?}]
[bio-and-actions
{:distance-from-list-top distance-from-list-top
:bio bio
:chat-id chat-id
:customization-color customization-color
:description description
:last-message last-message}]]]]))
:empty-chat? empty-chat?}]]]]))
(defn list-footer
[props]

View File

@ -13,13 +13,15 @@
(defn- chat-screen
[{:keys [insets] :as props}]
(let [alert-banners-top-margin (rf/sub [:alert-banners/top-margin])]
[rn/keyboard-avoiding-view
{:style style/keyboard-avoiding-container
:keyboard-vertical-offset (- (if platform/ios? alert-banners-top-margin 0) (:bottom insets))}
[list.view/messages-list-content props]
[messages.navigation/view props]
[composer.view/composer props]]))
(let [alert-banners-top-margin (rf/sub [:alert-banners/top-margin])
chat-exist? (rf/sub [:chats/current-chat-exist?])]
(when chat-exist?
[rn/keyboard-avoiding-view
{:style style/keyboard-avoiding-container
:keyboard-vertical-offset (- (if platform/ios? alert-banners-top-margin 0) (:bottom insets))}
[list.view/messages-list-content props]
[messages.navigation/view props]
[composer.view/composer props]])))
(defn lazy-chat-screen
[chat-screen-layout-calculations-complete?]

View File

@ -6,6 +6,7 @@
[react-native.reanimated :as reanimated]
[react-native.safe-area :as safe-area]
[status-im.contexts.chat.messenger.placeholder.style :as style]
[utils.re-frame :as rf]
[utils.worklets.chat.messenger.placeholder :as worklets]))
(defn- loading-skeleton
@ -17,9 +18,14 @@
(defn view
[chat-screen-layout-calculations-complete?]
(let [theme (quo.theme/use-theme)
top (safe-area/get-top)
opacity (worklets/placeholder-opacity chat-screen-layout-calculations-complete?)
z-index (worklets/placeholder-z-index chat-screen-layout-calculations-complete?)]
(let [theme (quo.theme/use-theme)
top (safe-area/get-top)
chat-exist? (rf/sub [:chats/current-chat-exist?])
opacity (worklets/placeholder-opacity chat-screen-layout-calculations-complete?)
z-index (worklets/placeholder-z-index chat-screen-layout-calculations-complete?)]
[reanimated/view {:style (style/container top opacity z-index theme)}
(when-not chat-exist?
[quo/page-nav
{:icon-name :i/arrow-left
:on-press #(rf/dispatch [:navigate-back])}])
[loading-skeleton]]))

View File

@ -169,23 +169,31 @@
:chats/current-chat-chat-view
:<- [:chats/current-chat]
(fn [current-chat]
(select-keys current-chat
[:chat-id
:able-to-send-message?
:group-chat
:admins
:invitation-admin
:public?
:chat-type
:color
:contact-request-state
:chat-name
:synced-to
:synced-from
:community-id
:emoji
:description
:last-message])))
(assoc
(select-keys current-chat
[:chat-id
:able-to-send-message?
:group-chat
:admins
:invitation-admin
:public?
:chat-type
:color
:contact-request-state
:chat-name
:synced-to
:synced-from
:community-id
:emoji
:description])
:empty-chat?
(not (:last-message current-chat)))))
(re-frame/reg-sub
:chats/current-chat-exist?
:<- [:chats/current-chat-chat-view]
(fn [current-chat]
(boolean (:chat-id current-chat))))
(re-frame/reg-sub
:chats/current-chat-color

View File

@ -192,3 +192,18 @@
chats)
(let [result (rf/sub [sub-name chat-id])]
(= image-data result)))))
(h/deftest-sub :chats/current-chat-exist?
[sub-name]
(testing "current chat without chat-id"
(let [chats {chat-id (dissoc one-to-one-chat :chat-id)}]
(swap! rf-db/app-db assoc
:chats chats
:current-chat-id chat-id)
(is (false? (rf/sub [sub-name])))))
(testing "current chat with chat-id"
(let [chats {chat-id one-to-one-chat}]
(swap! rf-db/app-db assoc
:chats chats
:current-chat-id chat-id)
(is (true? (rf/sub [sub-name]))))))