status-im
/
status-react
mirror of https://github.com/status-im/status-react.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat(wallet) - implement network configuration on an account (#17862)

This commit is contained in:
Nikolay 2023-12-12 16:22:51 +03:00 committed by GitHub
parent f1bcc6259a
commit 7564113cb5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 352 additions and 201 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/status_im2/contexts/wallet/common/sheets/account_options/view.cljs
View File

@ -23,7 +23,8 @@
(defn- options
[{:keys [theme show-account-selector? options-height]}]
(let [{:keys [name color emoji address]} (rf/sub [:wallet/current-viewing-account])]
(let [{:keys [name color emoji address]} (rf/sub [:wallet/current-viewing-account])
network-preference-details (rf/sub [:wallet/network-preference-details])]
[rn/view
{:on-layout #(reset! options-height (oops/oget % "nativeEvent.layout.height"))
:style (when show-account-selector? style/options-container)}
@ -44,9 +45,7 @@
[quo/drawer-top
{:title name
:type :account
:networks [{:network-name :ethereum :short-name "eth"}
{:network-name :optimism :short-name "opt"}
{:network-name :arbitrum :short-name "arb1"}]
:networks network-preference-details
:description address
:account-avatar-emoji emoji
:customization-color color}]

148
src/status_im2/contexts/wallet/common/sheets/network_preferences/view.cljs
View File

@ -1,70 +1,104 @@
(ns status-im2.contexts.wallet.common.sheets.network-preferences.view
(:require [quo.core :as quo]
(:require [clojure.string :as string]
[quo.core :as quo]
[quo.foundations.colors :as colors]
[quo.foundations.resources :as resources]
[quo.theme :as quo.theme]
[reagent.core :as reagent]
[status-im2.contexts.wallet.common.sheets.network-preferences.style :as style]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
(defn- mainnet
[account-color]
[{:title "Mainnet"
:image :icon-avatar
:image-props {:icon (resources/get-network :ethereum)
:size :size-20}
:action :selector
:action-props {:type :checkbox
:customization-color account-color}}])
(defn- networks-list
[account-color]
[{:title "Optimism"
:image :icon-avatar
:image-props {:icon (resources/get-network :optimism)
:size :size-20}
:action :selector
:action-props {:type :checkbox
:customization-color account-color}}
{:title "Arbitrum"
:image :icon-avatar
:image-props {:icon (resources/get-network :arbitrum)
:size :size-20}
:action :selector
:action-props {:type :checkbox
:customization-color account-color}}])
(defn- make-network-item
[{:keys [network-name] :as _network}
{:keys [title color on-change network-preferences state] :as _options}]
{:title (or title (string/capitalize (name network-name)))
:image :icon-avatar
:image-props {:icon (resources/get-network network-name)
:size :size-20}
:action :selector
:action-props {:type (if (= :default state)
:filled-checkbox
:checkbox)
:customization-color color
:checked? (contains? network-preferences network-name)
:on-change on-change}})
(defn- view-internal
[{:keys [on-save theme]}]
(let [{:keys [color address]} (rf/sub [:wallet/current-viewing-account])]
[:<>
[quo/drawer-top
{:title (i18n/label :t/network-preferences)
:description (i18n/label :t/network-preferences-desc)}]
[quo/data-item
{:status :default
:size :default
:label :none
:blur? false
:card? true
:title (i18n/label :t/address)
:subtitle address
:subtitle-type :default
: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 color)}]
[quo/category
{:list-type :settings
:label (i18n/label :t/layer-2)
:data (networks-list color)}]
[quo/bottom-actions
{:button-one-label (i18n/label :t/update)
:button-one-props {:disabled? true
:on-press on-save
:customization-color color}}]]))
[]
(let [state (reagent/atom :default)
{:keys [color address
network-preferences-names]} (rf/sub [:wallet/current-viewing-account])
initial-network-preferences-names network-preferences-names
network-preferences-names-state (reagent/atom #{})
toggle-network (fn [network-name]
(reset! state :changed)
(if (contains? @network-preferences-names-state
network-name)
(swap! network-preferences-names-state disj
network-name)
(swap! network-preferences-names-state conj
network-name)))
get-current-preferences-names (fn []
(if (= @state :default)
initial-network-preferences-names
@network-preferences-names-state))]
(fn [{:keys [on-save theme]}]
(let [network-details (rf/sub [:wallet/network-details])
mainnet (first network-details)
layer-2-networks (rest network-details)
current-networks (filter (fn [network]
(contains? (get-current-preferences-names)
(:network-name network)))
network-details)]
[:<>
[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)
:custom-subtitle (fn []
[quo/address-text
{:networks current-networks
:address address
:format :long}])
: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 [(make-network-item mainnet
{:state @state
:title (i18n/label :t/mainnet)
:color color
:network-preferences (get-current-preferences-names)
:on-change #(toggle-network (:network-name
mainnet))})]}]
[quo/category
{:list-type :settings
:label (i18n/label :t/layer-2)
:data (mapv (fn [network]
(make-network-item network
{:state @state
:color color
:network-preferences (get-current-preferences-names)
:on-change #(toggle-network (:network-name
network))}))
layer-2-networks)}]
[quo/bottom-actions
{:button-one-label (i18n/label :t/confirm)
:button-one-props {:disabled? (= @state :default)
:on-press (fn []
(let [chain-ids (map :chain-id current-networks)]
(on-save chain-ids)))
:customization-color color}}]]))))
(def view (quo.theme/with-theme view-internal))

4
src/status_im2/contexts/wallet/common/utils.cljs
View File

@ -42,6 +42,10 @@
(total-raw-balance-in-all-chains)
(money/token->unit decimals)))
(defn get-account-by-address
[accounts address]
(some #(when (= (:address %) address) %) accounts))
(defn calculate-raw-balance
[raw-balance decimals]
(if-let [n (utils.number/parse-int raw-balance nil)]

40
src/status_im2/contexts/wallet/edit_account/view.cljs
View File

@ -15,9 +15,10 @@
(defn- show-save-account-toast
[updated-key theme]
(let [message (case updated-key
:name :t/edit-wallet-account-name-updated-message
:color :t/edit-wallet-account-colour-updated-message
:emoji :t/edit-wallet-account-emoji-updated-message
:name :t/edit-wallet-account-name-updated-message
:color :t/edit-wallet-account-colour-updated-message
:emoji :t/edit-wallet-account-emoji-updated-message
:prod-preferred-chain-ids :t/edit-wallet-network-preferences-updated-message
nil)]
(rf/dispatch [:toasts/upsert
{:id :edit-account
@ -55,10 +56,11 @@
:new-value @edited-account-name
:theme theme}))]
(fn []
(let [{:keys [name emoji address color]
:as account} (rf/sub [:wallet/current-viewing-account])
account-name (or @edited-account-name name)
button-disabled? (or (nil? @edited-account-name) (= name @edited-account-name))]
(let [{:keys [name emoji address color] :as account} (rf/sub [:wallet/current-viewing-account])
network-details (rf/sub [:wallet/network-preference-details])
account-name (or @edited-account-name name)
button-disabled? (or (nil? @edited-account-name)
(= name @edited-account-name))]
[create-or-edit-account/view
{:page-nav-right-side [{:icon-name :i/delete
:on-press #(js/alert "Delete account: to be implemented")}]
@ -86,18 +88,22 @@
:right-icon :i/advanced
:card? true
:title (i18n/label :t/address)
:custom-subtitle (fn []
[quo/address-text
{:networks [{:network-name :ethereum :short-name "eth"}
{:network-name :optimism :short-name "opt"}
{:network-name :arbitrum :short-name "arb1"}]
:address address
:format :long}])
:custom-subtitle (fn [] [quo/address-text
{:networks network-details
:address address
:format :long}])
:on-press (fn []
(rf/dispatch [:show-bottom-sheet
{:content (fn []
[network-preferences/view
{:on-save #(js/alert "calling on save")}])}]))
{:content
(fn []
[network-preferences/view
{:on-save (fn [chain-ids]
(rf/dispatch [:hide-bottom-sheet])
(save-account
{:account account
:updated-key :prod-preferred-chain-ids
:new-value chain-ids
:theme theme}))}])}]))
:container-style style/data-item}]]))))
(def view (quo.theme/with-theme view-internal))

16
src/status_im2/subs/wallet/networks.cljs
View File

@ -34,13 +34,15 @@
:wallet/network-details
:<- [:wallet/filtered-networks-by-mode false]
(fn [networks]
(keep
(fn [{:keys [chain-id related-chain-id test?]}]
(let [network-details (get network-list (if test? related-chain-id chain-id))]
(assoc network-details
:chain-id chain-id
:related-chain-id related-chain-id)))
networks)))
(->> networks
(keep
(fn [{:keys [chain-id related-chain-id layer test?]}]
(let [network-details (get network-list (if test? related-chain-id chain-id))]
(assoc network-details
:chain-id chain-id
:related-chain-id related-chain-id
:layer layer))))
(sort-by (juxt :layer :short-name)))))
(re-frame/reg-sub
:wallet/network-details-by-chain-id

27
src/status_im2/subs/wallet/networks_test.cljs
View File

@ -11,22 +11,28 @@
{:test [{:test? true
:short-name "eth"
:network-name :ethereum
:related-chain-id 1}
:related-chain-id 1
:layer 1}
{:test? true
:short-name "arb1"
:related-chain-id 42161}
:related-chain-id 42161
:layer 2}
{:test? true
:short-name "opt"
:related-chain-id 10}]
:related-chain-id 10
:layer 2}]
:prod [{:test? false
:short-name "eth"
:chain-id 1}
:chain-id 1
:layer 1}
{:test? false
:short-name "arb1"
:chain-id 42161}
:chain-id 42161
:layer 2}
{:test? false
:short-name "opt"
:chain-id 10}]})
:chain-id 10
:layer 2}]})
(h/deftest-sub :wallet/network-details
[sub-name]
@ -34,11 +40,14 @@
(swap! rf-db/app-db assoc :wallet/networks network-data)
(is (= [{:network-name :ethereum
:short-name "eth"
:chain-id 1}
:chain-id 1
:layer 1}
{:network-name :arbitrum
:short-name "arb1"
:chain-id 42161}
:chain-id 42161
:layer 2}
{:network-name :optimism
:short-name "opt"
:chain-id 10}]
:chain-id 10
:layer 2}]
(map #(dissoc % :source :related-chain-id) (rf/sub [sub-name]))))))

63
src/status_im2/subs/wallet/wallet.cljs
View File

@ -4,6 +4,25 @@
[status-im2.contexts.wallet.common.utils :as utils]
[utils.number]))
(defn- filter-networks
[chain-ids network-details]
(filter (fn [{:keys [chain-id]}]
(contains? chain-ids chain-id))
network-details))
(defn- assoc-network-preferences-names
[network-details account testnet?]
(let [{:keys [prod-preferred-chain-ids
test-preferred-chain-ids]} account
current-chain-ids (if testnet?
test-preferred-chain-ids
prod-preferred-chain-ids)
network-preferences-names (->> network-details
(filter-networks current-chain-ids)
(map :network-name)
(set))]
(assoc account :network-preferences-names network-preferences-names)))
(rf/reg-sub
:wallet/ui
:<- [:wallet]
@ -14,6 +33,12 @@
:<- [:wallet/ui]
:-> :tokens-loading?)
(rf/reg-sub
:wallet/current-viewing-account-address
:<- [:wallet]
:-> :current-viewing-account-address)
(rf/reg-sub
:wallet/watch-address-activity-state
:<- [:wallet/ui]
@ -22,10 +47,16 @@
(rf/reg-sub
:wallet/accounts
:<- [:wallet]
:-> #(->> %
:accounts
vals
(sort-by :position)))
:<- [:wallet/network-details]
(fn [[wallet network-details]]
;; TODO(@rende11): `testnet?` value would be relevant after this implementation,
;; https://github.com/status-im/status-mobile/issues/17826
(let [testnet? false]
(->> wallet
:accounts
vals
(map #(assoc-network-preferences-names network-details % testnet?))
(sort-by :position)))))
(rf/reg-sub
:wallet/addresses
@ -59,12 +90,13 @@
(rf/reg-sub
:wallet/current-viewing-account
:<- [:wallet]
:<- [:wallet/accounts]
:<- [:wallet/current-viewing-account-address]
:<- [:wallet/balances]
(fn [[{:keys [current-viewing-account-address] :as wallet} balances]]
(-> wallet
(get-in [:accounts current-viewing-account-address])
(assoc :balance (get balances current-viewing-account-address)))))
(fn [[accounts current-viewing-account-address balances]]
(let [current-viewing-account (utils/get-account-by-address accounts current-viewing-account-address)]
(-> current-viewing-account
(assoc :balance (get balances current-viewing-account-address))))))
(rf/reg-sub
:wallet/tokens-filtered
@ -85,11 +117,6 @@
sorted-tokens)]
filtered-tokens)))
(rf/reg-sub
:wallet/current-viewing-account-address
:<- [:wallet]
:-> :current-viewing-account-address)
(rf/reg-sub
:wallet/accounts-without-current-viewing-account
:<- [:wallet/accounts]
@ -122,3 +149,11 @@
:<- [:chain-id]
(fn [[current-account chain-id]]
(mapv #(calc-token-value % chain-id) (:tokens current-account))))
(rf/reg-sub
:wallet/network-preference-details
:<- [:wallet/current-viewing-account]
:<- [:wallet/network-details]
(fn [[current-viewing-account network-details]]
(let [network-preferences-names (:network-preferences-names current-viewing-account)]
(filter #(contains? network-preferences-names (:network-name %)) network-details))))

245
src/status_im2/subs/wallet/wallet_test.cljs
View File

@ -82,6 +82,33 @@
:removed false
:tokens tokens-0x2}})
(def network-data
{:test [{:test? true
:short-name "eth"
:network-name :ethereum
:related-chain-id 1
:layer 1}
{:test? true
:short-name "arb1"
:related-chain-id 42161
:layer 2}
{:test? true
:short-name "opt"
:related-chain-id 10
:layer 2}]
:prod [{:test? false
:short-name "eth"
:chain-id 1
:layer 1}
{:test? false
:short-name "arb1"
:chain-id 42161
:layer 2}
{:test? false
:short-name "opt"
:chain-id 10
:layer 2}]})
(h/deftest-sub :wallet/balances
[sub-name]
(testing "a map: address->balance"
@ -96,86 +123,96 @@
(h/deftest-sub :wallet/accounts
[sub-name]
(testing "returns all accounts without balance"
(swap! rf-db/app-db #(assoc-in % [:wallet :accounts] accounts))
(swap! rf-db/app-db
#(-> %
(assoc-in [:wallet :accounts] accounts)
(assoc :wallet/networks network-data)))
(is
(= (list {:path "m/44'/60'/0'/0/0"
:emoji "😃"
:key-uid "0x2f5ea39"
:address "0x1"
:wallet false
:name "Account One"
:type :generated
:chat false
:test-preferred-chain-ids #{5 420 421613}
:color :blue
:hidden false
:prod-preferred-chain-ids #{1 10 42161}
:position 0
:clock 1698945829328
:created-at 1698928839000
:operable "fully"
:mixedcase-address "0x7bcDfc75c431"
:public-key "0x04371e2d9d66b82f056bc128064"
:removed false
:tokens tokens-0x1}
{:path "m/44'/60'/0'/0/1"
:emoji "💎"
:key-uid "0x2f5ea39"
:address "0x2"
:wallet false
:name "Account Two"
:type :generated
:chat false
:test-preferred-chain-ids #{5 420 421613}
:color :purple
:hidden false
:prod-preferred-chain-ids #{1 10 42161}
:position 1
:clock 1698945829328
:created-at 1698928839000
:operable "fully"
:mixedcase-address "0x7bcDfc75c431"
:public-key "0x04371e2d9d66b82f056bc128064"
:removed false
:tokens tokens-0x2})
(= (list {:path "m/44'/60'/0'/0/0"
:emoji "😃"
:key-uid "0x2f5ea39"
:address "0x1"
:wallet false
:name "Account One"
:type :generated
:chat false
:test-preferred-chain-ids #{5 420 421613}
:color :blue
:hidden false
:prod-preferred-chain-ids #{1 10 42161}
:network-preferences-names #{:ethereum :arbitrum :optimism}
:position 0
:clock 1698945829328
:created-at 1698928839000
:operable "fully"
:mixedcase-address "0x7bcDfc75c431"
:public-key "0x04371e2d9d66b82f056bc128064"
:removed false
:tokens tokens-0x1}
{:path "m/44'/60'/0'/0/1"
:emoji "💎"
:key-uid "0x2f5ea39"
:address "0x2"
:wallet false
:name "Account Two"
:type :generated
:chat false
:test-preferred-chain-ids #{5 420 421613}
:color :purple
:hidden false
:prod-preferred-chain-ids #{1 10 42161}
:network-preferences-names #{:ethereum :arbitrum :optimism}
:position 1
:clock 1698945829328
:created-at 1698928839000
:operable "fully"
:mixedcase-address "0x7bcDfc75c431"
:public-key "0x04371e2d9d66b82f056bc128064"
:removed false
:tokens tokens-0x2})
(rf/sub [sub-name])))))
(h/deftest-sub :wallet/current-viewing-account-address
[sub-name]
(testing "returns current viewing account address"
(swap! rf-db/app-db #(assoc-in % [:wallet :current-viewing-account-address] "0x1"))
(is (= "0x1" (rf/sub [sub-name])))))
(h/deftest-sub :wallet/current-viewing-account
[sub-name]
(testing "returns current account with balance base"
(swap! rf-db/app-db
#(-> %
(assoc-in [:wallet :accounts] accounts)
(assoc-in [:wallet :current-viewing-account-address] "0x1")))
(assoc-in [:wallet :current-viewing-account-address] "0x1")
(assoc :wallet/networks network-data)))
(let [result (rf/sub [sub-name])]
(is
(= {:path "m/44'/60'/0'/0/0"
:emoji "😃"
:key-uid "0x2f5ea39"
:address "0x1"
:wallet false
:name "Account One"
:type :generated
:chat false
:test-preferred-chain-ids #{5 420 421613}
:color :blue
:hidden false
:prod-preferred-chain-ids #{1 10 42161}
:position 0
:clock 1698945829328
:created-at 1698928839000
:operable "fully"
:mixedcase-address "0x7bcDfc75c431"
:public-key "0x04371e2d9d66b82f056bc128064"
:removed false
:tokens tokens-0x1}
(= {:path "m/44'/60'/0'/0/0"
:emoji "😃"
:key-uid "0x2f5ea39"
:address "0x1"
:wallet false
:name "Account One"
:type :generated
:chat false
:test-preferred-chain-ids #{5 420 421613}
:color :blue
:hidden false
:prod-preferred-chain-ids #{1 10 42161}
:network-preferences-names #{:ethereum :arbitrum :optimism}
:position 0
:clock 1698945829328
:created-at 1698928839000
:operable "fully"
:mixedcase-address "0x7bcDfc75c431"
:public-key "0x04371e2d9d66b82f056bc128064"
:removed false
:tokens tokens-0x1}
(dissoc result :balance)))
(is (money/equal-to (:balance result) (money/bignumber 3250))))))
(h/deftest-sub :wallet/addresses
[sub-name]
(testing "returns all addresses"
@ -201,39 +238,63 @@
(swap! rf-db/app-db #(assoc-in % [:wallet :ui :watch-address-activity-state] :has-activity))
(is (= :has-activity (rf/sub [sub-name])))))
(h/deftest-sub :wallet/current-viewing-account-address
[sub-name]
(testing "returns the address of the current viewing account"
(swap! rf-db/app-db #(assoc-in % [:wallet :current-viewing-account-address] "0x1"))
(is (= "0x1" (rf/sub [sub-name])))))
(h/deftest-sub :wallet/accounts-without-current-viewing-account
[sub-name]
(testing "returns the accounts list without the current viewing account in it"
(swap! rf-db/app-db
#(-> %
(assoc-in [:wallet :accounts] accounts)
(assoc-in [:wallet :current-viewing-account-address] "0x2")))
(assoc-in [:wallet :current-viewing-account-address] "0x2")
(assoc :wallet/networks network-data)))
(is
(= (list
{:path "m/44'/60'/0'/0/0"
:emoji "😃"
:key-uid "0x2f5ea39"
:address "0x1"
:wallet false
:name "Account One"
:type :generated
:chat false
:test-preferred-chain-ids #{5 420 421613}
:color :blue
:hidden false
:prod-preferred-chain-ids #{1 10 42161}
:position 0
:clock 1698945829328
:created-at 1698928839000
:operable "fully"
:mixedcase-address "0x7bcDfc75c431"
:public-key "0x04371e2d9d66b82f056bc128064"
:removed false
:tokens tokens-0x1})
{:path "m/44'/60'/0'/0/0"
:emoji "😃"
:key-uid "0x2f5ea39"
:address "0x1"
:wallet false
:name "Account One"
:type :generated
:chat false
:test-preferred-chain-ids #{5 420 421613}
:color :blue
:hidden false
:prod-preferred-chain-ids #{1 10 42161}
:network-preferences-names #{:ethereum :arbitrum :optimism}
:position 0
:clock 1698945829328
:created-at 1698928839000
:operable "fully"
:mixedcase-address "0x7bcDfc75c431"
:public-key "0x04371e2d9d66b82f056bc128064"
:removed false
:tokens tokens-0x1})
(rf/sub [sub-name])))))
(h/deftest-sub :wallet/network-preference-details
[sub-name]
(testing "returns current viewing account address"
(swap! rf-db/app-db
#(-> %
(assoc-in [:wallet :accounts] accounts)
(assoc-in [:wallet :current-viewing-account-address] "0x1")
(assoc :wallet/networks network-data)))
(is
(= [{:short-name "eth"
:network-name :ethereum
:chain-id 1
:related-chain-id nil
:layer 1}
{:short-name "arb1"
:network-name :arbitrum
:chain-id 42161
:related-chain-id nil
:layer 2}
{:short-name "opt"
:network-name :optimism
:chain-id 10
:related-chain-id nil
:layer 2}]
(->> (rf/sub [sub-name])
;; Removed `#js source` property for correct compare
(map #(dissoc % :source)))))))

3
translations/en.json
View File

@ -2375,7 +2375,7 @@
"account-info": "Account info",
"account-name-input-placeholder": "Account name",
"network-preferences": "Network preferences",
"network-preferences-desc": "Select which network this address is happy to receive funds on",
"network-preferences-desc": "Select which networks to receive funds on",
"layer-2": "Layer 2",
"manage-tokens": "Manage tokens",
"edit-derivation-path": "Edit derivation path",
@ -2389,6 +2389,7 @@
"edit-wallet-account-emoji-updated-message": "Account emoji has been updated",
"edit-wallet-account-name-updated-message": "Account name has been updated",
"edit-wallet-account-colour-updated-message": "Account colour has been updated",
"edit-wallet-network-preferences-updated-message": "Account network preferences has been updated",
"search-assets": "Search assets",
"address-activity": "This address has activity",
"keypairs": "Keypairs",