Skip to content

Commit cb4816a

Browse files
committed
badge
1 parent 45e6476 commit cb4816a

File tree

11 files changed

+160
-268
lines changed

11 files changed

+160
-268
lines changed

src/status_im/acquisition/chat.cljs

+1-1
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
[cofx referrer chat-name]
3434
(fx/merge cofx
3535
{::persistence/chat-initalized! true}
36-
(navigation/navigate-to-cofx :chat nil)))
36+
(navigation/navigate-to-cofx :referral-enclav nil)))
3737

3838
(fx/defn join-public-chat
3939
[cofx chat-name]

src/status_im/chat/models.cljs

+1
Original file line numberDiff line numberDiff line change
@@ -342,6 +342,7 @@
342342
[{:keys [db] :as cofx} identity]
343343
(let [my-public-key (get-in db [:multiaccount :public-key])]
344344
(if (= my-public-key identity)
345+
;;TODO change tab to profile and pop to root
345346
(navigation/navigate-to-cofx cofx :my-profile)
346347
(fx/merge
347348
cofx

src/status_im/keycard/common.cljs

+2-2
Original file line numberDiff line numberDiff line change
@@ -168,12 +168,12 @@
168168

169169
(defn keycard-sheet-content [on-cancel connected? params]
170170
(fn []
171-
(keycard-sheet/connect-keycard
171+
[keycard-sheet/connect-keycard
172172
{:on-cancel #(re-frame/dispatch on-cancel)
173173
:connected? connected?
174174
:params params
175175
:on-connect ::on-card-connected
176-
:on-disconnect ::on-card-disconnected})))
176+
:on-disconnect ::on-card-disconnected}]))
177177

178178
(fx/defn show-connection-sheet-component
179179
[{:keys [db] :as cofx} {:keys [on-card-connected on-card-read handler]

src/status_im/navigation.cljs

+7
Original file line numberDiff line numberDiff line change
@@ -76,3 +76,10 @@
7676
{:events [:rnn-navigate-back]}
7777
[_]
7878
{:rnn-navigate-back-fx nil})
79+
80+
(fx/defn change-tab-count
81+
{:events [:change-tab-count]}
82+
[_ tab cnt]
83+
{:rnn-change-tab-count-fx [tab cnt]})
84+
85+

src/status_im/navigation/core.cljs

+17-4
Original file line numberDiff line numberDiff line change
@@ -169,16 +169,29 @@
169169
(reset! root-comp-id (get tab-root-ids (get tab-key-idx tab)))
170170
(.mergeOptions Navigation "tabs-stack" (clj->js {:bottomTabs {:currentTabIndex (get tab-key-idx tab)}}))))
171171

172+
(re-frame/reg-fx
173+
:rnn-change-tab-count-fx
174+
(fn [[tab cnt]]
175+
(.mergeOptions Navigation
176+
(name (get tab-root-ids (get tab-key-idx tab)))
177+
(clj->js {:bottomTab (cond
178+
(or (pos? cnt) (pos? (:other cnt)))
179+
{:badge (str (or (:other cnt) cnt)) :dotIndicator {:visible false}}
180+
(pos? (:public cnt))
181+
{:badge nil :dotIndicator {:visible true}}
182+
:else
183+
{:dotIndicator {:visible false} :badge nil})}))))
184+
172185
(re-frame/reg-fx
173186
:rnn-pop-to-root-tab-fx
174187
(fn [comp]
175188
(.popToRoot Navigation (name comp))))
176189

177190
(defonce register-bottom-tab-reg
178-
(.registerBottomTabSelectedListener
179-
(.events Navigation)
180-
(fn [^js evn]
181-
(reset! root-comp-id (get tab-root-ids (.-selectedTabIndex evn))))))
191+
(.registerBottomTabSelectedListener
192+
(.events Navigation)
193+
(fn [^js evn]
194+
(reset! root-comp-id (get tab-root-ids (.-selectedTabIndex evn))))))
182195

183196
;; OVERLAY (Popover and bottom sheets)
184197
(defn show-overlay [comp]

src/status_im/navigation/roots.cljs

+8-4
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,9 @@
1818

1919
(defn bottom-tab-general []
2020
{:fontSize 11
21+
:badgeColor colors/blue
22+
:badge ""
23+
:dotIndicator {:color colors/blue :visible false :size 10}
2124
:iconColor colors/gray :selectedIconColor colors/blue
2225
:textColor colors/gray :selectedTextColor colors/blue})
2326

@@ -32,7 +35,8 @@
3235
{:bottomTabs
3336
{:id :tabs-stack
3437
:options (merge (default-root)
35-
{:bottomTabs {:titleDisplayMode :alwaysHide
38+
{:bottomTabs {:tabsAttachMode :afterInitialTab
39+
:titleDisplayMode :alwaysHide
3640
:backgroundColor colors/white}})
3741
:children
3842
[;CHAT STACK
@@ -102,12 +106,12 @@
102106
{:root {:stack {:id :multiaccounts-stack
103107
:children [{:component {:name :multiaccounts
104108
:id :multiaccounts
105-
:options (status-bar-options)}}
109+
:options (assoc (status-bar-options) :topBar {:visible false})}}
106110
{:component {:name :login
107111
:id :login
108-
:options (status-bar-options)}}]
112+
:options (assoc (status-bar-options) :topBar {:visible false})}}]
109113
:options (merge (default-root)
110-
{:topBar (assoc (topbar-options) :visible false)})}}}
114+
{:topBar (topbar-options)})}}}
111115

112116
;;WELCOME
113117
:welcome
+15-122
Original file line numberDiff line numberDiff line change
@@ -1,126 +1,19 @@
11
(ns status-im.ui.components.tabbar.core
2-
(:require [oops.core :refer [oget]]
3-
[quo.gesture-handler :as gesture-handler]
4-
[re-frame.core :as re-frame]
5-
[reagent.core :as reagent]
6-
[cljs-bean.core :refer [bean]]
7-
[status-im.i18n.i18n :as i18n]
8-
[quo.components.safe-area :as safe-area]
9-
[status-im.ui.screens.routing.core :as navigation]
10-
[quo.animated :as animated]
11-
[quo.react-native :as rn]
12-
[status-im.ui.components.badge :as badge]
13-
[status-im.ui.components.icons.icons :as icons]
14-
[status-im.ui.components.react :as react]
15-
[status-im.ui.components.tabbar.styles :as tabs.styles]
16-
[status-im.utils.platform :as platform]))
2+
(:require [re-frame.core :as re-frame]))
173

18-
(defn main-tab? [view-id]
19-
(contains?
20-
#{:chat-stack :browser-stack :wallet-stack :profile-stack :status-stack
21-
:status :home :wallet :empty-tab :my-profile :wallet-onboarding-setup}
22-
view-id))
4+
(defn chat-tab []
5+
(let [count-subscription @(re-frame/subscribe [:chats/unread-messages-number])]
6+
(println "CHAT TAB" count-subscription)
7+
(re-frame/dispatch [:change-tab-count :chat count-subscription])
8+
nil))
239

24-
(def tabs-list-data
25-
(->>
26-
[{:nav-stack :chat-stack
27-
:content {:title (i18n/label :t/chat)
28-
:icon :main-icons/message}
29-
:count-subscription :chats/unread-messages-number
30-
:accessibility-label :home-tab-button}
31-
{:nav-stack :browser-stack
32-
:content {:title (i18n/label :t/browser)
33-
:icon :main-icons/browser}
34-
:accessibility-label :dapp-tab-button}
35-
{:nav-stack :wallet-stack
36-
:content {:title (i18n/label :t/wallet)
37-
:icon :main-icons/wallet}
38-
:accessibility-label :wallet-tab-button}
39-
{:nav-stack :status-stack
40-
:content {:title (i18n/label :t/status)
41-
:icon :main-icons/status}
42-
:accessibility-label :status-tab-button}
43-
{:nav-stack :profile-stack
44-
:content {:title (i18n/label :t/profile)
45-
:icon :main-icons/user-profile}
46-
:count-subscription :get-profile-unread-messages-number
47-
:accessibility-label :profile-tab-button}]
48-
(remove nil?)
49-
(map-indexed vector)))
10+
(defn profile-tab []
11+
(let [count-subscription @(re-frame/subscribe [:get-profile-unread-messages-number])]
12+
(println "PROFILE TAB" count-subscription)
13+
(re-frame/dispatch [:change-tab-count :profile count-subscription])
14+
nil))
5015

51-
(defn tab []
52-
(fn [{:keys [icon label active? nav-stack on-press
53-
accessibility-label count-subscription]}]
54-
(let [count (when count-subscription @(re-frame/subscribe [count-subscription]))]
55-
[react/view {:style tabs.styles/touchable-container}
56-
[gesture-handler/touchable-without-feedback
57-
{:style {:height "100%"
58-
:width "100%"}
59-
:on-press on-press
60-
:accessibility-label accessibility-label}
61-
[react/view {:style tabs.styles/tab-container}
62-
[react/view {:style tabs.styles/icon-container}
63-
[icons/icon icon (tabs.styles/icon active?)]
64-
(when count
65-
(cond
66-
(or (pos? count) (pos? (:other count)))
67-
[react/view {:style (if (= nav-stack :chat-stack)
68-
tabs.styles/message-counter
69-
tabs.styles/counter)}
70-
[badge/message-counter (or (:other count) count) true]]
71-
(pos? (:public count))
72-
[react/view {:style (tabs.styles/counter-public-container)}
73-
[react/view {:style tabs.styles/counter-public
74-
:accessibility-label :public-unread-badge}]]))]
75-
[react/view {:style tabs.styles/tab-title-container}
76-
[react/text {:style (tabs.styles/tab-title active?)}
77-
label]]]]])))
78-
79-
(def tabs
80-
(reagent/adapt-react-class
81-
(fn [props]
82-
(let [{:keys [navigate index route popToTop]} (bean props)
83-
{:keys [keyboard-shown]
84-
:or {keyboard-shown false}} (when platform/android? (rn/use-keyboard))
85-
{:keys [bottom]} (safe-area/use-safe-area)
86-
animated-visible (animated/use-timing-transition
87-
(main-tab? (keyword route))
88-
{:duration 150})
89-
keyboard-visible (animated/use-timing-transition
90-
keyboard-shown
91-
{:duration 200})]
92-
(reagent/as-element
93-
[animated/view {:style (tabs.styles/tabs-wrapper keyboard-shown keyboard-visible)
94-
:pointer-events (if keyboard-shown "none" "auto")}
95-
[animated/view {:style (tabs.styles/space-handler bottom)
96-
:pointer-events "none"}]
97-
[animated/view {:style (tabs.styles/animated-container animated-visible bottom)}
98-
(for [[route-index
99-
{:keys [nav-stack accessibility-label count-subscription content]}]
100-
tabs-list-data
101-
:let [{:keys [icon title]} content]]
102-
^{:key nav-stack}
103-
[tab
104-
{:icon icon
105-
:label title
106-
:on-press #(if (= (str index) (str route-index))
107-
(popToTop)
108-
(navigate (name nav-stack)))
109-
:accessibility-label accessibility-label
110-
:count-subscription count-subscription
111-
:active? (= (str index) (str route-index))
112-
:nav-stack nav-stack}])]
113-
[react/view
114-
{:style (tabs.styles/ios-titles-cover bottom)}]])))))
115-
116-
(defn tabbar [props]
117-
(let [navigate (oget props "navigation" "navigate")
118-
pop-to-top (oget props "navigation" "popToTop")
119-
state (bean (oget props "state"))
120-
index (get state :index)]
121-
(reagent/as-element
122-
[tabs {:navigate navigate
123-
:state (oget props "state")
124-
:popToTop pop-to-top
125-
:route (navigation/get-active-route-name state)
126-
:index index}])))
16+
(defn tabs-counts-subscriptions []
17+
[:<>
18+
[chat-tab]
19+
[profile-tab]])

src/status_im/ui/screens/home/views.cljs

+4-2
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,8 @@
2424
[status-im.ui.components.topbar :as topbar]
2525
[status-im.ui.components.plus-button :as components.plus-button]
2626
[status-im.ui.components.tabbar.styles :as tabs.styles]
27-
[status-im.ui.screens.chat.sheets :as sheets])
27+
[status-im.ui.screens.chat.sheets :as sheets]
28+
[status-im.ui.components.tabbar.core :as tabbar])
2829
(:require-macros [status-im.utils.views :as views]))
2930

3031
(defn home-tooltip-view []
@@ -206,4 +207,5 @@
206207
[connectivity/connectivity-button]
207208
[notifications-button]]}]
208209
[chats-list]
209-
[plus-button]])
210+
[plus-button]
211+
[tabbar/tabs-counts-subscriptions]])

src/status_im/ui/screens/keycard/onboarding/views.cljs

+52-55
Original file line numberDiff line numberDiff line change
@@ -19,63 +19,60 @@
1919
(defview intro []
2020
(letsubs [flow [:keycard-flow]
2121
{:keys [from-key-storage-and-migration? factory-reset-card?]} [:keycard]]
22-
[react/view styles/container
23-
(when-not from-key-storage-and-migration?
24-
[topbar/topbar])
25-
[react/view {:flex 1
26-
:align-items :center
27-
:margin-top (when from-key-storage-and-migration? 80)}
28-
[react/view {:align-items :center}
29-
[react/view
30-
[react/view {:align-items :center
31-
:justify-content :center
32-
:margin-top 16}
33-
[react/image {:source (resources/get-image :keycard)
34-
:style {:width 120
35-
:height 95}}]]]
36-
[react/view {:margin-top 16}
37-
[react/text {:style {:typography :header}}
38-
(i18n/label :t/keycard-onboarding-intro-header)]]
39-
[react/view {:margin-top 16
40-
:width 311}
41-
[react/text {:style {:font-size 15
42-
:line-height 22
43-
:color colors/gray
44-
:text-align :center}}
45-
(i18n/label :t/keycard-onboarding-intro-text)]]
46-
[react/view
47-
[react/touchable-highlight {:on-press #(.openURL ^js react/linking
48-
constants/keycard-integration-link)}
49-
[react/view {:flex-direction :row
50-
:align-items :center
51-
:justify-content :center}
52-
[react/text {:style {:text-align :center
53-
:color colors/blue}}
54-
(i18n/label :t/learn-more-about-keycard)]
55-
[icons/tiny-icon :tiny-icons/tiny-external {:color colors/blue
56-
:container-style {:margin-left 5}}]]]]]
22+
[react/view {:flex 1
23+
:align-items :center
24+
:margin-top (when from-key-storage-and-migration? 80)}
25+
[react/view {:align-items :center}
26+
[react/view
27+
[react/view {:align-items :center
28+
:justify-content :center
29+
:margin-top 16}
30+
[react/image {:source (resources/get-image :keycard)
31+
:style {:width 120
32+
:height 95}}]]]
33+
[react/view {:margin-top 16}
34+
[react/text {:style {:typography :header}}
35+
(i18n/label :t/keycard-onboarding-intro-header)]]
5736
[react/view {:margin-top 16
58-
:margin-left 24
59-
:margin-right 24}
60-
[react/text {:style {:typography :main-medium
37+
:width 311}
38+
[react/text {:style {:font-size 15
6139
:line-height 22
62-
:text-align :left}}
63-
(i18n/label :t/keycard-onboarding-pin-text)]
64-
(when (not= flow :recovery)
65-
[react/text {:style {:typography :main-medium
66-
:margin-top 16
67-
:line-height 22
68-
:text-align :left}}
69-
(i18n/label :t/keycard-onboarding-mnemonic-text)])]
70-
[react/view {:style {:flex-direction :row
71-
:margin-top 24}}
72-
[checkbox/checkbox {:checked? factory-reset-card?
73-
:style {:margin-right 10}
74-
:on-value-change #(re-frame/dispatch [:keycard.onboarding.intro.ui/factory-reset-card-toggle %])}]
75-
[react/text (i18n/label :t/keycard-factory-reset)]]
76-
[react/view {:margin-top 40}
77-
[quo/button {:on-press #(re-frame/dispatch [:keycard.onboarding.intro.ui/begin-setup-pressed])}
78-
(i18n/label :t/begin-set-up)]]]]))
40+
:color colors/gray
41+
:text-align :center}}
42+
(i18n/label :t/keycard-onboarding-intro-text)]]
43+
[react/view
44+
[react/touchable-highlight {:on-press #(.openURL ^js react/linking
45+
constants/keycard-integration-link)}
46+
[react/view {:flex-direction :row
47+
:align-items :center
48+
:justify-content :center}
49+
[react/text {:style {:text-align :center
50+
:color colors/blue}}
51+
(i18n/label :t/learn-more-about-keycard)]
52+
[icons/tiny-icon :tiny-icons/tiny-external {:color colors/blue
53+
:container-style {:margin-left 5}}]]]]]
54+
[react/view {:margin-top 16
55+
:margin-left 24
56+
:margin-right 24}
57+
[react/text {:style {:typography :main-medium
58+
:line-height 22
59+
:text-align :left}}
60+
(i18n/label :t/keycard-onboarding-pin-text)]
61+
(when (not= flow :recovery)
62+
[react/text {:style {:typography :main-medium
63+
:margin-top 16
64+
:line-height 22
65+
:text-align :left}}
66+
(i18n/label :t/keycard-onboarding-mnemonic-text)])]
67+
[react/view {:style {:flex-direction :row
68+
:margin-top 24}}
69+
[checkbox/checkbox {:checked? factory-reset-card?
70+
:style {:margin-right 10}
71+
:on-value-change #(re-frame/dispatch [:keycard.onboarding.intro.ui/factory-reset-card-toggle %])}]
72+
[react/text (i18n/label :t/keycard-factory-reset)]]
73+
[react/view {:margin-top 40}
74+
[quo/button {:on-press #(re-frame/dispatch [:keycard.onboarding.intro.ui/begin-setup-pressed])}
75+
(i18n/label :t/begin-set-up)]]]))
7976

8077
(defview puk-code []
8178
(letsubs [secrets [:keycard-secrets]

0 commit comments

Comments
 (0)