[#16864] Design review: messages home (#17050)

---------

Co-authored-by: Yevheniia Berdnyk <ie.berdnyk@gmail.com>
Co-authored-by: Churikova Tetiana <tatiana@status.im>
This commit is contained in:
flexsurfer 2023-08-24 14:30:47 +02:00 committed by GitHub
parent 26eeb43569
commit 8701f3545d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 68 additions and 85 deletions

View File

@ -6,22 +6,26 @@
:flex-direction :row
:align-items :center})
(def middle-dot-nickname
{:color colors/neutral-50
(defn middle-dot-nickname
[]
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50)
:margin-horizontal 4})
(def chat-key-text
{:color colors/neutral-50
(defn chat-key-text
[]
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50)
:margin-left 8})
(def middle-dot-chat-key
{:color colors/neutral-50
(defn middle-dot-chat-key
[]
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50)
:margin-left 4})
(def icon-container
{:margin-left 4})
(defn time-text
[ens?]
{:color colors/neutral-50
:margin-left (if ens? 8 4)})
[verified?]
{:color (colors/theme-colors colors/neutral-40 colors/neutral-50)
:padding-top 1
:margin-left (if verified? 8 4)})

View File

@ -9,26 +9,33 @@
(def middle-dot "·")
(defn author
[{:keys [primary-name secondary-name style short-chat-key time-str contact? verified? untrustworthy?]}]
[{:keys [primary-name secondary-name style short-chat-key time-str contact? verified? untrustworthy?
muted? size]
:or {size 13}}]
[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)}}
{:weight :semi-bold
:size (if (= size 15) :paragraph-1 :paragraph-2)
:number-of-lines 1
:accessibility-label :author-primary-name
:style {:color (if muted?
colors/neutral-50
(colors/theme-colors colors/neutral-100 colors/white))}}
primary-name]
(when (not (string/blank? secondary-name))
[:<>
[text/text
{:size :paragraph-2
{:size :label
:number-of-lines 1
:style style/middle-dot-nickname}
: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)}}
{:weight :medium
:size :label
:number-of-lines 1
:accessibility-label :author-secondary-name
:style {:padding-top 1
:color (colors/theme-colors colors/neutral-50 colors/neutral-40)}}
secondary-name]])
(when contact?
[icons/icon :main-icons2/contact
@ -51,14 +58,14 @@
{:monospace true
:size :label
:number-of-lines 1
:style style/chat-key-text}
:style (style/chat-key-text)}
short-chat-key])
(when (and (not verified?) time-str)
(when (and (not verified?) time-str short-chat-key)
[text/text
{:monospace true
:size :label
:number-of-lines 1
:style style/middle-dot-chat-key}
:style (style/middle-dot-chat-key)}
middle-dot])
(when time-str
[text/text

View File

@ -3,22 +3,13 @@
(defn container
[]
{:margin-top 8
:margin-horizontal 8
{:margin-horizontal 8
:padding-vertical 8
:padding-horizontal 12
:border-radius 12
:flex-direction :row
:align-items :center})
(defn timestamp
[muted?]
{:color (if muted?
colors/neutral-50
(colors/theme-colors colors/neutral-50 colors/neutral-40))
:margin-top 3
:margin-left 8})
(def chat-data-container
{:flex 1
:margin-left 8

View File

@ -167,36 +167,6 @@
:accessibility-label :chat-message-text}
preview-text]))
(defn verified-or-contact-icon
[{:keys [ens-verified added?]}]
(if ens-verified
[rn/view {:style {:margin-left 5 :margin-top 4}}
[quo/icon :i/verified
{:no-color true
:size 12
:color (colors/theme-colors colors/success-50 colors/success-60)}]]
(when added?
[rn/view {:style {:margin-left 5 :margin-top 4}}
[quo/icon :i/contact
{:no-color true
:size 12
:color (colors/theme-colors colors/primary-50 colors/primary-60)}]])))
(defn name-view
[display-name contact timestamp muted?]
[rn/view {:style {:flex-direction :row}}
[quo/text
{:weight :semi-bold
:accessibility-label :chat-name-text
:style {:color (when muted? colors/neutral-50)}}
display-name]
[verified-or-contact-icon contact]
[quo/text
{:size :label
:style (style/timestamp muted?)}
(datetime/to-short-str timestamp)]])
(defn avatar-view
[{:keys [contact chat-id full-name color muted?]}]
(if contact ; `contact` is passed when it's not a group chat
@ -244,13 +214,14 @@
unviewed-messages-count])]))
(defn chat-list-item
[{:keys [chat-id group-chat color name timestamp last-message muted]
[{:keys [chat-id group-chat color name last-message timestamp muted]
:as item}]
(let [display-name (if group-chat
name
(first (rf/sub [:contacts/contact-two-names-by-identity chat-id])))
contact (when-not group-chat
(rf/sub [:contacts/contact-by-address chat-id]))]
(let [[primary-name secondary-name]
(if group-chat
[name ""]
(rf/sub [:contacts/contact-two-names-by-identity chat-id]))
{:keys [ens-verified added?] :as contact} (when-not group-chat
(rf/sub [:contacts/contact-by-address chat-id]))]
[rn/touchable-opacity
{:style (style/container)
:on-press (open-chat chat-id)
@ -259,10 +230,17 @@
[avatar-view
{:contact contact
:chat-id chat-id
:full-name display-name
:full-name primary-name
:color color
:muted? muted}]
[rn/view {:style style/chat-data-container}
[name-view display-name contact timestamp muted]
[quo/author
{:primary-name primary-name
:secondary-name secondary-name
:size 15
:verified? ens-verified
:contact? added?
:muted? muted
:time-str (datetime/to-short-str timestamp)}]
[last-message-preview group-chat last-message muted]]
[notification item]]))

View File

@ -4,8 +4,7 @@
[quo2.foundations.colors :as colors]
[react-native.core :as rn]
[reagent.core :as reagent]
[status-im2.contexts.quo-preview.preview :as preview]
[utils.address :as address]))
[status-im2.contexts.quo-preview.preview :as preview]))
(def descriptor
[{:label "Primary name"
@ -36,8 +35,6 @@
[]
(let [state (reagent/atom {:primary-name "Alisher Yakupov"
:seconadary-name ""
:short-chat-key (address/get-shortened-compressed-key
"zQ3ssgRy5TtB47MMiMKMKaGyaawkCgMqqbrnAUYrZJ1sgt5N")
:time-str "09:30"
:contact? false
:verified? false

View File

@ -101,8 +101,7 @@
[rn/view {:style style/notification-container}
(if (= notification-indicator :counter)
[quo/counter
{:outline false
:customization-color customization-color}
{:customization-color customization-color}
counter-label]
[rn/view {:style (style/unread-dot customization-color)}])])

View File

@ -398,7 +398,7 @@ class TestCommunityOneDeviceMerged(MultipleSharedDeviceTestCase):
expected_time.strftime('%H:%M'),
"today" if current_time.hour < 23 else "tomorrow"
)
self.home.get_chat(self.community_name).long_press_element()
self.home.get_chat(self.community_name, community=True).long_press_element()
if not self.home.element_by_text(expected_text).is_element_displayed():
self.errors.append("Text '%s' is not shown for muted community" % expected_text)
self.home.click_system_back_button()
@ -429,7 +429,6 @@ class TestCommunityOneDeviceMerged(MultipleSharedDeviceTestCase):
if not self.home.element_by_text(expected_text).is_element_displayed():
self.errors.append("Text '%s' is not shown for a muted community channel" % expected_text)
self.home.click_system_back_button()
self.home.navigate_back_to_home_view()
self.home.communities_tab.click()
self.home.get_chat(self.community_name, community=True).long_press_element()
@ -913,8 +912,8 @@ class TestCommunityMultipleDeviceMerged(MultipleSharedDeviceTestCase):
self.errors.append("Messages from blocked user is not cleared in public chat ")
self.chat_1.navigate_back_to_home_view()
self.home_1.chats_tab.click()
if self.home_1.element_by_text(self.username_2).is_element_displayed():
self.errors.append("1-1 chat from blocked user is not removed!")
if not self.home_1.element_by_translation_id( "no-messages").is_element_displayed():
self.errors.append("1-1 chat from blocked user is not removed and messages home is not empty!")
self.chat_1.toggle_airplane_mode()
# workaround for app closed after airplane mode
@ -929,7 +928,10 @@ class TestCommunityMultipleDeviceMerged(MultipleSharedDeviceTestCase):
self.chat_1.just_fyi('Check that new messages from blocked user are not delivered')
self.chat_1.toggle_airplane_mode()
self.home_1.jump_to_card_by_text('# %s' % self.channel_name)
# self.home_1.jump_to_card_by_text('# %s' % self.channel_name)
self.home_1.communities_tab.click()
self.home_1.get_chat(self.community_name, community=True).click()
self.home_1.get_chat(self.channel_name, community_channel=True).click()
for message in message_to_disappear, message_blocked:
if self.chat_1.chat_element_by_text(message).is_element_displayed(30):
self.errors.append(
@ -977,6 +979,7 @@ class TestCommunityMultipleDeviceMerged(MultipleSharedDeviceTestCase):
if unblocked:
self.home_2.just_fyi("Check message in 1-1 chat after unblock")
self.home_2.chats_tab.click()
self.home_2.get_chat(self.username_1).click()
self.chat_2.send_message(message_unblocked)
try:

View File

@ -33,14 +33,18 @@ class ChatElement(SilentButton):
self.username = username_part
self.community = community
self.community_channel = community_channel
if self.community_channel is True:
if self.community_channel:
super().__init__(
driver,
xpath="//*[@content-desc='chat-name-text']//*[starts-with(@text,'# %s')]/../.." % username_part)
else:
elif community:
super().__init__(
driver,
xpath="//*[@content-desc='chat-name-text'][starts-with(@text,'%s')]/.." % username_part)
else:
super().__init__(
driver,
xpath="//*[@content-desc='author-primary-name'][starts-with(@text,'%s')]/.." % username_part)
def navigate(self):
if self.community:
@ -523,7 +527,7 @@ class HomeView(BaseView):
def mute_chat_long_press(self, chat_name, mute_period="mute-till-unmute", community=False, community_channel=False):
self.driver.info("Muting chat with %s" % chat_name)
self.get_chat(username=chat_name, community_channel=community_channel).long_press_element()
self.get_chat(username=chat_name, community=community, community_channel=community_channel).long_press_element()
if community:
self.mute_community_button.click()
elif community_channel: