Skip to content

Commit 26591f0

Browse files
smohamedjavidsmohamedjavid
committed
Update entry-points for Quo2 preview
Signed-off-by: Mohamed Javid <[email protected]>
1 parent ad17c37 commit 26591f0

File tree

4 files changed

+101
-59
lines changed

4 files changed

+101
-59
lines changed

‎src/status_im2/contexts/onboarding/new_to_status/view.cljs

+18-12
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,8 @@
99
[utils.i18n :as i18n]
1010
[utils.re-frame :as rf]
1111
[status-im2.contexts.onboarding.common.overlay.view :as overlay]
12-
[status-im2.contexts.profile.profiles.view :as profiles]))
12+
[status-im2.contexts.profile.profiles.view :as profiles]
13+
[status-im2.config :as config]))
1314

1415
(defn navigate-back
1516
[]
@@ -105,17 +106,22 @@
105106
[quo/page-nav
106107
{:align-mid? true
107108
:mid-section {:type :text-only :main-text ""}
108-
:left-section {:type :blur-bg
109-
:icon :i/arrow-left
110-
:icon-override-theme :dark
111-
:on-press navigate-back}
112-
:right-section-buttons [{:type :blur-bg
113-
:icon :i/info
114-
:icon-override-theme :dark
115-
:on-press #(rf/dispatch
116-
[:show-bottom-sheet
117-
{:content getting-started-doc
118-
:shell? true}])}]}]])
109+
:left-section {:type :blur-bg
110+
:icon :i/arrow-left
111+
:on-press navigate-back}
112+
:right-section-buttons [(when config/quo-preview-enabled?
113+
{:type :blur-bg
114+
:icon :i/placeholder
115+
:on-press #(rf/dispatch [:navigate-to
116+
:quo2-preview])
117+
:style {:border-color :red
118+
:border-width 1}})
119+
{:type :blur-bg
120+
:icon :i/info
121+
:on-press #(rf/dispatch
122+
[:show-bottom-sheet
123+
{:content getting-started-doc
124+
:shell? true}])}]}]])
119125

120126
(defn new-to-status
121127
[]

‎src/status_im2/contexts/profile/profiles/style.cljs

+4-3
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,10 @@
4545
:padding-top 56
4646
:padding-horizontal 20})
4747

48-
(def multi-profile-button
49-
{:align-self :flex-end
50-
:margin-bottom 20})
48+
(def multi-profile-button-container
49+
{:flex-direction :row
50+
:justify-content :flex-end
51+
:margin-bottom 20})
5152

5253
(def login-profile-card
5354
{:margin-bottom 20})

‎src/status_im2/contexts/profile/profiles/view.cljs

+32-17
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,22 @@
11
(ns status-im2.contexts.profile.profiles.view
2-
(:require [native-module.core :as native-module]
2+
(:require [clojure.string :as string]
3+
[native-module.core :as native-module]
34
[quo2.core :as quo]
5+
[quo2.foundations.colors :as colors]
46
[react-native.core :as rn]
7+
[react-native.reanimated :as reanimated]
8+
[react-native.safe-area :as safe-area]
59
[reagent.core :as reagent]
610
[status-im2.common.confirmation-drawer.view :as confirmation-drawer]
11+
[status-im2.config :as config]
12+
[status-im2.constants :as constants]
713
[status-im2.contexts.onboarding.common.background.view :as background]
814
[status-im2.contexts.profile.profiles.style :as style]
915
[taoensso.timbre :as log]
1016
[utils.i18n :as i18n]
1117
[utils.re-frame :as rf]
1218
[utils.security.core :as security]
13-
[utils.transforms :as types]
14-
[quo2.foundations.colors :as colors]
15-
[react-native.safe-area :as safe-area]
16-
[clojure.string :as string]
17-
[react-native.reanimated :as reanimated]
18-
[status-im2.constants :as constants]))
19+
[utils.transforms :as types]))
1920

2021
(defonce push-animation-fn-atom (atom nil))
2122
(defonce pop-animation-fn-atom (atom nil))
@@ -228,16 +229,30 @@
228229
[rn/keyboard-avoiding-view
229230
{:style style/login-container
230231
:keyboardVerticalOffset (- (safe-area/get-bottom))}
231-
[quo/button
232-
{:size 32
233-
:type :grey
234-
:background :blur
235-
:icon true
236-
:on-press set-show-profiles
237-
:disabled processing
238-
:accessibility-label :show-profiles
239-
:style style/multi-profile-button}
240-
:i/multi-profile]
232+
[rn/view
233+
{:style style/multi-profile-button-container}
234+
(when config/quo-preview-enabled?
235+
[rn/view
236+
{:style {:margin-right 12
237+
:border-color :red
238+
:border-width 1}}
239+
[quo/button
240+
{:size 32
241+
:type :grey
242+
:background :blur
243+
:icon true
244+
:on-press #(rf/dispatch [:navigate-to :quo2-preview])
245+
:accessibility-label :quo2-preview}
246+
:i/placeholder]])
247+
[quo/button
248+
{:size 32
249+
:type :grey
250+
:background :blur
251+
:icon true
252+
:on-press set-show-profiles
253+
:disabled processing
254+
:accessibility-label :show-profiles}
255+
:i/multi-profile]]
241256
[rn/scroll-view
242257
{:keyboard-should-persist-taps :always
243258
:style {:flex 1}}

‎src/status_im2/contexts/quo_preview/main.cljs

+47-27
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
(:require
44
[quo2.core :as quo]
55
[quo2.foundations.colors :as colors]
6-
[re-frame.core :as re-frame]
76
[react-native.core :as rn]
87
[status-im2.common.theme.core :as theme]
98
[status-im2.contexts.quo-preview.animated-header-list.animated-header-list :as animated-header-list]
@@ -105,7 +104,8 @@
105104
[status-im2.contexts.quo-preview.gradient.gradient-cover :as gradient-cover]
106105
[status-im2.contexts.quo-preview.wallet.network-amount :as network-amount]
107106
[status-im2.contexts.quo-preview.wallet.network-bridge :as network-bridge]
108-
[status-im2.contexts.quo-preview.wallet.account-card :as account-card]))
107+
[status-im2.contexts.quo-preview.wallet.account-card :as account-card]
108+
[utils.re-frame :as rf]))
109109

110110
(def screens-categories
111111
{:foundations [{:name :shadows
@@ -415,42 +415,62 @@
415415

416416
(def screens (flatten (map val screens-categories)))
417417

418+
(defn navigation-bar
419+
[]
420+
(let [logged-in? (rf/sub [:multiaccount/logged-in?])
421+
has-profiles? (boolean (rf/sub [:profile/profiles-overview]))]
422+
[quo/page-nav
423+
{:align-mid? true
424+
:mid-section {:type :text-only
425+
:main-text "Quo2 components preview"}
426+
:left-section {:icon :i/close
427+
:on-press (fn []
428+
(when-not logged-in?
429+
(theme/set-theme :dark))
430+
(rf/dispatch [:navigate-back])
431+
(when-not has-profiles?
432+
(rf/dispatch [:open-modal :new-to-status])))}}]))
433+
418434
(defn theme-switcher
419435
[]
420436
[rn/view
421-
{:style {:flex-direction :row
422-
:margin-vertical 8}}
437+
{:style {:flex-direction :row
438+
:justify-content :space-between
439+
:padding-horizontal 24
440+
:padding-vertical 12}}
423441
[quo/button {:on-press #(theme/set-theme :light)} "Set light theme"]
424442
[quo/button {:on-press #(theme/set-theme :dark)} "Set dark theme"]])
425443

426444
(defn main-screen
427445
[]
428446
(fn []
429-
[rn/scroll-view
430-
{:flex 1
431-
:padding-bottom 8
432-
:padding-horizontal 16
433-
:background-color (colors/theme-colors colors/white colors/neutral-90)}
447+
[:<>
448+
[navigation-bar]
434449
[theme-switcher]
435-
[quo/text {:size :heading-1} "Preview Quo2 Components"]
436-
[rn/view
437-
(map (fn [category]
438-
^{:key (get category 0)}
439-
[rn/view {:style {:margin-vertical 8}}
440-
[quo/text
441-
{:weight :semi-bold
442-
:size :heading-2}
443-
(clojure.core/name (key category))]
444-
(for [{:keys [name]} (val category)]
445-
^{:key name}
446-
[quo/button
447-
{:test-ID (str "quo2-" name)
448-
:style {:margin-vertical 8}
449-
:on-press #(re-frame/dispatch [:navigate-to name])}
450-
(clojure.core/name name)])])
451-
(sort screens-categories))]]))
450+
[rn/scroll-view
451+
{:flex 1
452+
:padding-bottom 8
453+
:padding-horizontal 16
454+
:background-color (colors/theme-colors colors/white colors/neutral-90)}
455+
[rn/view
456+
(map (fn [category]
457+
^{:key (get category 0)}
458+
[rn/view {:style {:margin-vertical 8}}
459+
[quo/text
460+
{:weight :semi-bold
461+
:size :heading-2}
462+
(clojure.core/name (key category))]
463+
(for [{:keys [name]} (val category)]
464+
^{:key name}
465+
[quo/button
466+
{:test-ID (str "quo2-" name)
467+
:style {:margin-vertical 8}
468+
:on-press #(rf/dispatch [:navigate-to name])}
469+
(clojure.core/name name)])])
470+
(sort screens-categories))]]]))
452471

453472
(def main-screens
454473
[{:name :quo2-preview
455-
:options {:topBar {:visible true}}
474+
:options {:topBar {:visible false}
475+
:insets {:top? true}}
456476
:component main-screen}])

0 commit comments

Comments
 (0)