[Feature] Added Mentions in Activity Center (#14451)

* [Feature][#14352] Added mentions in Activity Center

* [Update][#14352] Update in namespace

* [Update][#14352] Code Style

* [Update][#14352] Created commons for AC and fix warning on text
This commit is contained in:
Mohamed Javid 2022-11-29 19:25:33 +05:30 committed by GitHub
parent 49e9738ff8
commit bc7578ae85
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 99 additions and 5 deletions

View File

@ -58,6 +58,7 @@
(def tags quo2.components.tags.tags/tags)
(def user-avatar-tag quo2.components.tags.context-tags/user-avatar-tag)
(def context-tag quo2.components.tags.context-tags/context-tag)
(def group-avatar-tag quo2.components.tags.context-tags/group-avatar-tag)
(def tabs quo2.components.tabs.tabs/tabs)
(def scrollable-tabs quo2.components.tabs.tabs/scrollable-tabs)
(def account-selector quo2.components.tabs.account-selector/account-selector)

View File

@ -0,0 +1,8 @@
(ns status-im.ui.screens.activity-center.notification.common.style
(:require [quo2.foundations.colors :as colors]))
(def user-avatar-tag
{:background-color colors/white-opa-10})
(def user-avatar-tag-text
{:color colors/white})

View File

@ -0,0 +1,17 @@
(ns status-im.ui.screens.activity-center.notification.common.view
(:require [utils.re-frame :as rf]
[quo2.core :as quo2]
[status-im.multiaccounts.core :as multiaccounts]
[status-im.ui.screens.activity-center.notification.common.style :as style]
[status-im.ui.screens.activity-center.utils :as activity-center.utils]))
(defn user-avatar-tag [user]
(let [contact (rf/sub [:contacts/contact-by-identity user])]
[quo2/user-avatar-tag
{:color :purple
:override-theme :dark
:size :small
:style style/user-avatar-tag
:text-style style/user-avatar-tag-text}
(activity-center.utils/contact-name contact)
(multiaccounts/displayed-photo contact)]))

View File

@ -0,0 +1,14 @@
(ns status-im.ui.screens.activity-center.notification.mentions.style
(:require [quo2.foundations.colors :as colors]))
(def tag
{:background-color colors/white-opa-10})
(def tag-text
{:color colors/white})
(def mention-text
{:color colors/white
:border-radius 6
:padding-horizontal 3
:background-color colors/white-opa-10})

View File

@ -0,0 +1,48 @@
(ns status-im.ui.screens.activity-center.notification.mentions.view
(:require [quo.components.animated.pressable :as animation]
[quo2.core :as quo2]
[quo2.foundations.colors :as colors]
[status-im.i18n.i18n :as i18n]
[status-im.ui.screens.activity-center.notification.common.view :as common]
[status-im.ui.screens.activity-center.notification.mentions.style :as style]
[status-im.utils.datetime :as datetime]
[utils.re-frame :as rf]
[clojure.string :as str]))
(defn message-body [message]
(let [parsed-text (get-in message [:content :parsed-text])
parsed-text-children (:children (first parsed-text))]
(into [quo2/text {:number-of-lines 2
:style style/tag-text
:accessibility-label :activity-message-body
:size :paragraph-1}]
(map-indexed (fn [index {:keys [type literal]}]
^{:key index}
(case type
"mention" [quo2/text {:style style/mention-text
:size :paragraph-1}
(str "@" (rf/sub [:contacts/contact-name-by-identity literal]))]
literal)) parsed-text-children))))
(defn view
[{:keys [author chat-name chat-id message] :as notification}]
[animation/pressable
{:on-press (fn []
(rf/dispatch [:hide-popover])
(rf/dispatch [:chat.ui/navigate-to-chat chat-id]))}
[quo2/activity-log
{:title (i18n/label :t/mention)
:icon :i/mention
:timestamp (datetime/timestamp->relative (:timestamp notification))
:unread? (not (:read notification))
:context [[common/user-avatar-tag author]
[quo2/text {:style style/tag-text} (str/lower-case (i18n/label :t/on))]
;; TODO (@smohamedjavid): The `group-avatar-tag` component
;; does NOT support displaying channel name along with community/chat name.
;; Need to update the component to support it.
[quo2/group-avatar-tag chat-name {:size :small
:override-theme :dark
:color colors/primary-50
:style style/tag
:text-style style/tag-text}]]
:message {:body (message-body message)}}]])

View File

@ -8,6 +8,7 @@
[status-im.i18n.i18n :as i18n]
[status-im.ui.screens.activity-center.notification.contact-request.view :as contact-request]
[status-im.ui.screens.activity-center.notification.contact-verification.view :as contact-verification]
[status-im.ui.screens.activity-center.notification.mentions.view :as mentions]
[status-im.ui.screens.activity-center.style :as style]
[utils.re-frame :as rf]))
@ -112,6 +113,9 @@
types/contact-request
[contact-request/view notification]
types/mention
[mentions/view notification]
nil)])
(defn activity-center
@ -124,8 +128,9 @@
(react/effect! #(rf/dispatch [:activity-center.notifications/fetch-first-page]))
[rn/view {:style (style/screen-container window-width top bottom)}
[header]
[rn/flat-list {:data notifications
:empty-component [empty-tab]
:key-fn :id
:on-end-reached #(rf/dispatch [:activity-center.notifications/fetch-next-page])
:render-fn render-notification}]]))])
[rn/flat-list {:data notifications
:empty-component [empty-tab]
:key-fn :id
:on-scroll-to-index-failed identity
:on-end-reached #(rf/dispatch [:activity-center.notifications/fetch-next-page])
:render-fn render-notification}]]))])

View File

@ -1827,6 +1827,7 @@
"share-image": "Share image",
"see-sticker-set": "See the full sticker set",
"mentions": "Mentions",
"mention": "Mention",
"admin": "Admin",
"replies": "Replies",
"replied": "Replied",