From 97b254c514a95a5cb04c7729f018a7609273d434 Mon Sep 17 00:00:00 2001 From: Jamie Caprani Date: Mon, 3 Jul 2023 16:37:31 +0100 Subject: [PATCH] chore: update use of theme in page-nav component (#16424) --- src/quo2/components/navigation/page_nav.cljs | 26 ++++++++++--------- src/quo2/core.cljs | 8 ++++-- .../contexts/syncing/setup_syncing/view.cljs | 16 +++++------- .../syncing/syncing_devices_list/view.cljs | 7 +++-- src/status_im2/navigation/screens.cljs | 2 +- 5 files changed, 31 insertions(+), 28 deletions(-) diff --git a/src/quo2/components/navigation/page_nav.cljs b/src/quo2/components/navigation/page_nav.cljs index 8b145e1f4a..bc150899a2 100644 --- a/src/quo2/components/navigation/page_nav.cljs +++ b/src/quo2/components/navigation/page_nav.cljs @@ -5,7 +5,8 @@ [quo2.components.icon :as icons] [quo2.components.markdown.text :as text] [quo2.foundations.colors :as colors] - [react-native.core :as rn])) + [react-native.core :as rn] + [quo2.theme :as theme])) (def ^:private centrify-style {:display :flex @@ -30,7 +31,7 @@ {:no-color true}))) (defn left-section-view - [{:keys [on-press icon accessibility-label type icon-background-color icon-override-theme] + [{:keys [on-press icon accessibility-label type icon-background-color] :or {type :grey}} put-middle-section-on-left?] [rn/view {:style (when put-middle-section-on-left? {:margin-right 5})} @@ -40,7 +41,6 @@ :type type :size 32 :accessibility-label accessibility-label - :override-theme icon-override-theme :override-background-color icon-background-color} icon]]) @@ -87,10 +87,10 @@ (defn- mid-section-view [{:keys [horizontal-description? one-icon-align-left? type left-align? - main-text right-icon main-text-icon-color left-icon on-press avatar] + main-text right-icon main-text-icon-color left-icon on-press avatar theme] :as props}] - (let [text-color (if (colors/dark?) colors/neutral-5 colors/neutral-95) - text-secondary-color (if (colors/dark?) colors/neutral-40 colors/neutral-50) + (let [text-color (colors/theme-colors colors/neutral-95 colors/neutral-5 theme) + text-secondary-color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme) component-instance [mid-section-comp (assoc props :text-secondary-color text-secondary-color)]] [rn/touchable-opacity {:on-press on-press} [rn/view @@ -152,7 +152,7 @@ :justify-content :flex-end)} (let [last-icon-index (-> right-section-buttons count dec)] (map-indexed (fn [index - {:keys [icon on-press type style icon-override-theme icon-background-color + {:keys [icon on-press type style icon-background-color accessibility-label label] :or {type :grey}}] ^{:key index} @@ -168,12 +168,11 @@ :type type :before (when label icon) :size 32 - :override-theme icon-override-theme :override-background-color icon-background-color} (if label label icon)]]) right-section-buttons))]) -(defn page-nav +(defn- page-nav-internal "[page-nav opts] opts { :one-icon-align-left? true/false @@ -198,25 +197,26 @@ {:type button-type :on-press event :icon icon - :icon-override-theme :light/:dark } :right-section-buttons vector of {:type button-type :on-press event :icon icon - :icon-override-theme :light/:dark } + :theme :light or :dark } " [{:keys [container-style one-icon-align-left? horizontal-description? align-mid? page-nav-color page-nav-background-uri mid-section left-section - right-section-buttons]}] + right-section-buttons + theme]}] (let [put-middle-section-on-left? (or align-mid? (> (count right-section-buttons) 1)) mid-section-props {:type (:type mid-section) + :theme theme :horizontal-description? horizontal-description? :description-img (:description-img mid-section) :main-text (:main-text mid-section) @@ -258,3 +258,5 @@ (not put-middle-section-on-left?) [mid-section-view mid-section-props]))] [right-section-view right-section-buttons]])) + +(def page-nav (theme/with-theme page-nav-internal)) diff --git a/src/quo2/core.cljs b/src/quo2/core.cljs index 98d34fcec7..e17d50133b 100644 --- a/src/quo2/core.cljs +++ b/src/quo2/core.cljs @@ -107,8 +107,8 @@ (def group-avatar-tag quo2.components.tags.context-tag.view/group-avatar-tag) (def audio-tag quo2.components.tags.context-tag.view/audio-tag) (def community-tag quo2.components.tags.context-tag.view/community-tag) -(def floating-shell-button quo2.components.navigation.floating-shell-button/floating-shell-button) -(def page-nav quo2.components.navigation.page-nav/page-nav) + + (def disclaimer quo2.components.selectors.disclaimer.view/view) (def checkbox quo2.components.selectors.selectors.view/checkbox) (def filter quo2.components.selectors.filter.view/view) @@ -190,6 +190,10 @@ (def preview-list quo2.components.list-items.preview-list/preview-list) (def user-list quo2.components.list-items.user-list/user-list) +;;;; NAVIGATION +(def floating-shell-button quo2.components.navigation.floating-shell-button/floating-shell-button) +(def page-nav quo2.components.navigation.page-nav/page-nav) + ;;;; NOTIFICATIONS (def activity-log quo2.components.notifications.activity-log.view/view) (def info-count quo2.components.notifications.info-count/info-count) diff --git a/src/status_im2/contexts/syncing/setup_syncing/view.cljs b/src/status_im2/contexts/syncing/setup_syncing/view.cljs index dbbd277ba2..3d51cbb416 100644 --- a/src/status_im2/contexts/syncing/setup_syncing/view.cljs +++ b/src/status_im2/contexts/syncing/setup_syncing/view.cljs @@ -23,15 +23,13 @@ [quo/page-nav {:align-mid? true :mid-section {:type :text-only :main-text ""} - :left-section {:type :grey - :icon :i/close - :icon-override-theme :dark - :on-press #(rf/dispatch [:navigate-back])} - :right-section-buttons [{:type :grey - :label (i18n/label :t/how-to-pair) - :icon :i/info - :icon-override-theme :dark - :on-press #(rf/dispatch [:open-modal :how-to-pair])}]}]]) + :left-section {:type :grey + :icon :i/close + :on-press #(rf/dispatch [:navigate-back])} + :right-section-buttons [{:type :grey + :label (i18n/label :t/how-to-pair) + :icon :i/info + :on-press #(rf/dispatch [:open-modal :how-to-pair])}]}]]) (defn f-use-interval [clock cleanup-clock delay] diff --git a/src/status_im2/contexts/syncing/syncing_devices_list/view.cljs b/src/status_im2/contexts/syncing/syncing_devices_list/view.cljs index 638b8eb6c1..719d8eb724 100644 --- a/src/status_im2/contexts/syncing/syncing_devices_list/view.cljs +++ b/src/status_im2/contexts/syncing/syncing_devices_list/view.cljs @@ -13,10 +13,9 @@ [quo/page-nav {:align-mid? true :mid-section {:type :text-only :main-text ""} - :left-section {:type :grey - :icon :i/arrow-left - :icon-override-theme :dark - :on-press #(rf/dispatch [:navigate-back])}}]]) + :left-section {:type :grey + :icon :i/arrow-left + :on-press #(rf/dispatch [:navigate-back])}}]]) (defn view [] diff --git a/src/status_im2/navigation/screens.cljs b/src/status_im2/navigation/screens.cljs index b781d82257..c9da26f4b3 100644 --- a/src/status_im2/navigation/screens.cljs +++ b/src/status_im2/navigation/screens.cljs @@ -165,7 +165,7 @@ :hardwareBackButton {:dismissModalOnPress false :popStackOnPress false}}} {:name :scan-sync-code-page - :options {:theme :dark} + :options options/dark-screen :component scan-sync-code-page/view} {:name :sign-in