From 5802097f5fed9cedeb03bda6b2535538ec5dc8a4 Mon Sep 17 00:00:00 2001 From: Jamie Caprani Date: Mon, 6 May 2024 15:14:26 +0200 Subject: [PATCH] chore(wallet): feature flag graph and hide about action button (#19832) --- .../components/buttons/wallet_ctas/style.cljs | 12 ++--- .../components/buttons/wallet_ctas/view.cljs | 53 ++++++++++--------- .../wallet/account_origin/view.cljs | 2 +- .../wallet/account_overview/style.cljs | 9 ++-- .../wallet/account_overview/view.cljs | 4 +- .../preview/quo/buttons/wallet_ctas.cljs | 12 +++-- .../preview/quo/wallet/account_overview.cljs | 5 +- .../contexts/wallet/account/style.cljs | 10 ++++ .../wallet/account/tabs/about/view.cljs | 3 +- .../contexts/wallet/account/view.cljs | 25 +++++---- src/status_im/contexts/wallet/home/style.cljs | 9 ++-- src/status_im/contexts/wallet/home/view.cljs | 9 ++-- src/status_im/feature_flags.cljs | 16 +++--- 13 files changed, 91 insertions(+), 78 deletions(-) diff --git a/src/quo/components/buttons/wallet_ctas/style.cljs b/src/quo/components/buttons/wallet_ctas/style.cljs index 265469a790..f661cb5481 100644 --- a/src/quo/components/buttons/wallet_ctas/style.cljs +++ b/src/quo/components/buttons/wallet_ctas/style.cljs @@ -1,13 +1,9 @@ (ns quo.components.buttons.wallet-ctas.style) -(def container - {:padding-top 24 - :padding-bottom 12 - :padding-horizontal 20 - :flex-direction :row - :justify-content :center - :flex 1 - :max-height 106}) +(def inner-container + {:flex-direction :row + :justify-content :center + :flex 1}) (def button-container {:padding-vertical 8 diff --git a/src/quo/components/buttons/wallet_ctas/view.cljs b/src/quo/components/buttons/wallet_ctas/view.cljs index 6fe9ab4be6..d75938e626 100644 --- a/src/quo/components/buttons/wallet_ctas/view.cljs +++ b/src/quo/components/buttons/wallet_ctas/view.cljs @@ -24,30 +24,31 @@ :color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)}} text]]) (defn view - [{:keys [buy-action send-action receive-action bridge-action]}] + [{:keys [buy-action send-action receive-action bridge-action container-style]}] (let [theme (quo.theme/use-theme)] - [rn/view {:style style/container} - [action-button - {:icon :i/add - :text (i18n/label :t/buy) - :on-press buy-action - :theme theme - :accessibility-label :buy}] - [action-button - {:icon :i/send - :text (i18n/label :t/send) - :on-press send-action - :theme theme - :accessibility-label :send}] - [action-button - {:icon :i/receive - :text (i18n/label :t/receive) - :on-press receive-action - :theme theme - :accessibility-label :receive}] - [action-button - {:icon :i/bridge - :text (i18n/label :t/bridge) - :on-press bridge-action - :theme theme - :accessibility-label :bridge}]])) + [rn/view {:style container-style} + [rn/view {:style style/inner-container} + [action-button + {:icon :i/add + :text (i18n/label :t/buy) + :on-press buy-action + :theme theme + :accessibility-label :buy}] + [action-button + {:icon :i/send + :text (i18n/label :t/send) + :on-press send-action + :theme theme + :accessibility-label :send}] + [action-button + {:icon :i/receive + :text (i18n/label :t/receive) + :on-press receive-action + :theme theme + :accessibility-label :receive}] + [action-button + {:icon :i/bridge + :text (i18n/label :t/bridge) + :on-press bridge-action + :theme theme + :accessibility-label :bridge}]]])) diff --git a/src/quo/components/wallet/account_origin/view.cljs b/src/quo/components/wallet/account_origin/view.cljs index c9f26952c9..035b350b00 100644 --- a/src/quo/components/wallet/account_origin/view.cljs +++ b/src/quo/components/wallet/account_origin/view.cljs @@ -62,7 +62,7 @@ [icons/icon :i/keycard-card {:color secondary-color}])]] - (when (= :derivation-path type) + (when (and on-press (= :derivation-path type)) [rn/pressable {:accessibility-label :derivation-path-button :on-press on-press diff --git a/src/quo/components/wallet/account_overview/style.cljs b/src/quo/components/wallet/account_overview/style.cljs index 3ce692085d..8759e25b72 100644 --- a/src/quo/components/wallet/account_overview/style.cljs +++ b/src/quo/components/wallet/account_overview/style.cljs @@ -3,12 +3,9 @@ [quo.foundations.colors :as colors])) (def account-overview-wrapper - {:padding-top 24 - :padding-horizontal 20 - :padding-bottom 20 - :height 130 - :align-items :center - :justify-content :center}) + {:height 110 + :align-items :center + :justify-content :center}) (defn account-name [color] diff --git a/src/quo/components/wallet/account_overview/view.cljs b/src/quo/components/wallet/account_overview/view.cljs index 66f90642d4..2c91252e45 100644 --- a/src/quo/components/wallet/account_overview/view.cljs +++ b/src/quo/components/wallet/account_overview/view.cljs @@ -96,12 +96,12 @@ (defn- view-internal [{:keys [state account time-frame time-frame-string time-frame-to-string account-name current-value - percentage-change currency-change metrics customization-color] + percentage-change currency-change metrics customization-color container-style] :or {customization-color :blue}}] (let [theme (quo.theme/use-theme) time-frame-string (time-string time-frame time-frame-string) up? (= metrics :positive)] - [rn/view {:style style/account-overview-wrapper} + [rn/view {:style (merge container-style style/account-overview-wrapper)} (if (= :loading state) [loading-state (colors/theme-colors colors/neutral-5 colors/neutral-90 theme)] [rn/view diff --git a/src/status_im/contexts/preview/quo/buttons/wallet_ctas.cljs b/src/status_im/contexts/preview/quo/buttons/wallet_ctas.cljs index 5e66ef3e5f..01beb42f1b 100644 --- a/src/status_im/contexts/preview/quo/buttons/wallet_ctas.cljs +++ b/src/status_im/contexts/preview/quo/buttons/wallet_ctas.cljs @@ -7,7 +7,11 @@ [] [preview/preview-container {} [quo/wallet-ctas - {:buy-action #(js/alert "Buy button pressed") - :send-action #(js/alert "Send button pressed") - :receive-action #(js/alert "Receive button pressed") - :bridge-action #(js/alert "Bridge button pressed")}]]) + {:container-style {:padding-top 24 + :padding-bottom 12 + :padding-horizontal 20 + :flex-direction :row} + :buy-action #(js/alert "Buy button pressed") + :send-action #(js/alert "Send button pressed") + :receive-action #(js/alert "Receive button pressed") + :bridge-action #(js/alert "Bridge button pressed")}]]) diff --git a/src/status_im/contexts/preview/quo/wallet/account_overview.cljs b/src/status_im/contexts/preview/quo/wallet/account_overview.cljs index 2cadb35ed6..4d32822769 100644 --- a/src/status_im/contexts/preview/quo/wallet/account_overview.cljs +++ b/src/status_im/contexts/preview/quo/wallet/account_overview.cljs @@ -50,7 +50,10 @@ :time-frame-string "16 May" :time-frame-to-string "25 May" :account :default - :customization-color :blue})] + :customization-color :blue + :container-style {:padding-top 24 + :padding-horizontal 20 + :padding-bottom 20}})] (fn [] [preview/preview-container {:state state diff --git a/src/status_im/contexts/wallet/account/style.cljs b/src/status_im/contexts/wallet/account/style.cljs index d53d7a1c46..b78b17499f 100644 --- a/src/status_im/contexts/wallet/account/style.cljs +++ b/src/status_im/contexts/wallet/account/style.cljs @@ -3,3 +3,13 @@ (def tabs {:padding-left 20 :padding-vertical 12}) + +(def cta-buttons + {:padding-horizontal 20 + :padding-bottom 13 + :flex-direction :row}) + +(def account-overview + {:padding-top 60 + :margin-bottom 12 + :padding-horizontal 20}) diff --git a/src/status_im/contexts/wallet/account/tabs/about/view.cljs b/src/status_im/contexts/wallet/account/tabs/about/view.cljs index 82b6d3c478..28726eb2fd 100644 --- a/src/status_im/contexts/wallet/account/tabs/about/view.cljs +++ b/src/status_im/contexts/wallet/account/tabs/about/view.cljs @@ -96,5 +96,4 @@ :profile-picture (profile.utils/photo profile) :customization-color customization-color :derivation-path path - :keypair-name keypair-name - :on-press #(js/alert "To be implemented")}])])) + :keypair-name keypair-name}])])) diff --git a/src/status_im/contexts/wallet/account/view.cljs b/src/status_im/contexts/wallet/account/view.cljs index ab9d06ce24..3953a87619 100644 --- a/src/status_im/contexts/wallet/account/view.cljs +++ b/src/status_im/contexts/wallet/account/view.cljs @@ -33,22 +33,25 @@ {:type :wallet-networks :on-press #(rf/dispatch [:wallet/close-account-page])}] [quo/account-overview - {:current-value formatted-balance + {:container-style style/account-overview + :current-value formatted-balance :account-name name :account (if watch-only? :watched-address :default) :customization-color color}] - [quo/wallet-graph {:time-frame :empty}] + (when (ff/enabled? ::ff/wallet.graph) [quo/wallet-graph {:time-frame :empty}]) (when (not watch-only?) [quo/wallet-ctas - {:send-action (fn [] - (rf/dispatch [:wallet/clean-send-data]) - (rf/dispatch [:wallet/wizard-navigate-forward - {:start-flow? true - :flow-id :wallet-flow}])) - :receive-action #(rf/dispatch [:open-modal :screen/wallet.share-address {:status :receive}]) - :buy-action #(rf/dispatch [:show-bottom-sheet - {:content buy-token/view}]) - :bridge-action #(rf/dispatch [:wallet/start-bridge])}]) + {:container-style style/cta-buttons + :send-action (fn [] + (rf/dispatch [:wallet/clean-send-data]) + (rf/dispatch [:wallet/wizard-navigate-forward + {:start-flow? true + :flow-id :wallet-flow}])) + :receive-action #(rf/dispatch [:open-modal :screen/wallet.share-address + {:status :receive}]) + :buy-action #(rf/dispatch [:show-bottom-sheet + {:content buy-token/view}]) + :bridge-action #(rf/dispatch [:wallet/start-bridge])}]) [quo/tabs {:style style/tabs :size 32 diff --git a/src/status_im/contexts/wallet/home/style.cljs b/src/status_im/contexts/wallet/home/style.cljs index 66bc00b49c..a38b708388 100644 --- a/src/status_im/contexts/wallet/home/style.cljs +++ b/src/status_im/contexts/wallet/home/style.cljs @@ -7,13 +7,10 @@ :padding-top 8 :padding-bottom 12}) -(def overview-container - {:height 86}) - (def accounts-list - {:padding-top 32 - :padding-bottom 12 - :max-height 112}) + {:padding-top 8 + :padding-bottom 16 + :flex-grow 0}) (def accounts-list-container {:padding-horizontal 20}) diff --git a/src/status_im/contexts/wallet/home/view.cljs b/src/status_im/contexts/wallet/home/view.cljs index 276f032689..3d37453a4b 100644 --- a/src/status_im/contexts/wallet/home/view.cljs +++ b/src/status_im/contexts/wallet/home/view.cljs @@ -6,6 +6,7 @@ [status-im.contexts.wallet.home.style :as style] [status-im.contexts.wallet.home.tabs.view :as tabs] [status-im.contexts.wallet.sheets.network-filter.view :as network-filter] + [status-im.feature-flags :as ff] [utils.i18n :as i18n] [utils.re-frame :as rf])) @@ -32,7 +33,9 @@ (def tabs-data [{:id :assets :label (i18n/label :t/assets) :accessibility-label :assets-tab} - {:id :collectibles :label (i18n/label :t/collectibles) :accessibility-label :collectibles-tab}]) + {:id :collectibles :label (i18n/label :t/collectibles) :accessibility-label :collectibles-tab} + (when (ff/enabled? ::ff/wallet.home-activity) + {:id :activity :label (i18n/label :t/activity) :accessibility-label :activity-tab})]) (defn view [] @@ -52,7 +55,7 @@ [(count cards)]) [rn/view {:style (style/home-container)} [common.top-nav/view] - [rn/view {:style style/overview-container} + [rn/view [quo/wallet-overview {:state (if tokens-loading? :loading :default) :time-frame :none @@ -60,7 +63,7 @@ :balance formatted-balance :networks networks :dropdown-on-press #(rf/dispatch [:show-bottom-sheet {:content network-filter/view}])}]] - [quo/wallet-graph {:time-frame :empty}] + (when (ff/enabled? ::ff/wallet.graph) [quo/wallet-graph {:time-frame :empty}]) [rn/flat-list {:ref #(reset! account-list-ref %) :style style/accounts-list diff --git a/src/status_im/feature_flags.cljs b/src/status_im/feature_flags.cljs index 6828fee8f4..c8bd3252ba 100644 --- a/src/status_im/feature_flags.cljs +++ b/src/status_im/feature_flags.cljs @@ -10,17 +10,17 @@ (defonce ^:private feature-flags-config (reagent/atom - {::wallet.bridge-token (enabled-in-env? :FLAG_BRIDGE_TOKEN_ENABLED) + {::community.edit-account-selection (enabled-in-env? :FLAG_EDIT_ACCOUNT_SELECTION_ENABLED) + ::wallet.activities (enabled-in-env? :FLAG_WALLET_ACTIVITY_ENABLED) + ::wallet.assets-modal-hide (enabled-in-env? :FLAG_ASSETS_MODAL_HIDE) + ::wallet.assets-modal-manage-tokens (enabled-in-env? :FLAG_ASSETS_MODAL_MANAGE_TOKENS) + ::wallet.bridge-token (enabled-in-env? :FLAG_BRIDGE_TOKEN_ENABLED) + ::wallet.contacts (enabled-in-env? :FLAG_CONTACTS_ENABLED) ::wallet.edit-derivation-path (enabled-in-env? :FLAG_EDIT_DERIVATION_PATH) - ::wallet.remove-account (enabled-in-env? :FLAG_REMOVE_ACCOUNT_ENABLED) + ::wallet.graph (enabled-in-env? :FLAG_GRAPH_ENABLED) ::wallet.import-private-key (enabled-in-env? :FLAG_IMPORT_PRIVATE_KEY_ENABLED) ::wallet.long-press-watch-only-asset (enabled-in-env? :FLAG_LONG_PRESS_WATCH_ONLY_ASSET_ENABLED) - ::wallet.assets-modal-manage-tokens (enabled-in-env? :FLAG_ASSETS_MODAL_MANAGE_TOKENS) - ::wallet.assets-modal-hide (enabled-in-env? :FLAG_ASSETS_MODAL_HIDE) - ::community.edit-account-selection (enabled-in-env? :FLAG_EDIT_ACCOUNT_SELECTION_ENABLED) - ::wallet.contacts (enabled-in-env? :FLAG_CONTACTS_ENABLED) - ::wallet.wallet-connect (enabled-in-env? :FLAG_WALLET_CONNECT_ENABLED) - ::wallet.activities (enabled-in-env? :FLAG_WALLET_ACTIVITY_ENABLED)})) + ::wallet.wallet-connect (enabled-in-env? :FLAG_WALLET_CONNECT_ENABLED)})) (defn feature-flags [] @feature-flags-config)