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

Updated styles and layouts for messages (#16188) 

* Messages style

* More styling

* Chat layout

* Formatting fix

* Fixes

* Updates

* Fix

* Styles for pinned messages

* Style fixes

* Style fixes
This commit is contained in:
Alexander 2023-06-22 11:47:30 +02:00 committed by GitHub
parent 88bb84bb3e
commit 1953137068
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
18 changed files with 228 additions and 265 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/quo2/components/dividers/date.cljs
View File

@ -7,7 +7,7 @@
(defn date
[value]
[rn/view
{:margin-vertical 8
{:margin-vertical 12
:padding-right 20
:padding-left 60}
[text/text

5
src/quo2/components/messages/author/style.cljs
View File

@ -2,10 +2,9 @@
(:require [quo2.foundations.colors :as colors]))
(def container
{:flex 1
:flex-wrap :wrap
{:flex-wrap :wrap
:flex-direction :row
:align-items :center})
:align-items :baseline})
(def middle-dot-nickname
{:color colors/neutral-50

49
src/quo2/components/messages/author/view.cljs
View File

@ -9,28 +9,27 @@
(def middle-dot "·")
(defn author
[{:keys [primary-name secondary-name short-chat-key time-str contact? verified? untrustworthy?]}]
[rn/view {:style style/container}
[:<>
[text/text
{:weight :semi-bold
:size :paragraph-2
:number-of-lines 1
:style {:color (colors/theme-colors colors/neutral-100 colors/white)}}
primary-name]
(when (not (string/blank? secondary-name))
[:<>
[text/text
{:size :paragraph-2
:number-of-lines 1
:style style/middle-dot-nickname}
middle-dot]
[text/text
{:weight :medium
:size :paragraph-2
:number-of-lines 1
:style {:color (colors/theme-colors colors/neutral-60 colors/neutral-40)}}
secondary-name]])]
[{:keys [primary-name secondary-name style short-chat-key time-str contact? verified? untrustworthy?]}]
[rn/view {:style (merge style/container style)}
[text/text
{:weight :semi-bold
:size :paragraph-2
:number-of-lines 1
:style {:color (colors/theme-colors colors/neutral-100 colors/white)}}
primary-name]
(when (not (string/blank? secondary-name))
[:<>
[text/text
{:size :paragraph-2
:number-of-lines 1
:style style/middle-dot-nickname}
middle-dot]
[text/text
{:weight :medium
:size :paragraph-2
:number-of-lines 1
:style {:color (colors/theme-colors colors/neutral-60 colors/neutral-40)}}
secondary-name]])
(when contact?
[icons/icon :main-icons2/contact
{:size 12
@ -50,21 +49,21 @@
(when (and (not verified?) short-chat-key)
[text/text
{:monospace true
:size :paragraph-2
:size :label
:number-of-lines 1
:style style/chat-key-text}
short-chat-key])
(when (and (not verified?) time-str)
[text/text
{:monospace true
:size :paragraph-2
:size :label
:number-of-lines 1
:style style/middle-dot-chat-key}
middle-dot])
(when time-str
[text/text
{:monospace true
:size :paragraph-2
:size :label
:accessibility-label :message-timestamp
:number-of-lines 1
:style (style/time-text verified?)}

105
src/quo2/components/messages/system_message.cljs
View File

@ -2,11 +2,11 @@
(:require [quo2.components.avatars.icon-avatar :as icon-avatar]
[quo2.components.avatars.user-avatar.view :as user-avatar]
[quo2.components.markdown.text :as text]
[quo2.components.messages.author.view :as author]
[quo2.foundations.colors :as colors]
[quo2.theme :as theme]
[react-native.core :as rn]
[react-native.reanimated :as reanimated]
[utils.string :as utils]))
[react-native.reanimated :as reanimated]))
(def themes-landed
{:pinned colors/primary-50-opa-5
@ -33,7 +33,7 @@
(defn sm-timestamp
[timestamp-str]
[rn/view {:margin-left 6}
[rn/view {:margin-left 8}
[text/text
{:size :label
:style {:color (get-color :time)
@ -61,32 +61,34 @@
:profile-picture image
:ring? false}]])
(defmulti sm-render :type)
(defmulti system-message-content :type)
(defmethod sm-render :deleted
(defmethod system-message-content :deleted
[{:keys [label timestamp-str labels child]}]
[rn/view
{:align-items :center
:justify-content :space-between
:flex 1
:flex-direction :row}
{:flex-direction :row
:flex 1
:align-items :center}
[sm-icon
{:icon :main-icons/delete
:color :danger
:opacity 5}]
[rn/view
{:align-items :center
:flex-direction :row}
[sm-icon
{:icon :main-icons/delete
:color :danger
:opacity 5}]
{:align-items :baseline
:flex-direction :row
:flex 1
:flex-wrap :wrap}
(if child
child
[text/text
{:size :paragraph-2
:style {:color (get-color :text)
:margin-right 5}}
(or (get labels label) label (:message-deleted labels))])
:style {:color (get-color :text)}}
(or (get labels label)
label
(:message-deleted labels))])
[sm-timestamp timestamp-str]]])
(defmethod sm-render :added
(defmethod system-message-content :added
[{:keys [state mentions timestamp-str labels]}]
[rn/view
{:align-items :center
@ -113,8 +115,8 @@
(:name (second mentions))]
[sm-timestamp timestamp-str]])
(defmethod sm-render :pinned
[{:keys [state pinned-by content timestamp-str labels]}]
(defmethod system-message-content :pinned
[{:keys [state pinned-by child timestamp-str labels]}]
[rn/view
{:flex-direction :row
:flex 1
@ -128,49 +130,20 @@
:flex 1}
[rn/view
{:align-items :baseline
:flex-direction :row}
[text/text
{:size :paragraph-2
:weight :semi-bold
:style {:color (get-color :text)}}
(utils/truncate-str pinned-by 18)]
:flex-direction :row
:flex 1
:flex-wrap :wrap}
[author/author
{:primary-name pinned-by
:style {:margin-right 4}}]
[rn/view
{:margin-left 4
:margin-right 2}
[text/text
{:size :paragraph-2
:style {:color (get-color :text)}}
(:pinned-a-message labels)]]
[sm-timestamp timestamp-str]]
[rn/view {:flex-direction :row}
[rn/view
{:flex-direction :row
:margin-right 4}
[sm-user-avatar (:image (:mentions content))]
[text/text
{:weight :semi-bold
:size :label}
(:name (:mentions content))]]
(when (seq (:text content))
[rn/view
{:margin-right 20
:flex-direction :row
:flex 1}
[text/text
{:size :label
:style {:color (get-color :text)}
:number-of-lines 1
:ellipsize-mode :tail}
(:text content)]])
[rn/view
{:justify-content :flex-end
:flex-direction :row
:min-width 10}
(when (seq (:info content))
[text/text
{:size :label
:style {:color (get-color :time)}}
(utils/truncate-str (:info content) 24)])]]]])
(when child
child)]])
(defn- f-system-message
[{:keys [type style non-pressable? animate-landing? labels on-long-press] :as message}]
@ -189,15 +162,13 @@
:on-long-press on-long-press
:style (reanimated/apply-animations-to-style
{:background-color sv-color}
(merge
{:flex-direction :row
:flex 1
:border-radius 16
:padding-vertical 9
:padding-horizontal 11
:background-color sv-color}
style))}
[sm-render message labels]]))
(merge {:flex-direction :row
:flex 1
:padding-vertical 8
:padding-horizontal 12
:background-color sv-color}
style))}
[system-message-content message labels]]))
(defn system-message
[message]

4
src/status_im2/contexts/chat/composer/reply/style.cljs
View File

@ -18,7 +18,8 @@
[pin?]
(merge {:flex-direction :row
:flex 1
:align-items :center}
:align-items :center
:margin-top 2}
(when-not pin?
{:left 22
:margin-right 22})))
@ -33,7 +34,6 @@
(def message-text
{:text-transform :none
:margin-left 4
:margin-top 2
:flex-shrink 1})
(def gradient

2
src/status_im2/contexts/chat/composer/reply/view.cljs
View File

@ -73,7 +73,7 @@
:size :xxxs}]
[quo/text
{:weight :semi-bold
:size :paragraph-2
:size :label
:number-of-lines 1
:style style/message-author-text}
(format-reply-author from contact-name current-public-key)]]))

3
src/status_im2/contexts/chat/menus/pinned_messages/view.cljs
View File

@ -14,10 +14,9 @@
(defn message-render-fn
[{:keys [deleted? deleted-for-me?] :as message} _ _ context]
;; TODO (flexsurfer) probably we don't want reactions here
(if (or deleted? deleted-for-me?)
[content.deleted/deleted-message message context]
[message/message-with-reactions message context (atom false)]))
[message/message message context (atom false)]))
(defn pinned-messages
[chat-id]

2
src/status_im2/contexts/chat/messages/content/album/view.cljs
View File

@ -31,7 +31,7 @@
portrait? (and (= images-count rectangular-style-count) (= album-style :portrait))]
(if (and albumize? (> images-count 1))
[:<>
[rn/view {:style {:margin-bottom 10}} [text/text-content first-image]]
[rn/view {:style {:margin-bottom 4}} [text/text-content first-image]]
[rn/view
{:style (style/album-container portrait?)
:accessible true

17
src/status_im2/contexts/chat/messages/content/deleted/view.cljs
View File

@ -7,21 +7,20 @@
(defn user-xxx-deleted-this-message
[{:keys [display-name profile-picture]}]
[rn/view
{:style {:flex-direction :row
:align-items :center
:flex 1
:flex-wrap :wrap}}
[rn/view {:style {:margin-right 4}}
[:<>
[rn/view
{:style {:margin-right 4
:align-self :center}}
[quo/user-avatar
{:full-name display-name
:profile-picture profile-picture
:status-indicator? false
:size :xxxs}]]
[quo/author {:primary-name display-name}]
[quo/author
{:primary-name display-name
:style {:margin-right 4}}]
[quo/text
{:style {:margin-left 4}
:size :paragraph-2
{:size :paragraph-2
:number-of-lines 1}
(i18n/label :t/deleted-this-message)]])

4
src/status_im2/contexts/chat/messages/content/image/view.cljs
View File

@ -22,10 +22,10 @@
image-local-url (http/replace-port (:image content) (rf/sub [:mediaserver/port]))]
[:<>
(when (= index 0)
[rn/view {:style {:margin-bottom 10}} [text/text-content message]])
[text/text-content message])
[rn/touchable-opacity
{:active-opacity 1
:style {:margin-top (when (pos? index) 10)}
:style {:margin-top 4}
:on-long-press on-long-press
:on-press #(rf/dispatch [:chat.ui/navigate-to-lightbox
message-id

28
src/status_im2/contexts/chat/messages/content/pin/style.cljs
View File

@ -1,24 +1,23 @@
(ns status-im2.contexts.chat.messages.content.pin.style
(:require [quo2.foundations.colors :as colors]))
(def system-message-default-size 36)
(def system-message-default-size 34)
(def system-message-margin-right 8)
(def pin-indicator-container
{:margin-top 4
:margin-left 54
:justify-content :center
:align-self :flex-start
:align-items :flex-start
:flex-direction :row})
{:padding-left 42
:margin-bottom 2
:align-items :center
:flex-direction :row})
(def pin-author-text
{:color colors/primary-50
:bottom 2})
{:color colors/primary-50
:margin-left 2})
(defn pinned-message-text
[]
{:color (colors/theme-colors colors/neutral-100 colors/white)})
{:color (colors/theme-colors colors/neutral-100 colors/white)
:margin-left 4})
(def system-message-container
{:flex-direction :row :margin-vertical 8})
@ -26,15 +25,16 @@
(def system-message-inner-container
{:width system-message-default-size
:height system-message-default-size
:margin-right system-message-margin-right
:border-radius system-message-default-size
:margin-right system-message-margin-right
:justify-content :center
:align-items :center
:background-color colors/primary-50-opa-10})
(def system-message-author-container
{:flex-direction :row :align-items :center})
{:flex-direction :row
:align-items :baseline})
(def system-message-timestamp-container
{:padding-left 5
:margin-top 2})
{:padding-left 8
:color colors/neutral-50})

52
src/status_im2/contexts/chat/messages/content/pin/view.cljs
View File

@ -5,53 +5,33 @@
[quo2.core :as quo]
[quo2.foundations.colors :as colors]
[utils.re-frame :as rf]
[utils.i18n :as i18n]
[status-im2.contexts.chat.messages.content.legacy-view :as old-message]
[status-im.ui.screens.chat.styles.message.message :as old-style]))
[utils.i18n :as i18n]))
(defn pinned-by-view
[pinned-by]
(let [{:keys [public-key]} (rf/sub [:multiaccount/contact])
contact-names (rf/sub [:contacts/contact-two-names-by-identity pinned-by])
author-name (if (= pinned-by public-key) (i18n/label :t/You) (first contact-names))]
author-name (if (= pinned-by public-key)
(i18n/label :t/You)
(first contact-names))]
[rn/view
{:style style/pin-indicator-container
:accessibility-label :pinned-by}
[quo/icon :i/pin {:color colors/primary-50 :size 16}]
[quo/icon :i/pin
{:color colors/primary-50
:size 16}]
[quo/text
{:size :label
:weight :medium
:style style/pin-author-text}
author-name]]))
(defn system-message
[{:keys [from in-popover? quoted-message timestamp-str chat-id] :as message}]
[rn/touchable-opacity
{:on-press (fn []
(rf/dispatch [:dismiss-keyboard])
(rf/dispatch [:pin-message/show-pins-bottom-sheet chat-id]))
:active-opacity 1
:style (merge style/system-message-container
(old-style/message-wrapper message))}
[rn/view
{:style style/system-message-inner-container
:accessibility-label :content-type-pin-icon}
[quo/icon :i/pin {:color colors/primary-50 :size 16}]]
[rn/view
[rn/view {:style style/system-message-author-container}
[rn/touchable-opacity
{:style old-style/message-author-touchable
:disabled in-popover?
:on-press #(rf/dispatch [:chat.ui/show-profile from])}
[old-message/message-author-name from {} 20]]
[quo/text
{:size :label
:style (style/pinned-message-text)}
(str " " (i18n/label :t/pinned-a-message))]
[rn/text
{:style (merge
style/system-message-timestamp-container
(old-style/message-timestamp-text))
:accessibility-label :message-timestamp}
timestamp-str]]
[reply/quoted-message quoted-message false true]]])
(defn pinned-message
[{:keys [from quoted-message timestamp-str]}]
(let [display-name (first (rf/sub [:contacts/contact-two-names-by-identity from]))]
[quo/system-message
{:type :pinned
:pinned-by display-name
:child [reply/quoted-message quoted-message false true]
:timestamp-str timestamp-str
:labels {:pinned-a-message (i18n/label :t/pinned-a-message)}}]))

4
src/status_im2/contexts/chat/messages/content/reactions/view.cljs
View File

@ -43,8 +43,8 @@
[rn/scroll-view
{:shows-horizontal-scroll-indicator false
:horizontal true
:style {:margin-left 52
:margin-bottom 12
:style {:margin-left 44
:margin-top 8
:flex-direction :row}}
(for [{:keys [own emoji-id quantity emoji-reaction-id]
:as emoji-reaction} reactions]

18
src/status_im2/contexts/chat/messages/content/style.cljs
View File

@ -2,10 +2,14 @@
(:require [quo2.foundations.colors :as colors]))
(defn message-container
[in-pinned-view? pinned-by mentioned last-in-group?]
(merge (when (and (not in-pinned-view?) (or mentioned pinned-by))
{:background-color colors/primary-50-opa-5
:margin-bottom 4})
(when (or mentioned pinned-by last-in-group?)
{:margin-top 8})
{:border-radius 16}))
([]
(message-container false nil nil false))
([in-pinned-view? pinned-by mentioned last-in-group?]
(cond-> {:border-radius 16
:margin-horizontal 8}
(and (not in-pinned-view?) (or mentioned pinned-by))
(assoc :background-color colors/primary-50-opa-5 :margin-bottom 4)
(or mentioned pinned-by last-in-group?)
(assoc :margin-top 8))))

14
src/status_im2/contexts/chat/messages/content/text/style.cljs
View File

@ -1,22 +1,14 @@
(ns status-im2.contexts.chat.messages.content.text.style
(:require [quo2.foundations.colors :as colors]))
(def spacing-between-blocks 10)
(def parsed-text-block
{:margin-top -4})
(def paragraph
{:margin-top spacing-between-blocks})
(def spacing-between-blocks 0)
(def block
{:margin-top spacing-between-blocks
:border-radius 6
{:border-radius 6
:padding-horizontal 3})
(def quote
{:margin-top spacing-between-blocks
:border-left-width 1
{:border-left-width 1
:padding-left 10
:border-left-color colors/neutral-40})

26
src/status_im2/contexts/chat/messages/content/text/view.cljs
View File

@ -79,21 +79,19 @@
(case (keyword type)
:paragraph
(conj blocks
[rn/view {:style style/paragraph}
(reduce
(fn [acc e]
(render-inline acc e chat-id))
[quo/text]
children)])
(reduce
(fn [acc e]
(render-inline acc e chat-id))
[quo/text {:size :paragraph-1}]
children))
:edited-block
(conj blocks
[rn/view {:style style/paragraph}
(reduce
(fn [acc e]
(render-inline acc e chat-id))
[quo/text]
children)])
(reduce
(fn [acc e]
(render-inline acc e chat-id))
[quo/text {:size :paragraph-1}]
children))
:blockquote
(conj blocks
@ -124,7 +122,7 @@
(defn render-parsed-text
[{:keys [content chat-id edited-at]}]
^{:key (:parsed-text content)}
[rn/view {:style style/parsed-text-block}
[rn/view
(reduce (fn [acc e]
(render-block acc e chat-id))
[:<>]
@ -134,6 +132,6 @@
(defn text-content
[message-data]
[rn/view
[:<>
[render-parsed-text message-data]
[link-preview/view message-data]])

146
src/status_im2/contexts/chat/messages/content/view.cljs
View File

@ -6,6 +6,7 @@
[status-im2.contexts.chat.messages.content.style :as style]
[status-im2.contexts.chat.messages.content.pin.view :as pin]
[status-im2.constants :as constants]
[status-im2.contexts.chat.messages.content.deleted.view :as content.deleted]
[status-im2.contexts.chat.messages.content.unknown.view :as content.unknown]
[status-im2.contexts.chat.messages.content.text.view :as content.text]
[status-im2.contexts.chat.messages.drawers.view :as drawers]
@ -29,12 +30,12 @@
(def delivery-state-showing-time-ms 3000)
(defn avatar-container
[{:keys [content last-in-group? pinned-by quoted-message from]} message-reaction-view?]
[{:keys [content last-in-group? pinned-by quoted-message from]} show-reactions?]
(if (or (and (seq (:response-to content))
quoted-message)
last-in-group?
pinned-by
message-reaction-view?)
(not show-reactions?))
[avatar/avatar from :small]
[rn/view {:padding-top 2 :width 32}]))
@ -46,8 +47,8 @@
quoted-message
from
timestamp]}
message-reaction-view?]
(when (or (and (seq response-to) quoted-message) last-in-group? pinned-by message-reaction-view?)
show-reactions?]
(when (or (and (seq response-to) quoted-message) last-in-group? pinned-by (not show-reactions?))
(let [[primary-name secondary-name] (rf/sub [:contacts/contact-two-names-by-identity from])
{:keys [ens-verified added?]} (rf/sub [:contacts/contact-by-address from])]
[quo/author
@ -61,46 +62,54 @@
(defn system-message-content
[{:keys [content-type quoted-message] :as message-data}]
(if quoted-message
[pin/system-message message-data]
(case content-type
[pin/pinned-message message-data]
(condp = content-type
constants/content-type-system-text [system.text/text-content message-data]
constants/content-type-system-text
[system.text/text-content message-data]
constants/content-type-system-pinned-message [system.text/text-content message-data]
constants/content-type-system-pinned-message
[system.text/text-content message-data]
constants/content-type-community [not-implemented/not-implemented
[old-message/community message-data]]
constants/content-type-community
[not-implemented/not-implemented
[old-message/community message-data]]
constants/content-type-contact-request [not-implemented/not-implemented
[old-message/system-contact-request message-data]])))
constants/content-type-contact-request
[not-implemented/not-implemented
[old-message/system-contact-request message-data]])))
(declare on-long-press)
(defn user-message-content
[]
(let [show-delivery-state? (reagent/atom false)]
(fn [{:keys [content-type quoted-message content outgoing outgoing-status] :as message-data}
context
keyboard-shown?
message-reaction-view?]
(let [first-image (first (:album message-data))
outgoing-status (if (= content-type constants/content-type-album)
(:outgoing-status first-image)
outgoing-status)
outgoing (if (= content-type constants/content-type-album)
(:outgoing first-image)
outgoing)
context (assoc context
:on-long-press
#(on-long-press message-data context keyboard-shown?))
response-to (:response-to content)
height (rf/sub [:dimensions/window-height])]
(fn [{:keys [message-data context keyboard-shown? show-reactions?]}]
(let [{:keys [content-type quoted-message content
outgoing outgoing-status pinned-by]} message-data
first-image (first (:album message-data))
outgoing-status (if (= content-type
constants/content-type-album)
(:outgoing-status first-image)
outgoing-status)
outgoing (if (= content-type
constants/content-type-album)
(:outgoing first-image)
outgoing)
context (assoc context
:on-long-press
#(on-long-press message-data
context
keyboard-shown?))
response-to (:response-to content)
height (rf/sub [:dimensions/window-height])]
[rn/touchable-highlight
{:accessibility-label (if (and outgoing (= outgoing-status :sending))
:message-sending
:message-sent)
:underlay-color (colors/theme-colors colors/neutral-5 colors/neutral-90)
:style {:border-radius 16
:padding 8
:opacity (if (and outgoing (= outgoing-status :sending)) 0.5 1)}
:on-press (fn []
(if (and platform/ios? keyboard-shown?)
@ -112,24 +121,28 @@
(js/setTimeout #(reset! show-delivery-state? false)
delivery-state-showing-time-ms))))
:on-long-press #(on-long-press message-data context keyboard-shown?)}
[rn/view {:style {:padding-vertical 4}}
[:<>
(when pinned-by
[pin/pinned-by-view pinned-by])
(when (and (seq response-to) quoted-message)
[reply/quoted-message quoted-message])
[rn/view
{:style {:padding-horizontal 12
{:style {:padding-horizontal 4
:flex-direction :row}}
[avatar-container message-data message-reaction-view?]
[avatar-container message-data show-reactions?]
(into
(if message-reaction-view?
[gesture/scroll-view]
[rn/view])
(if show-reactions?
[rn/view]
[gesture/scroll-view])
[{:style {:margin-left 8
:flex 1
:max-height (when message-reaction-view? (* 0.4 height))}}
[author message-data message-reaction-view?]
:max-height (when-not show-reactions?
(* 0.4 height))}}
[author message-data show-reactions?]
(case content-type
constants/content-type-text [content.text/text-content message-data context]
constants/content-type-text
[content.text/text-content message-data context]
constants/content-type-emoji
[not-implemented/not-implemented [old-message/emoji message-data]]
@ -146,34 +159,49 @@
constants/content-type-album
[album/album-message message-data context on-long-press]
[not-implemented/not-implemented [content.unknown/unknown-content message-data]])
[not-implemented/not-implemented
[content.unknown/unknown-content message-data]])
(when @show-delivery-state?
[status/status outgoing-status])])]]]))))
[status/status outgoing-status])])]
(when show-reactions?
[reactions/message-reactions-row message-data
[rn/view {:pointer-events :none}
[user-message-content
{:message-data message-data
:context context
:keyboard-shown? keyboard-shown?
:show-reactions? false}]]])]]))))
(defn on-long-press
[message-data context keyboard-shown]
[message-data context keyboard-shown?]
(rf/dispatch [:dismiss-keyboard])
(rf/dispatch [:show-bottom-sheet
{:content (drawers/reactions-and-actions message-data context)
:selected-item (fn []
[rn/view {:pointer-events :none}
[user-message-content message-data context keyboard-shown true]])}]))
[user-message-content
{:message-data message-data
:context context
:keyboard-shown? keyboard-shown?
:show-reactions? true}]])}]))
(defn message-with-reactions
[{:keys [pinned-by mentioned in-pinned-view? content-type last-in-group?] :as message-data}
context
keyboard-shown]
[rn/view
{:style (style/message-container in-pinned-view? pinned-by mentioned last-in-group?)
:accessibility-label :chat-item}
(when pinned-by
[pin/pinned-by-view pinned-by])
(if (#{constants/content-type-system-text constants/content-type-community
constants/content-type-contact-request
constants/content-type-system-pinned-message}
content-type)
[system-message-content message-data]
[user-message-content message-data context keyboard-shown false])
[reactions/message-reactions-row message-data
[rn/view {:pointer-events :none}
[user-message-content message-data context keyboard-shown true]]]])
(defn message
[{:keys [pinned-by mentioned in-pinned-view? content-type last-in-group? deleted? deleted-for-me?]
:as message-data} context keyboard-shown?]
(if (or deleted? deleted-for-me?)
[rn/view {:style (style/message-container)}
[content.deleted/deleted-message message-data context]]
[rn/view
{:style (style/message-container in-pinned-view? pinned-by mentioned last-in-group?)
:accessibility-label :chat-item}
(if (#{constants/content-type-system-text constants/content-type-community
constants/content-type-contact-request
constants/content-type-system-pinned-message}
content-type)
[system-message-content message-data]
[user-message-content
{:message-data message-data
:context context
:keyboard-shown? keyboard-shown?
:show-reactions? true}])]))

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

@ -11,9 +11,7 @@
[react-native.reanimated :as reanimated]
[status-im.ui.screens.chat.group :as chat.group]
[status-im.ui.screens.chat.message.gap :as message.gap]
[status-im2.common.not-implemented :as not-implemented]
[status-im2.constants :as constants]
[status-im2.contexts.chat.messages.content.deleted.view :as content.deleted]
[status-im2.contexts.chat.messages.content.view :as message]
[status-im2.contexts.chat.messages.list.state :as state]
[status-im2.contexts.chat.messages.list.style :as style]
@ -234,7 +232,7 @@
(reset! messages-view-header-height (+ height y))))
(defn render-fn
[{:keys [type value deleted? deleted-for-me? content-type] :as message-data} _ _
[{:keys [type value content-type] :as message-data} _ _
{:keys [context keyboard-shown?]}]
;;TODO temporary hide mutual-state-updates https://github.com/status-im/status-mobile/issues/16254
(when (not= content-type constants/content-type-system-mutual-state-update)
@ -243,12 +241,8 @@
(if (= type :datemark)
[quo/divider-date value]
(if (= content-type constants/content-type-gap)
[not-implemented/not-implemented
[message.gap/gap message-data]]
[rn/view {:padding-horizontal 8}
(if (or deleted? deleted-for-me?)
[content.deleted/deleted-message message-data context]
[message/message-with-reactions message-data context keyboard-shown?])]))]))
[message.gap/gap message-data]
[message/message message-data context keyboard-shown?]))]))
(defn scroll-handler
[event scroll-y]