Wallet: Network Preferences drawer (#17710)

* Wallet: Network Preferences drawer
This commit is contained in:
Omar Basem 2023-10-25 14:55:17 +04:00 committed by GitHub
parent 3197adf855
commit 07dd42a7d3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
11 changed files with 114 additions and 20 deletions

View File

@ -37,6 +37,6 @@
:color icon-color}]]
[rn/image
{:source icon
:style {:width 32 :height 32}}])))
:style {:width component-size :height component-size}}])))
(def icon-avatar (quo.theme/with-theme icon-avatar-internal))

View File

@ -20,4 +20,11 @@
:button-one-label button-one
:button-two-label button-two}])
(h/is-truthy (h/get-by-text button-one))
(h/is-truthy (h/get-by-text button-two)))))
(h/is-truthy (h/get-by-text button-two))))
(h/test "render disabled button"
(h/render [bottom-actions/view
{:description "Sample description"
:disabled? true
:button-one-label "button"}])
(h/is-disabled (h/get-by-label-text :button-one))))

View File

@ -26,7 +26,7 @@
[props]
(let [{:keys [actions description button-one-label button-two-label
button-one-press button-two-press theme
scroll? button-one-type button-two-type]}
scroll? button-one-type button-two-type disabled?]}
(merge default-props props)]
[:<>
[rn/view {:style style/buttons-container}
@ -38,11 +38,13 @@
:type button-two-type
:on-press button-two-press} button-two-label])
[button/button
{:size 40
:container-style style/button-container
:type button-one-type
:background (when scroll? :blur)
:on-press button-one-press} button-one-label]]
{:size 40
:container-style style/button-container
:type button-one-type
:disabled? disabled?
:background (when scroll? :blur)
:on-press button-one-press
:accessibility-label :button-one} button-one-label]]
(when description
[text/text
{:size :paragraph-2

View File

@ -9,12 +9,13 @@
(defn- category-internal
[{:keys [label data blur? theme]}]
[rn/view {:style style/container}
[text/text
{:weight :medium
:size :paragraph-2
:style {:color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)}}
label]
[rn/view {:style (style/container label)}
(when label
[text/text
{:weight :medium
:size :paragraph-2
:style {:color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)}}
label])
[rn/flat-list
{:data data
:style (style/settings-items theme blur?)

View File

@ -2,11 +2,12 @@
(:require
[quo.foundations.colors :as colors]))
(def container
(defn container
[label]
{:left 0
:right 0
:padding-horizontal 20
:padding-top 12
:padding-top (when label 12)
:padding-bottom 8})
(defn settings-items

View File

@ -97,7 +97,9 @@
{:type :outline
:size 24})
(:button-text action-props)]
:selector [selectors/toggle action-props]
:selector (if (= (:type action-props) :checkbox)
[selectors/checkbox action-props]
[selectors/toggle action-props])
nil)])
(defn- internal-view

View File

@ -0,0 +1,5 @@
(ns status-im2.contexts.wallet.common.network-preferences.style)
(def data-item
{:margin-horizontal 20
:margin-vertical 8})

View File

@ -0,0 +1,62 @@
(ns status-im2.contexts.wallet.common.network-preferences.view
(:require [quo.core :as quo]
[quo.foundations.colors :as colors]
[quo.foundations.resources :as resources]
[quo.theme :as quo.theme]
[status-im2.contexts.wallet.common.network-preferences.style :as style]
[utils.i18n :as i18n]))
(def mainnet
[{:title "Mainnet"
:image :icon-avatar
:image-props {:icon (resources/get-network :ethereum)
:size :size-20}
:action :selector
:action-props {:type :checkbox}}])
(def networks-list
[{:title "Optimism"
:image :icon-avatar
:image-props {:icon (resources/get-network :optimism)
:size :size-20}
:action :selector
:action-props {:type :checkbox}}
{:title "Arbitrum"
:image :icon-avatar
:image-props {:icon (resources/get-network :arbitrum)
:size :size-20}
:action :selector
:action-props {:type :checkbox}}])
(defn- view-internal
[{:keys [address on-save theme]}]
[:<>
[quo/drawer-top
{:title (i18n/label :t/network-preferences)
:description (i18n/label :t/network-preferences-desc)}]
[quo/data-item
{:status :default
:size :default
:description :default
:label :none
:blur? false
:card? true
:title (i18n/label :t/address)
:subtitle address
:container-style (merge style/data-item
{:background-color (colors/theme-colors colors/neutral-2_5
colors/neutral-90
theme)})}]
[quo/category
{:list-type :settings
:data mainnet}]
[quo/category
{:list-type :settings
:label (i18n/label :t/layer-2)
:data networks-list}]
[quo/bottom-actions
{:button-one-label (i18n/label :t/update)
:disabled? true
:button-one-press on-save}]])
(def view (quo.theme/with-theme view-internal))

View File

@ -2,10 +2,12 @@
(:require [quo.core :as quo]
[quo.theme :as quo.theme]
[reagent.core :as reagent]
[status-im2.contexts.wallet.common.network-preferences.view :as network-preferences]
[status-im2.contexts.wallet.common.screen-base.create-or-edit-account.view :as
create-or-edit-account]
[status-im2.contexts.wallet.edit-account.style :as style]
[utils.i18n :as i18n]))
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
(defn- view-internal
[]
@ -38,7 +40,12 @@
:card? true
:title (i18n/label :t/address)
:subtitle account-address
:on-press #(js/alert "Network selector: to be implemented")
:on-press (fn []
(rf/dispatch [:show-bottom-sheet
{:content (fn [] [network-preferences/view
{:address account-address
:on-save #(js/alert
"calling on save")}])}]))
:container-style style/data-item}]])))
(def view (quo.theme/with-theme view-internal))

View File

@ -201,6 +201,10 @@
[element]
(.toBeNull (js/expect element)))
(defn is-disabled
[element]
(.toBeDisabled (js/expect element)))
(defn is-equal
[element-1 element-2]
(.toBe (js/expect element-1) element-2))

View File

@ -2356,5 +2356,8 @@
"moonpay-description": "The new standard for fiat to crypto, supports Apple Pay.",
"latamex-description": "Easily buy crypto in Argentina, Mexico and Brazil.",
"account-info": "Account info",
"account-name-input-placeholder": "Account name"
"account-name-input-placeholder": "Account name",
"network-preferences": "Network preferences",
"network-preferences-desc": "Select which network this address is happy to receive funds on",
"layer-2": "Layer 2"
}