chore(wallet): add flow for selecting own accounts in send flows (#18071)
This commit is contained in:
parent
7564113cb5
commit
457c42c5f0
|
@ -0,0 +1,12 @@
|
|||
(ns status-im2.contexts.wallet.send.events
|
||||
(:require
|
||||
[utils.number]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(rf/reg-event-fx :wallet/select-address-tab
|
||||
(fn [{:keys [db]} [tab]]
|
||||
{:db (assoc-in db [:wallet :ui :send :select-address-tab] tab)}))
|
||||
|
||||
(rf/reg-event-fx :wallet/select-send-account-address
|
||||
(fn [{:keys [db]} [address]]
|
||||
{:db (assoc db [:wallet :ui :send :send-account-address] address)}))
|
|
@ -15,11 +15,6 @@
|
|||
{:padding-left 20
|
||||
:padding-right 8})
|
||||
|
||||
(def empty-container-style
|
||||
{:justify-content :center
|
||||
:flex 1
|
||||
:margin-bottom 44})
|
||||
|
||||
(def button
|
||||
{:justify-self :flex-end
|
||||
:margin-bottom 46
|
||||
|
|
|
@ -0,0 +1,10 @@
|
|||
(ns status-im2.contexts.wallet.send.select-address.tabs.style)
|
||||
|
||||
(def empty-container-style
|
||||
{:justify-content :center
|
||||
:flex 1
|
||||
:margin-bottom 44})
|
||||
|
||||
(def my-accounts-container
|
||||
{:padding-left 8
|
||||
:padding-right 8})
|
|
@ -0,0 +1,57 @@
|
|||
(ns status-im2.contexts.wallet.send.select-address.tabs.view
|
||||
(:require
|
||||
[quo.core :as quo]
|
||||
[react-native.gesture :as gesture]
|
||||
[status-im2.contexts.wallet.send.select-address.tabs.style :as style]
|
||||
[utils.i18n :as i18n]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(defn- render-account-item
|
||||
[{:keys [color address] :as account}]
|
||||
[quo/account-item
|
||||
{:account-props (assoc account :customization-color color)
|
||||
:on-press (fn []
|
||||
(rf/dispatch [:wallet/select-send-account-address address])
|
||||
(rf/dispatch [:navigate-to-within-stack
|
||||
[:wallet-select-asset :wallet-select-address]]))}])
|
||||
|
||||
(def data
|
||||
[{:id :tab/recent :label (i18n/label :t/recent) :accessibility-label :recent-tab}
|
||||
{:id :tab/saved :label (i18n/label :t/saved) :accessibility-label :saved-tab}
|
||||
{:id :tab/contacts :label (i18n/label :t/contacts) :accessibility-label :contacts-tab}
|
||||
{:id :tab/my-accounts :label (i18n/label :t/my-accounts) :accessibility-label :my-accounts-tab}])
|
||||
|
||||
(defn my-accounts
|
||||
[]
|
||||
(let [other-accounts (rf/sub [:wallet/accounts-without-current-viewing-account])]
|
||||
(if (zero? (count other-accounts))
|
||||
[quo/empty-state
|
||||
{:title (i18n/label :t/no-other-accounts)
|
||||
:description (i18n/label :t/here-is-a-cat-in-a-box-instead)
|
||||
:placeholder? true
|
||||
:container-style style/empty-container-style}]
|
||||
[gesture/flat-list
|
||||
{:data other-accounts
|
||||
:render-fn render-account-item
|
||||
:content-container-style style/my-accounts-container
|
||||
:shows-vertical-scroll-indicator false}])))
|
||||
|
||||
(defn view
|
||||
[selected-tab]
|
||||
(case selected-tab
|
||||
:tab/recent [quo/empty-state
|
||||
{:title (i18n/label :t/no-recent-transactions)
|
||||
:description (i18n/label :t/make-one-it-is-easy-we-promise)
|
||||
:placeholder? true
|
||||
:container-style style/empty-container-style}]
|
||||
:tab/saved [quo/empty-state
|
||||
{:title (i18n/label :t/no-saved-addresses)
|
||||
:description (i18n/label :t/you-like-to-type-43-characters)
|
||||
:placeholder? true
|
||||
:container-style style/empty-container-style}]
|
||||
:tab/contacts [quo/empty-state
|
||||
{:title (i18n/label :t/no-contacts)
|
||||
:description (i18n/label :t/no-contacts-description)
|
||||
:placeholder? true
|
||||
:container-style style/empty-container-style}]
|
||||
:tab/my-accounts [my-accounts]))
|
|
@ -2,47 +2,23 @@
|
|||
(:require
|
||||
[quo.core :as quo]
|
||||
[quo.foundations.colors :as colors]
|
||||
[quo.theme :as quo.theme]
|
||||
[react-native.core :as rn]
|
||||
[reagent.core :as reagent]
|
||||
[status-im2.constants :as constants]
|
||||
[status-im2.contexts.wallet.common.account-switcher.view :as account-switcher]
|
||||
[status-im2.contexts.wallet.item-types :as types]
|
||||
[status-im2.contexts.wallet.send.select-address.style :as style]
|
||||
[status-im2.contexts.wallet.send.select-address.tabs.view :as tabs]
|
||||
[utils.debounce :as debounce]
|
||||
[utils.i18n :as i18n]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(def tabs-data
|
||||
(def ^:private tabs-data
|
||||
[{:id :tab/recent :label (i18n/label :t/recent) :accessibility-label :recent-tab}
|
||||
{:id :tab/saved :label (i18n/label :t/saved) :accessibility-label :saved-tab}
|
||||
{:id :tab/contacts :label (i18n/label :t/contacts) :accessibility-label :contacts-tab}
|
||||
{:id :tab/my-accounts :label (i18n/label :t/my-accounts) :accessibility-label :my-accounts-tab}])
|
||||
|
||||
(defn- tab-view
|
||||
[selected-tab]
|
||||
(case selected-tab
|
||||
:tab/recent [quo/empty-state
|
||||
{:title (i18n/label :t/no-recent-transactions)
|
||||
:description (i18n/label :t/make-one-it-is-easy-we-promise)
|
||||
:placeholder? true
|
||||
:container-style style/empty-container-style}]
|
||||
:tab/saved [quo/empty-state
|
||||
{:title (i18n/label :t/no-saved-addresses)
|
||||
:description (i18n/label :t/you-like-to-type-43-characters)
|
||||
:placeholder? true
|
||||
:container-style style/empty-container-style}]
|
||||
:tab/contacts [quo/empty-state
|
||||
{:title (i18n/label :t/no-contacts)
|
||||
:description (i18n/label :t/no-contacts-description)
|
||||
:placeholder? true
|
||||
:container-style style/empty-container-style}]
|
||||
:tab/my-accounts [quo/empty-state
|
||||
{:title (i18n/label :t/no-other-accounts)
|
||||
:description (i18n/label :t/here-is-a-cat-in-a-box-instead)
|
||||
:placeholder? true
|
||||
:container-style style/empty-container-style}]))
|
||||
|
||||
(defn- address-input
|
||||
[input-value input-focused?]
|
||||
(fn []
|
||||
|
@ -131,18 +107,19 @@
|
|||
:keyboard-should-persist-taps :handled
|
||||
:render-fn suggestion-component}]])))
|
||||
|
||||
(defn- f-view-internal
|
||||
(defn- f-view
|
||||
[]
|
||||
(let [selected-tab (reagent/atom (:id (first tabs-data)))
|
||||
on-close (fn []
|
||||
(let [on-close (fn []
|
||||
(rf/dispatch [:wallet/clean-scanned-address])
|
||||
(rf/dispatch [:wallet/clean-local-suggestions])
|
||||
(rf/dispatch [:wallet/select-address-tab nil])
|
||||
(rf/dispatch [:navigate-back]))
|
||||
on-change-tab #(reset! selected-tab %)
|
||||
on-change-tab #(rf/dispatch [:wallet/select-address-tab %])
|
||||
input-value (reagent/atom "")
|
||||
input-focused? (reagent/atom false)]
|
||||
(fn []
|
||||
(let [valid-ens-or-address? (boolean (rf/sub [:wallet/valid-ens-or-address?]))]
|
||||
(let [selected-tab (or (rf/sub [:wallet/send-tab]) (:id (first tabs-data)))
|
||||
valid-ens-or-address? (boolean (rf/sub [:wallet/valid-ens-or-address?]))]
|
||||
(rn/use-effect (fn []
|
||||
(fn []
|
||||
(rf/dispatch [:wallet/clean-scanned-address])
|
||||
|
@ -179,15 +156,14 @@
|
|||
{:style style/tabs
|
||||
:container-style style/tabs-content
|
||||
:size 32
|
||||
:default-active @selected-tab
|
||||
:default-active selected-tab
|
||||
:data tabs-data
|
||||
:scrollable? true
|
||||
:scroll-on-press? true
|
||||
:on-change on-change-tab}]
|
||||
[tab-view @selected-tab]])]))))
|
||||
[tabs/view selected-tab]])]))))
|
||||
|
||||
(defn- view-internal
|
||||
(defn view
|
||||
[]
|
||||
[:f> f-view-internal])
|
||||
[:f> f-view])
|
||||
|
||||
(def view (quo.theme/with-theme view-internal))
|
||||
|
|
|
@ -22,6 +22,7 @@
|
|||
status-im2.contexts.shell.share.events
|
||||
status-im2.contexts.syncing.events
|
||||
status-im2.contexts.wallet.events
|
||||
status-im2.contexts.wallet.send.events
|
||||
[status-im2.db :as db]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
status-im2.subs.shell
|
||||
status-im2.subs.wallet.collectibles
|
||||
status-im2.subs.wallet.networks
|
||||
status-im2.subs.wallet.send
|
||||
status-im2.subs.wallet.wallet))
|
||||
|
||||
(defn reg-root-key-sub
|
||||
|
|
|
@ -0,0 +1,10 @@
|
|||
(ns status-im2.subs.wallet.send
|
||||
(:require
|
||||
[re-frame.core :as rf]
|
||||
[utils.number]))
|
||||
|
||||
(rf/reg-sub
|
||||
:wallet/send-tab
|
||||
:<- [:wallet/ui]
|
||||
(fn [ui]
|
||||
(get-in ui [:send :select-address-tab])))
|
|
@ -0,0 +1,14 @@
|
|||
(ns status-im2.subs.wallet.send-test
|
||||
(:require
|
||||
[cljs.test :refer [is testing]]
|
||||
[re-frame.db :as rf-db]
|
||||
status-im2.subs.root
|
||||
status-im2.subs.wallet.send
|
||||
[test-helpers.unit :as h]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(h/deftest-sub :wallet/send-tab
|
||||
[sub-name]
|
||||
(testing "returns active tab for selecting address"
|
||||
(swap! rf-db/app-db assoc-in [:wallet :ui :send :select-address-tab] :tabs/recent)
|
||||
(is (= :tabs/recent (rf/sub [sub-name])))))
|
|
@ -220,7 +220,6 @@
|
|||
#(-> %
|
||||
(assoc-in [:wallet :accounts] accounts)
|
||||
(assoc-in [:wallet :current-viewing-account-address] "0x1")))
|
||||
|
||||
(is
|
||||
(= (set ["0x1" "0x2"])
|
||||
(rf/sub [sub-name])))))
|
||||
|
|
Loading…
Reference in New Issue