[17377-17378] Fix reply view in activity center showing only one phot… (

#17388)
status-im · Oct 1, 2023 · 5a82e13 · 5a82e13
1 parent abd116a
commit 5a82e13
Show file tree

Hide file tree

Showing 6 changed files with 76 additions and 40 deletions.
diff --git a/src/quo2/components/notifications/activity_log/style.cljs b/src/quo2/components/notifications/activity_log/style.cljs
@@ -26,11 +26,15 @@
   {:color colors/white})
 
 (defn message-container
-  [attachment]
+  [attachment text-with-photos?]
   {:border-radius      12
    :margin-top         10
    :padding-horizontal 12
-   :padding-vertical   (if (#{:photo :gif} attachment) 12 8)
+   :padding-vertical   (if (and
+                            (not text-with-photos?)
+                            (#{:photo :gif} attachment))
+                         12
+                         8)
    :background-color   colors/white-opa-5})
 
 (def footer-container

diff --git a/src/quo2/components/notifications/activity_log/view.cljs b/src/quo2/components/notifications/activity_log/view.cljs
@@ -73,24 +73,33 @@
                  detail]]))
            context))))
 
+(defn- hiccup-props
+  [body]
+  (and (vector? body)
+       (map? (second body))
+       (second body)))
+
 (defn- activity-message
   [{:keys [title body title-number-of-lines body-number-of-lines attachment]}]
-  [rn/view {:style (style/message-container attachment)}
-   (when title
-     [text/text
-      {:size                :paragraph-2
-       :accessibility-label :activity-message-title
-       :style               style/message-title
-       :number-of-lines     title-number-of-lines}
-      title])
-   (if (string? body)
-     [text/text
-      {:style               style/message-body
-       :accessibility-label :activity-message-body
-       :size                :paragraph-1
-       :number-of-lines     body-number-of-lines}
-      body]
-     body)])
+  (let [{:keys [photos message-text]} (hiccup-props body)
+        text-with-photos?             (and (not (string/blank? message-text))
+                                           (seq photos))]
+    [rn/view {:style (style/message-container attachment text-with-photos?)}
+     (when title
+       [text/text
+        {:size                :paragraph-2
+         :accessibility-label :activity-message-title
+         :style               style/message-title
+         :number-of-lines     title-number-of-lines}
+        title])
+     (if (string? body)
+       [text/text
+        {:style               style/message-body
+         :accessibility-label :activity-message-body
+         :size                :paragraph-1
+         :number-of-lines     body-number-of-lines}
+        body]
+       body)]))
 
 (defn- activity-title
   [title replying?]

diff --git a/src/quo2/components/notifications/activity_logs_photos/style.cljs b/src/quo2/components/notifications/activity_logs_photos/style.cljs
@@ -1,5 +1,7 @@
 (ns quo2.components.notifications.activity-logs-photos.style)
 
+(def text {:margin-bottom 8})
+
 (def photos-container
   {:flex           1
    :height         40

diff --git a/src/quo2/components/notifications/activity_logs_photos/view.cljs b/src/quo2/components/notifications/activity_logs_photos/view.cljs
@@ -1,14 +1,25 @@
 (ns quo2.components.notifications.activity-logs-photos.view
   (:require [react-native.core :as rn]
-            [quo2.components.notifications.activity-logs-photos.style :as style]))
+            [quo2.components.markdown.text :as text]
+            [quo2.components.notifications.activity-logs-photos.style :as style]
+            [clojure.string :as string]))
 
 (defn view
-  [{:keys [photos]}]
-  [rn/view {:style style/photos-container}
-   (map-indexed
-    (fn [index photo]
-      ^{:key index}
-      [rn/image
-       {:source photo
-        :style  (style/photo index)}])
-    photos)])
+  [{:keys [photos message-text]}]
+  [:<>
+   (when (not (string/blank? message-text))
+     [text/text
+      {:size                :paragraph-1
+       :weight              :regular
+       :style               style/text
+       :number-of-lines     2
+       :accessibility-label :activity-log-title}
+      message-text])
+   [rn/view {:style style/photos-container}
+    (map-indexed
+     (fn [index photo]
+       ^{:key index}
+       [rn/image
+        {:source photo
+         :style  (style/photo index)}])
+     photos)]])
diff --git a/src/status_im/data_store/activities.cljs b/src/status_im/data_store/activities.cljs
@@ -61,7 +61,8 @@
                         :chatId                    :chat-id
                         :contactVerificationStatus :contact-verification-status
                         :communityId               :community-id
-                        :membershipStatus          :membership-status})
+                        :membershipStatus          :membership-status
+                        :albumMessages             :album-messages})
       (update :last-message #(when % (messages/<-rpc %)))
       (update :message #(when % (messages/<-rpc %)))
       (update :reply-message #(when % (messages/<-rpc %)))

diff --git a/src/status_im2/contexts/shell/activity_center/notification/reply/view.cljs b/src/status_im2/contexts/shell/activity_center/notification/reply/view.cljs
@@ -14,16 +14,22 @@
 
 ;; NOTE: Replies support text, image and stickers only.
 (defn- get-message-content
-  [{:keys [content-type] :as message}]
+  [{:keys [content-type] :as message} album-messages media-server-port]
   (case content-type
     constants/content-type-text [quo/text {:style style/tag-text}
                                  (get-in message [:content :text])]
 
     constants/content-type-image
-    (let [image           (get-in message [:content :image])
-          image-local-url (url/replace-port image (rf/sub [:mediaserver/port]))
-          photos          (when image-local-url [{:uri image-local-url}])]
-      [quo/activity-logs-photos {:photos photos}])
+    (let [images           (or album-messages message)
+          image-urls       (if album-messages
+                             (map :image images)
+                             [(get-in message [:content :image])])
+          image-local-urls (map (fn [url]
+                                  {:uri (url/replace-port url media-server-port)})
+                                image-urls)]
+      [quo/activity-logs-photos
+       {:photos       image-local-urls
+        :message-text (get-in message [:content :text])}])
 
     constants/content-type-sticker [old-message/sticker message]
 
@@ -54,11 +60,12 @@
 (defn view
   [{:keys [notification set-swipeable-height customization-color] :as props}]
   (let [{:keys [author chat-name community-id chat-id
-                message read timestamp]} notification
-        community-chat?                  (not (string/blank? community-id))
-        community                        (rf/sub [:communities/community community-id])
-        community-name                   (:name community)
-        community-image                  (get-in community [:images :thumbnail :uri])]
+                message read timestamp album-messages]} notification
+        community-chat?                                 (not (string/blank? community-id))
+        community                                       (rf/sub [:communities/community community-id])
+        community-name                                  (:name community)
+        community-image                                 (get-in community [:images :thumbnail :uri])
+        media-server-port                               (rf/sub [:mediaserver/port])]
     [swipeable props
      [gesture/touchable-without-feedback
       {:on-press (fn []
@@ -106,4 +113,6 @@
 
                                                       :else
                                                       nil)
-                              :body                 (get-message-content message)}}]]]))
+                              :body                 (get-message-content message
+                                                                         album-messages
+                                                                         media-server-port)}}]]]))