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

Unread indicator on community channel (#14960) 

* Unread indicator on community channel
* Unread grey dot made a separate component
This commit is contained in:
Volodymyr Kozieiev 2023-02-02 17:09:37 +00:00 committed by GitHub
parent c2cfb4539f
commit 77a798530d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 64 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/quo2/components/common/unread_grey_dot/style.cljs Normal file
View File

@ -0,0 +1,10 @@
(ns quo2.components.common.unread-grey-dot.style
(:require [quo2.foundations.colors :as colors]))
(def unread-grey-dot
{:width 8
:height 8
:border-radius 4
:background-color (colors/theme-colors
colors/neutral-40
colors/neutral-60)})

8
src/quo2/components/common/unread_grey_dot/view.cljs Normal file
View File

@ -0,0 +1,8 @@
(ns quo2.components.common.unread-grey-dot.view
(:require [react-native.core :as rn]
[quo2.components.common.unread-grey-dot.style :as style]))
(defn unread-grey-dot
[]
[rn/view
{:style style/unread-grey-dot}])

9
src/quo2/components/community/community_list_view.cljs
View File

@ -6,6 +6,7 @@
[quo2.components.markdown.text :as text]
[quo2.foundations.colors :as colors]
[quo2.components.community.icon :as community-icon]
[quo2.components.common.unread-grey-dot.view :refer [unread-grey-dot]]
[react-native.core :as rn]))
(defn notification-view
@ -26,13 +27,7 @@
[counter/counter {:type :default} unread-mentions-count]
unread-messages?
[rn/view
{:style {:width 8
:height 8
:border-radius 4
:background-color (colors/theme-colors
colors/neutral-40
colors/neutral-60)}}]))
[unread-grey-dot]))
(defn communities-list-view-item
[props

11
src/quo2/components/list_items/channel.cljs
View File

@ -5,7 +5,8 @@
[quo2.components.markdown.text :as quo2.text]
[quo2.foundations.colors :as colors]
[quo2.theme :as theme]
[react-native.core :as rn]))
[react-native.core :as rn]
[quo2.components.common.unread-grey-dot.view :refer [unread-grey-dot]]))
(defn list-item
[{:keys [name locked? mentions-count unread-messages?
@ -42,7 +43,9 @@
{:color (if (theme/dark?) colors/neutral-60 colors/neutral-40)}))
:weight :medium
:size :paragraph-1} (str "# " name)]]
[rn/view {:style {:height 20}}
[rn/view
{:style {:height 20
:justify-content :center}}
(when (and (not locked?)
muted?)
[quo2.icons/icon :i/muted
@ -59,6 +62,4 @@
(not muted?)
(not (pos? (int mentions-count)))
unread-messages?)
[quo2.icons/icon :i/channel-notification
{:size 20
:no-color true}])]]])
[unread-grey-dot])]]])

19
src/status_im2/subs/communities.cljs
View File

@ -219,18 +219,23 @@
(re-frame/reg-sub
:communities/categorized-channels
(fn [[_ community-id]]
[(re-frame/subscribe [:communities/community community-id])])
(fn [[{:keys [joined categories chats]}] [_ _]]
[(re-frame/subscribe [:communities/community community-id])
(re-frame/subscribe [:chats/chats])])
(fn [[{:keys [joined categories chats]} full-chats-data] [_ community-id]]
(reduce
(fn [acc [_ {:keys [name categoryID id emoji can-post?]}]]
(let [category (keyword (get-in categories [categoryID :name] (i18n/label :t/none)))]
(let [category (keyword (get-in categories
[categoryID :name]
(i18n/label :t/none)))
{:keys [unviewed-messages-count]} (get full-chats-data (str community-id id))]
(update acc
category
#(vec (conj %1 %2))
{:name name
:emoji emoji
:locked? (or (not joined) (not can-post?))
:id id})))
{:name name
:emoji emoji
:unread-messages? (pos? unviewed-messages-count)
:locked? (or (not joined) (not can-post?))
:id id})))
{}
chats)))

36
src/status_im2/subs/communities_test.cljs
View File

@ -145,14 +145,14 @@
:communities
{"0x1" {:id "0x1"
:chats {"0x1" {:id "0x1" :name "chat1" :categoryID 1 :can-post? true}
"0x2" {:id "0x1" :name "chat2" :categoryID 1 :can-post? false}
"0x3" {:id "0x1" :name "chat3" :categoryID 2 :can-post? true}}
"0x2" {:id "0x2" :name "chat2" :categoryID 1 :can-post? false}
"0x3" {:id "0x3" :name "chat3" :categoryID 2 :can-post? true}}
:categories {1 {:id 1 :name "category1"}
2 {:id 2 :name "category2"}}
:joined true}})
(is (= {:category1 [{:name "chat1" :emoji nil :locked? false :id "0x1"}
{:name "chat2" :emoji nil :locked? true :id "0x1"}]
:category2 [{:name "chat3" :emoji nil :locked? false :id "0x1"}]}
(is (= {:category1 [{:name "chat1" :emoji nil :locked? false :id "0x1" :unread-messages? false}
{:name "chat2" :emoji nil :locked? true :id "0x2" :unread-messages? false}]
:category2 [{:name "chat3" :emoji nil :locked? false :id "0x3" :unread-messages? false}]}
(rf/sub [sub-name "0x1"]))))
(testing "Channels without categories"
(swap! rf-db/app-db assoc
@ -160,12 +160,28 @@
:communities
{"0x1" {:id "0x1"
:chats {"0x1" {:id "0x1" :name "chat1" :categoryID 1 :can-post? true}
"0x2" {:id "0x1" :name "chat2" :categoryID 1 :can-post? false}
"0x3" {:id "0x1" :name "chat3" :can-post? true}}
"0x2" {:id "0x2" :name "chat2" :categoryID 1 :can-post? false}
"0x3" {:id "0x3" :name "chat3" :can-post? true}}
:categories {1 {:id 1 :name "category1"}
2 {:id 2 :name "category2"}}
:joined true}})
(is (= {:category1 [{:name "chat1" :emoji nil :locked? false :id "0x1"}
{:name "chat2" :emoji nil :locked? true :id "0x1"}]
(keyword (i18n/label :t/none)) [{:name "chat3" :emoji nil :locked? false :id "0x1"}]}
(is (= {:category1 [{:name "chat1" :emoji nil :locked? false :id "0x1" :unread-messages? false}
{:name "chat2" :emoji nil :locked? true :id "0x2" :unread-messages? false}]
(keyword (i18n/label :t/none))
[{:name "chat3" :emoji nil :locked? false :id "0x3" :unread-messages? false}]}
(rf/sub [sub-name "0x1"]))))
(testing "Unread messages"
(swap! rf-db/app-db assoc
:communities/enabled? true
:communities
{"0x1" {:id "0x1"
:chats {"0x1" {:id "0x1" :name "chat1" :categoryID 1 :can-post? true}
"0x2" {:id "0x2" :name "chat2" :categoryID 1 :can-post? false}}
:categories {1 {:id 1 :name "category1"}}
:joined true}}
:chats
{"0x10x1" {:unviewed-messages-count 1}
"0x10x2" {:unviewed-messages-count 0}})
(is (= {:category1 [{:name "chat1" :emoji nil :locked? false :id "0x1" :unread-messages? true}
{:name "chat2" :emoji nil :locked? true :id "0x2" :unread-messages? false}]}
(rf/sub [sub-name "0x1"])))))