feat(wallet): add ability to send a token (#18242)
This commit is contained in:
parent
4edb14bb5f
commit
947a1ef29c
|
@ -37,13 +37,14 @@
|
||||||
(def ^:private b64-png-image-prefix "data:image/png;base64,")
|
(def ^:private b64-png-image-prefix "data:image/png;base64,")
|
||||||
|
|
||||||
(defn temp-empty-symbol
|
(defn temp-empty-symbol
|
||||||
[token size]
|
[token size style]
|
||||||
[rn/view
|
[rn/view
|
||||||
{:style (token-style {:justify-content :center
|
{:style (token-style (merge {:justify-content :center
|
||||||
:align-items :center
|
:align-items :center
|
||||||
:border-radius 20
|
:border-radius 20
|
||||||
:border-width 1
|
:border-width 1
|
||||||
:border-color :grey}
|
:border-color :grey}
|
||||||
|
style)
|
||||||
size)}
|
size)}
|
||||||
[quo/text {:style {:color :grey}}
|
[quo/text {:style {:color :grey}}
|
||||||
(some-> token
|
(some-> token
|
||||||
|
@ -73,6 +74,6 @@
|
||||||
[rn/image
|
[rn/image
|
||||||
{:style (token-style style size)
|
{:style (token-style style size)
|
||||||
:source source}]
|
:source source}]
|
||||||
[temp-empty-symbol token size])))
|
[temp-empty-symbol token size style])))
|
||||||
|
|
||||||
(def view (schema/instrument #'view-internal ?schema))
|
(def view (schema/instrument #'view-internal ?schema))
|
||||||
|
|
|
@ -2,6 +2,7 @@
|
||||||
(:require
|
(:require
|
||||||
[quo.components.avatars.account-avatar.view :as account-avatar]
|
[quo.components.avatars.account-avatar.view :as account-avatar]
|
||||||
[quo.components.avatars.user-avatar.view :as user-avatar]
|
[quo.components.avatars.user-avatar.view :as user-avatar]
|
||||||
|
[quo.components.avatars.wallet-user-avatar.view :as wallet-user-avatar]
|
||||||
[quo.components.markdown.text :as text]
|
[quo.components.markdown.text :as text]
|
||||||
[quo.components.wallet.summary-info.style :as style]
|
[quo.components.wallet.summary-info.style :as style]
|
||||||
[quo.foundations.colors :as colors]
|
[quo.foundations.colors :as colors]
|
||||||
|
@ -26,24 +27,29 @@
|
||||||
|
|
||||||
(defn networks
|
(defn networks
|
||||||
[values theme]
|
[values theme]
|
||||||
(let [{:keys [ethereum optimism arbitrum]} values]
|
(let [{:keys [ethereum optimism arbitrum]} values
|
||||||
|
show-optimism? (pos? optimism)
|
||||||
|
show-arbitrum? (pos? arbitrum)]
|
||||||
[rn/view
|
[rn/view
|
||||||
{:style style/networks-container
|
{:style style/networks-container
|
||||||
:accessibility-label :networks}
|
:accessibility-label :networks}
|
||||||
[network-amount
|
(when (pos? ethereum)
|
||||||
{:network :ethereum
|
[network-amount
|
||||||
:amount (str ethereum " ETH")
|
{:network :ethereum
|
||||||
:divider? true
|
:amount (str ethereum " ETH")
|
||||||
:theme theme}]
|
:divider? (or show-arbitrum? show-optimism?)
|
||||||
[network-amount
|
:theme theme}])
|
||||||
{:network :optimism
|
(when show-optimism?
|
||||||
:amount (str optimism " ETH")
|
[network-amount
|
||||||
:divider? true
|
{:network :optimism
|
||||||
:theme theme}]
|
:amount (str optimism " OPT")
|
||||||
[network-amount
|
:divider? show-arbitrum?
|
||||||
{:network :arbitrum
|
:theme theme}])
|
||||||
:amount (str arbitrum " ETH")
|
(when show-arbitrum?
|
||||||
:theme theme}]]))
|
[network-amount
|
||||||
|
{:network :arbitrum
|
||||||
|
:amount (str arbitrum " ARB")
|
||||||
|
:theme theme}])]))
|
||||||
|
|
||||||
(defn- view-internal
|
(defn- view-internal
|
||||||
[{:keys [theme type account-props networks? values]}]
|
[{:keys [theme type account-props networks? values]}]
|
||||||
|
@ -51,8 +57,13 @@
|
||||||
{:style (style/container networks? theme)}
|
{:style (style/container networks? theme)}
|
||||||
[rn/view
|
[rn/view
|
||||||
{:style style/info-container}
|
{:style style/info-container}
|
||||||
(if (= type :status-account)
|
(case type
|
||||||
[account-avatar/view account-props]
|
:status-account [account-avatar/view account-props]
|
||||||
|
:saved-account [wallet-user-avatar/wallet-user-avatar (assoc account-props :size :size-32)]
|
||||||
|
:account [wallet-user-avatar/wallet-user-avatar
|
||||||
|
(assoc account-props
|
||||||
|
:size :size-32
|
||||||
|
:neutral? true)]
|
||||||
[user-avatar/user-avatar account-props])
|
[user-avatar/user-avatar account-props])
|
||||||
[rn/view {:style {:margin-left 8}}
|
[rn/view {:style {:margin-left 8}}
|
||||||
(when (not= type :account) [text/text {:weight :semi-bold} (:name account-props)])
|
(when (not= type :account) [text/text {:weight :semi-bold} (:name account-props)])
|
||||||
|
|
|
@ -25,11 +25,11 @@
|
||||||
size
|
size
|
||||||
theme
|
theme
|
||||||
blur?
|
blur?
|
||||||
container-style]}]
|
container-style]
|
||||||
[rn/view {:style {:flex 1}}
|
:or {container-style {:flex 1}}}]
|
||||||
|
[rn/view {:style container-style}
|
||||||
[quo/slide-button
|
[quo/slide-button
|
||||||
{:size size
|
{:size size
|
||||||
:container-style container-style
|
|
||||||
:customization-color customization-color
|
:customization-color customization-color
|
||||||
:on-reset (when @reset-slider? #(reset! reset-slider? false))
|
:on-reset (when @reset-slider? #(reset! reset-slider? false))
|
||||||
:on-complete #(authorize/authorize {:on-close on-close
|
:on-complete #(authorize/authorize {:on-close on-close
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
(ns status-im.common.data-store.wallet
|
(ns status-im.contexts.wallet.data-store
|
||||||
(:require
|
(:require
|
||||||
[clojure.set :as set]
|
[clojure.set :as set]
|
||||||
[clojure.string :as string]
|
[clojure.string :as string]
|
|
@ -4,7 +4,7 @@
|
||||||
[camel-snake-kebab.extras :as cske]
|
[camel-snake-kebab.extras :as cske]
|
||||||
[clojure.string :as string]
|
[clojure.string :as string]
|
||||||
[react-native.background-timer :as background-timer]
|
[react-native.background-timer :as background-timer]
|
||||||
[status-im.common.data-store.wallet :as data-store]
|
[status-im.contexts.wallet.data-store :as data-store]
|
||||||
[status-im.contexts.wallet.events.collectibles]
|
[status-im.contexts.wallet.events.collectibles]
|
||||||
[status-im.contexts.wallet.item-types :as item-types]
|
[status-im.contexts.wallet.item-types :as item-types]
|
||||||
[status-im.contexts.wallet.temp :as temp]
|
[status-im.contexts.wallet.temp :as temp]
|
||||||
|
|
|
@ -1,6 +1,9 @@
|
||||||
(ns status-im.contexts.wallet.send.events
|
(ns status-im.contexts.wallet.send.events
|
||||||
(:require
|
(:require
|
||||||
|
[camel-snake-kebab.core :as csk]
|
||||||
|
[camel-snake-kebab.extras :as cske]
|
||||||
[status-im.constants :as constants]
|
[status-im.constants :as constants]
|
||||||
|
[status-im.contexts.wallet.send.utils :as send-utils]
|
||||||
[taoensso.timbre :as log]
|
[taoensso.timbre :as log]
|
||||||
[utils.money :as money]
|
[utils.money :as money]
|
||||||
[utils.number]
|
[utils.number]
|
||||||
|
@ -8,6 +11,7 @@
|
||||||
|
|
||||||
(rf/reg-event-fx :wallet/select-address-tab
|
(rf/reg-event-fx :wallet/select-address-tab
|
||||||
(fn [{:keys [db]} [tab]]
|
(fn [{:keys [db]} [tab]]
|
||||||
|
|
||||||
{:db (assoc-in db [:wallet :ui :send :select-address-tab] tab)}))
|
{:db (assoc-in db [:wallet :ui :send :select-address-tab] tab)}))
|
||||||
|
|
||||||
(rf/reg-event-fx :wallet/select-send-account-address
|
(rf/reg-event-fx :wallet/select-send-account-address
|
||||||
|
@ -17,10 +21,14 @@
|
||||||
(rf/reg-event-fx :wallet/suggested-routes-success
|
(rf/reg-event-fx :wallet/suggested-routes-success
|
||||||
(fn [{:keys [db]} [suggested-routes timestamp]]
|
(fn [{:keys [db]} [suggested-routes timestamp]]
|
||||||
(when (= (get-in db [:wallet :ui :send :suggested-routes-call-timestamp]) timestamp)
|
(when (= (get-in db [:wallet :ui :send :suggested-routes-call-timestamp]) timestamp)
|
||||||
{:db (-> db
|
(let [suggested-routes-data (cske/transform-keys csk/->kebab-case suggested-routes)
|
||||||
(assoc-in [:wallet :ui :send :suggested-routes] suggested-routes)
|
chosen-route (->> suggested-routes-data
|
||||||
(assoc-in [:wallet :ui :send :route] (first (:Best suggested-routes)))
|
:best
|
||||||
(assoc-in [:wallet :ui :send :loading-suggested-routes?] false))})))
|
first)]
|
||||||
|
{:db (-> db
|
||||||
|
(assoc-in [:wallet :ui :send :suggested-routes] suggested-routes-data)
|
||||||
|
(assoc-in [:wallet :ui :send :route] chosen-route)
|
||||||
|
(assoc-in [:wallet :ui :send :loading-suggested-routes?] false))}))))
|
||||||
|
|
||||||
(rf/reg-event-fx :wallet/suggested-routes-error
|
(rf/reg-event-fx :wallet/suggested-routes-error
|
||||||
(fn [{:keys [db]} [_error]]
|
(fn [{:keys [db]} [_error]]
|
||||||
|
@ -47,8 +55,9 @@
|
||||||
:fx [[:navigate-to-within-stack [:wallet-send-input-amount stack-id]]]}))
|
:fx [[:navigate-to-within-stack [:wallet-send-input-amount stack-id]]]}))
|
||||||
|
|
||||||
(rf/reg-event-fx :wallet/send-select-amount
|
(rf/reg-event-fx :wallet/send-select-amount
|
||||||
(fn [{:keys [db]} [{:keys [amount]}]]
|
(fn [{:keys [db]} [{:keys [amount stack-id]}]]
|
||||||
{:db (assoc-in db [:wallet :ui :send :amount] amount)}))
|
{:db (assoc-in db [:wallet :ui :send :amount] amount)
|
||||||
|
:fx [[:navigate-to-within-stack [:wallet-transaction-confirmation stack-id]]]}))
|
||||||
|
|
||||||
(rf/reg-event-fx :wallet/get-suggested-routes
|
(rf/reg-event-fx :wallet/get-suggested-routes
|
||||||
(fn [{:keys [db now]} [amount]]
|
(fn [{:keys [db now]} [amount]]
|
||||||
|
@ -59,7 +68,7 @@
|
||||||
token-id (:symbol token)
|
token-id (:symbol token)
|
||||||
network-preferences []
|
network-preferences []
|
||||||
gas-rates constants/gas-rate-medium
|
gas-rates constants/gas-rate-medium
|
||||||
amount-in (money/amount-in-hex amount token-decimal)
|
amount-in (send-utils/amount-in-hex amount token-decimal)
|
||||||
from-address wallet-address
|
from-address wallet-address
|
||||||
disabled-from-chain-ids []
|
disabled-from-chain-ids []
|
||||||
disabled-to-chain-ids []
|
disabled-to-chain-ids []
|
||||||
|
@ -88,3 +97,69 @@
|
||||||
{:event :wallet/get-suggested-routes
|
{:event :wallet/get-suggested-routes
|
||||||
:error error
|
:error error
|
||||||
:params request-params}))}]})))
|
:params request-params}))}]})))
|
||||||
|
|
||||||
|
(rf/reg-event-fx :wallet/add-authorized-transaction
|
||||||
|
(fn [{:keys [db]} [transaction]]
|
||||||
|
(let [transaction-hashes (:hashes transaction)
|
||||||
|
chain-id (key (first transaction-hashes))
|
||||||
|
tx-id (first (val (first transaction-hashes)))
|
||||||
|
transaction-detes {:status :pending
|
||||||
|
:id (:id transaction)
|
||||||
|
:chain-id chain-id}]
|
||||||
|
{:db (assoc-in db [:wallet :transactions tx-id] transaction-detes)
|
||||||
|
:fx [[:dispatch [:navigate-to :wallet-transaction-progress]]]})))
|
||||||
|
|
||||||
|
(defn- transaction-bridge
|
||||||
|
[{:keys [from-address to-address route]}]
|
||||||
|
(let [{:keys [from bridge-name amount-out gas-amount gas-fees]} route
|
||||||
|
{:keys [gas-price max-fee-per-gas-medium max-priority-fee-per-gas]} gas-fees]
|
||||||
|
[{:BridgeName bridge-name
|
||||||
|
:ChainID (:chain-id from)
|
||||||
|
:TransferTx {:From from-address
|
||||||
|
:To to-address
|
||||||
|
:Gas (money/to-hex gas-amount)
|
||||||
|
:GasPrice (money/to-hex (money/->wei :gwei gas-price))
|
||||||
|
:Value amount-out
|
||||||
|
:Nonce nil
|
||||||
|
:MaxFeePerGas (money/to-hex (money/->wei :gwei max-fee-per-gas-medium))
|
||||||
|
:MaxPriorityFeePerGas (money/to-hex (money/->wei :gwei max-priority-fee-per-gas))
|
||||||
|
:Input ""
|
||||||
|
:Data "0x"}}]))
|
||||||
|
|
||||||
|
(defn- multi-transaction-command
|
||||||
|
[{:keys [from-address to-address from-asset to-asset amount-out transfer-type]
|
||||||
|
:or {transfer-type constants/send-type-transfer}}]
|
||||||
|
{:fromAddress from-address
|
||||||
|
:toAddress to-address
|
||||||
|
:fromAsset from-asset
|
||||||
|
:toAsset to-asset
|
||||||
|
:fromAmount amount-out
|
||||||
|
:type transfer-type})
|
||||||
|
|
||||||
|
(rf/reg-event-fx :wallet/send-transaction
|
||||||
|
(fn [{:keys [db]} [sha3-pwd]]
|
||||||
|
(let [route (get-in db [:wallet :ui :send :route])
|
||||||
|
from-address (get-in db [:wallet :current-viewing-account-address])
|
||||||
|
to-address (get-in db [:wallet :ui :send :to-address])
|
||||||
|
token (get-in db [:wallet :ui :send :token])
|
||||||
|
token-id (:symbol token)
|
||||||
|
request-params [(multi-transaction-command {:from-address from-address
|
||||||
|
:to-address to-address
|
||||||
|
:from-asset token-id
|
||||||
|
:to-asset token-id
|
||||||
|
:amount-out (:amount-out route)})
|
||||||
|
(transaction-bridge {:to-address to-address
|
||||||
|
:from-address from-address
|
||||||
|
:route route})
|
||||||
|
sha3-pwd]]
|
||||||
|
{:json-rpc/call [{:method "wallet_createMultiTransaction"
|
||||||
|
:params request-params
|
||||||
|
:on-success (fn [result]
|
||||||
|
(rf/dispatch [:hide-bottom-sheet])
|
||||||
|
(rf/dispatch [:wallet/add-authorized-transaction result]))
|
||||||
|
:on-error (fn [error]
|
||||||
|
(log/error "failed to send transaction"
|
||||||
|
{:event :wallet/send-transaction
|
||||||
|
:error error
|
||||||
|
:params request-params}))}]})))
|
||||||
|
|
||||||
|
|
|
@ -1,13 +1,9 @@
|
||||||
(ns status-im.contexts.wallet.send.transaction-confirmation.style
|
(ns status-im.contexts.wallet.send.transaction-confirmation.style
|
||||||
(:require [quo.foundations.colors :as colors]))
|
(:require [quo.foundations.colors :as colors]))
|
||||||
|
|
||||||
(defn container
|
(def detail-item
|
||||||
[margin-top]
|
{:flex 1
|
||||||
{:position :absolute
|
:height 36})
|
||||||
:top margin-top
|
|
||||||
:right 0
|
|
||||||
:left 0
|
|
||||||
:bottom 0})
|
|
||||||
|
|
||||||
(def content-container
|
(def content-container
|
||||||
{:padding-top 12
|
{:padding-top 12
|
||||||
|
@ -29,11 +25,9 @@
|
||||||
:border-width 1
|
:border-width 1
|
||||||
:border-color (colors/theme-colors colors/neutral-10 colors/neutral-90 theme)})
|
:border-color (colors/theme-colors colors/neutral-10 colors/neutral-90 theme)})
|
||||||
|
|
||||||
(def slide-button-container
|
(def details-title-container
|
||||||
{:position :absolute
|
{:padding-horizontal 20
|
||||||
:right 20
|
:padding-bottom 16})
|
||||||
:left 20
|
|
||||||
:bottom 20})
|
|
||||||
|
|
||||||
(defn section-label
|
(defn section-label
|
||||||
[theme]
|
[theme]
|
||||||
|
|
|
@ -1,17 +1,18 @@
|
||||||
(ns status-im.contexts.wallet.send.transaction-confirmation.view
|
(ns status-im.contexts.wallet.send.transaction-confirmation.view
|
||||||
(:require
|
(:require
|
||||||
|
[legacy.status-im.utils.utils :as utils]
|
||||||
[quo.core :as quo]
|
[quo.core :as quo]
|
||||||
[quo.theme :as quo.theme]
|
[quo.theme :as quo.theme]
|
||||||
[react-native.core :as rn]
|
[react-native.core :as rn]
|
||||||
[react-native.safe-area :as safe-area]
|
[react-native.safe-area :as safe-area]
|
||||||
[reagent.core :as reagent]
|
[status-im.common.floating-button-page.view :as floating-button-page]
|
||||||
[status-im.common.resources :as resources]
|
[status-im.common.standard-authentication.core :as standard-auth]
|
||||||
[status-im.contexts.wallet.send.transaction-confirmation.style :as style]
|
[status-im.contexts.wallet.send.transaction-confirmation.style :as style]
|
||||||
[utils.i18n :as i18n]
|
[utils.i18n :as i18n]
|
||||||
[utils.re-frame :as rf]))
|
[utils.re-frame :as rf]))
|
||||||
|
|
||||||
(defn- transaction-title
|
(defn- transaction-title
|
||||||
[]
|
[{:keys [token-symbol amount account to-address]}]
|
||||||
[rn/view {:style style/content-container}
|
[rn/view {:style style/content-container}
|
||||||
[rn/view {:style {:flex-direction :row}}
|
[rn/view {:style {:flex-direction :row}}
|
||||||
[quo/text
|
[quo/text
|
||||||
|
@ -21,7 +22,8 @@
|
||||||
:accessibility-label :send-label}
|
:accessibility-label :send-label}
|
||||||
(i18n/label :t/send)]
|
(i18n/label :t/send)]
|
||||||
[quo/summary-tag
|
[quo/summary-tag
|
||||||
{:label "150 ETH"
|
{:token token-symbol
|
||||||
|
:label (str amount " " token-symbol)
|
||||||
:type :token
|
:type :token
|
||||||
:image-source :eth}]]
|
:image-source :eth}]]
|
||||||
[rn/view
|
[rn/view
|
||||||
|
@ -34,10 +36,10 @@
|
||||||
:accessibility-label :send-label}
|
:accessibility-label :send-label}
|
||||||
(i18n/label :t/from)]
|
(i18n/label :t/from)]
|
||||||
[quo/summary-tag
|
[quo/summary-tag
|
||||||
{:label "Collectibles vault"
|
{:label (:name account)
|
||||||
:type :account
|
:type :account
|
||||||
:emoji "🍑"
|
:emoji (:emoji account)
|
||||||
:customization-color :purple}]]
|
:customization-color (:color account)}]]
|
||||||
[rn/view
|
[rn/view
|
||||||
{:style {:flex-direction :row
|
{:style {:flex-direction :row
|
||||||
:margin-top 4}}
|
:margin-top 4}}
|
||||||
|
@ -48,13 +50,11 @@
|
||||||
:accessibility-label :send-label}
|
:accessibility-label :send-label}
|
||||||
(i18n/label :t/to)]
|
(i18n/label :t/to)]
|
||||||
[quo/summary-tag
|
[quo/summary-tag
|
||||||
{:label "Mark Libot"
|
{:type :address
|
||||||
:type :user
|
:label (utils/get-shortened-address to-address)}]]])
|
||||||
:image-source (resources/get-mock-image :user-picture-male4)
|
|
||||||
:customization-color :magenta}]]])
|
|
||||||
|
|
||||||
(defn- transaction-from
|
(defn- user-summary
|
||||||
[status-account-props theme]
|
[{:keys [amount account-props theme label accessibility-label summary-type]}]
|
||||||
[rn/view
|
[rn/view
|
||||||
{:style {:padding-horizontal 20
|
{:style {:padding-horizontal 20
|
||||||
:padding-bottom 16}}
|
:padding-bottom 16}}
|
||||||
|
@ -62,134 +62,134 @@
|
||||||
{:size :paragraph-2
|
{:size :paragraph-2
|
||||||
:weight :medium
|
:weight :medium
|
||||||
:style (style/section-label theme)
|
:style (style/section-label theme)
|
||||||
:accessibility-label :summary-from-label}
|
:accessibility-label accessibility-label}
|
||||||
(i18n/label :t/from-capitalized)]
|
label]
|
||||||
[quo/summary-info
|
[quo/summary-info
|
||||||
{:type :status-account
|
{:type summary-type
|
||||||
:networks? true
|
:networks? true
|
||||||
:values {:ethereum 150
|
:values {:ethereum amount}
|
||||||
:optimism 50
|
:account-props account-props}]])
|
||||||
:arbitrum 25}
|
|
||||||
:account-props status-account-props}]])
|
|
||||||
|
|
||||||
(defn- transaction-to
|
|
||||||
[user-props theme]
|
|
||||||
[rn/view
|
|
||||||
{:style {:padding-horizontal 20
|
|
||||||
:padding-bottom 16}}
|
|
||||||
[quo/text
|
|
||||||
{:size :paragraph-2
|
|
||||||
:weight :medium
|
|
||||||
:style (style/section-label theme)
|
|
||||||
:accessibility-label :summary-from-label}
|
|
||||||
(i18n/label :t/to-capitalized)]
|
|
||||||
[quo/summary-info
|
|
||||||
{:type :user
|
|
||||||
:networks? true
|
|
||||||
:values {:ethereum 150
|
|
||||||
:optimism 50
|
|
||||||
:arbitrum 25}
|
|
||||||
:account-props user-props}]])
|
|
||||||
|
|
||||||
(defn- transaction-details
|
(defn- transaction-details
|
||||||
[theme]
|
[{:keys [estimated-time-min max-fees token amount to-address theme]}]
|
||||||
[rn/view
|
(let [currency-symbol (rf/sub [:profile/currency-symbol])]
|
||||||
{:style {:padding-horizontal 20
|
[rn/view
|
||||||
:padding-bottom 16}}
|
{:style style/details-title-container}
|
||||||
[quo/text
|
[quo/text
|
||||||
{:size :paragraph-2
|
{:size :paragraph-2
|
||||||
:weight :medium
|
:weight :medium
|
||||||
:style (style/section-label theme)
|
:style (style/section-label theme)
|
||||||
:accessibility-label :summary-from-label}
|
:accessibility-label :summary-from-label}
|
||||||
(i18n/label :t/details)]
|
(i18n/label :t/details)]
|
||||||
[rn/view
|
[rn/view
|
||||||
{:style (style/details-container theme)}
|
{:style (style/details-container theme)}
|
||||||
[quo/data-item
|
[quo/data-item
|
||||||
{:container-style {:flex 1
|
{:container-style style/detail-item
|
||||||
:height 36}
|
:blur? false
|
||||||
:blur? false
|
:description :default
|
||||||
:description :default
|
:icon-right? false
|
||||||
:icon-right? false
|
:card? false
|
||||||
:card? false
|
:label :none
|
||||||
:label :none
|
:status :default
|
||||||
:status :default
|
:size :small
|
||||||
:size :small
|
:title (i18n/label :t/est-time)
|
||||||
:title (i18n/label :t/est-time)
|
:subtitle (i18n/label :t/time-in-mins {:minutes (str estimated-time-min)})}]
|
||||||
:subtitle "3-5 min"}]
|
[quo/data-item
|
||||||
[quo/data-item
|
{:container-style style/detail-item
|
||||||
{:container-style {:flex 1
|
:blur? false
|
||||||
:height 36}
|
:description :default
|
||||||
:blur? false
|
:icon-right? false
|
||||||
:description :default
|
:card? false
|
||||||
:icon-right? false
|
:label :none
|
||||||
:card? false
|
:status :default
|
||||||
:label :none
|
:size :small
|
||||||
:status :default
|
:title (i18n/label :t/max-fees)
|
||||||
:size :small
|
:subtitle (i18n/label :t/amount-with-currency-symbol
|
||||||
:title (i18n/label :t/max-fees)
|
{:amount (str max-fees)
|
||||||
:subtitle "€188,70"}]
|
:symbol currency-symbol})}]
|
||||||
[quo/data-item
|
[quo/data-item
|
||||||
{:container-style {:flex 1
|
{:container-style style/detail-item
|
||||||
:height 36}
|
:blur? false
|
||||||
:blur? false
|
:description :default
|
||||||
:description :default
|
:icon-right? false
|
||||||
:icon-right? false
|
:card? false
|
||||||
:card? false
|
:label :none
|
||||||
:label :none
|
:status :default
|
||||||
:status :default
|
:size :small
|
||||||
:size :small
|
:title (i18n/label :t/user-gets {:name (utils/get-shortened-address to-address)})
|
||||||
:title (i18n/label :t/user-gets {:name "Mark"})
|
:subtitle (str amount " " (:symbol token))}]]]))
|
||||||
:subtitle "149.99 ETH"}]]])
|
|
||||||
|
|
||||||
(defn- f-view-internal
|
(defn- view-internal
|
||||||
[_]
|
[_]
|
||||||
(let [reset-slider? (reagent/atom false)
|
(let [on-close #(rf/dispatch [:navigate-back-within-stack :wallet-select-asset])
|
||||||
margin-top (safe-area/get-top)
|
send-transaction-data (rf/sub [:wallet/wallet-send])
|
||||||
biometric-auth? true
|
token (:token send-transaction-data)
|
||||||
on-close #(rf/dispatch [:navigate-back-within-stack :wallet-select-asset])
|
token-symbol (:symbol token)
|
||||||
status-account-props {:customization-color :purple
|
amount (:amount send-transaction-data)
|
||||||
:size 32
|
route (:route send-transaction-data)
|
||||||
:emoji "🍑"
|
estimated-time-min (:estimated-time route)
|
||||||
:type :default
|
max-fees "-"
|
||||||
:name "Collectibles vault"
|
to-address (:to-address send-transaction-data)
|
||||||
:address "0x0ah...78b"}
|
account (rf/sub [:wallet/current-viewing-account])
|
||||||
user-props {:full-name "M L"
|
account-color (:color account)
|
||||||
:status-indicator? false
|
from-account-props {:customization-color account-color
|
||||||
:size :small
|
:size 32
|
||||||
:ring-background (resources/get-mock-image :ring)
|
:emoji (:emoji account)
|
||||||
:customization-color :blue
|
:type :default
|
||||||
:name "Mark Libot"
|
:name (:name account)
|
||||||
:address "0x0ah...78b"
|
:address (utils/get-shortened-address (:address account))}
|
||||||
:status-account (merge status-account-props
|
user-props {:full-name to-address
|
||||||
{:size 16
|
:address (utils/get-shortened-address to-address)}]
|
||||||
:name "New house"
|
(prn route)
|
||||||
:emoji "🍔"})}]
|
|
||||||
(fn [{:keys [theme]}]
|
(fn [{:keys [theme]}]
|
||||||
[rn/view {:style {:flex 1}}
|
[rn/view {:style {:flex 1}}
|
||||||
[quo/gradient-cover {:customization-color :purple}]
|
[floating-button-page/view
|
||||||
[rn/view {:style (style/container margin-top)}
|
{:header [quo/page-nav
|
||||||
[quo/page-nav
|
{:icon-name :i/arrow-left
|
||||||
{:icon-name :i/arrow-left
|
:on-press on-close
|
||||||
:on-press on-close
|
:margin-top (safe-area/get-top)
|
||||||
:accessibility-label :top-bar
|
:background :blur
|
||||||
:right-side [{:icon-name :i/advanced
|
:accessibility-label :top-bar
|
||||||
:on-press (fn callback [] nil)
|
:right-side [{:icon-name :i/advanced
|
||||||
:accessibility-label "Advanced"}]}]
|
:on-press #(js/alert
|
||||||
[transaction-title]
|
"to be implemented")
|
||||||
[transaction-from status-account-props theme]
|
:accessibility-label :advanced-options}]}]
|
||||||
[transaction-to user-props theme]
|
:footer [standard-auth/slide-button
|
||||||
[transaction-details theme]
|
{:size :size-48
|
||||||
[rn/view {:style style/slide-button-container}
|
:track-text (i18n/label :t/slide-to-send)
|
||||||
[quo/slide-button
|
:container-style {:z-index 2}
|
||||||
{:size :size/s-48
|
:customization-color account-color
|
||||||
:customization-color :purple
|
:on-auth-success #(rf/dispatch [:wallet/send-transaction %])
|
||||||
:on-reset (when @reset-slider? #(reset! reset-slider? false))
|
:auth-button-label (i18n/label :t/confirm)}]
|
||||||
:on-complete #(js/alert "Not implemented yet")
|
:gradient-cover? true
|
||||||
:track-icon (if biometric-auth? :i/face-id :password)
|
:customization-color (:color account)}
|
||||||
:track-text (i18n/label :t/slide-to-send)}]]]])))
|
[rn/view
|
||||||
|
[transaction-title
|
||||||
(defn view-internal
|
{:token-symbol token-symbol
|
||||||
[props]
|
:amount amount
|
||||||
[:f> f-view-internal props])
|
:account account
|
||||||
|
:to-address to-address}]
|
||||||
|
[user-summary
|
||||||
|
{:amount amount
|
||||||
|
:summary-type :status-account
|
||||||
|
:accessibility-label :summary-from-label
|
||||||
|
:label (i18n/label :t/from-capitalized)
|
||||||
|
:account-props from-account-props
|
||||||
|
:theme theme}]
|
||||||
|
[user-summary
|
||||||
|
{:amount amount
|
||||||
|
:summary-type :account
|
||||||
|
:accessibility-label :summary-to-label
|
||||||
|
:label (i18n/label :t/to-capitalized)
|
||||||
|
:account-props user-props
|
||||||
|
:theme theme}]
|
||||||
|
[transaction-details
|
||||||
|
{:estimated-time-min estimated-time-min
|
||||||
|
:max-fees max-fees
|
||||||
|
:token token
|
||||||
|
:amount amount
|
||||||
|
:to-address to-address
|
||||||
|
:theme theme}]]]])))
|
||||||
|
|
||||||
(def view (quo.theme/with-theme view-internal))
|
(def view (quo.theme/with-theme view-internal))
|
||||||
|
|
|
@ -20,7 +20,10 @@
|
||||||
|
|
||||||
(defn view
|
(defn view
|
||||||
[]
|
[]
|
||||||
(let [status (reagent/atom :sending)
|
(let [current-address (rf/sub [:wallet/current-viewing-account-address])
|
||||||
|
leave-page (fn []
|
||||||
|
(rf/dispatch [:navigate-to :wallet-accounts current-address]))
|
||||||
|
status (reagent/atom :sending)
|
||||||
{:keys [color]} (rf/sub [:wallet/current-viewing-account])]
|
{:keys [color]} (rf/sub [:wallet/current-viewing-account])]
|
||||||
[floating-button-page/view
|
[floating-button-page/view
|
||||||
{:header [quo/page-nav
|
{:header [quo/page-nav
|
||||||
|
@ -28,11 +31,11 @@
|
||||||
:background :blur
|
:background :blur
|
||||||
:icon-name :i/close
|
:icon-name :i/close
|
||||||
:margin-top (safe-area/get-top)
|
:margin-top (safe-area/get-top)
|
||||||
:on-press #(rf/dispatch [:navigate-back])
|
:on-press leave-page
|
||||||
:accessibility-label :top-bar}]
|
:accessibility-label :top-bar}]
|
||||||
:footer [quo/button
|
:footer [quo/button
|
||||||
{:customization-color color
|
{:customization-color color
|
||||||
:on-press #(rf/dispatch [:navigate-back])}
|
:on-press leave-page}
|
||||||
(i18n/label :t/done)]
|
(i18n/label :t/done)]
|
||||||
:customization-color color
|
:customization-color color
|
||||||
:gradient-cover? true}
|
:gradient-cover? true}
|
||||||
|
|
|
@ -0,0 +1,6 @@
|
||||||
|
(ns status-im.contexts.wallet.send.utils
|
||||||
|
(:require [utils.money :as money]))
|
||||||
|
|
||||||
|
(defn amount-in-hex
|
||||||
|
[amount token-decimal]
|
||||||
|
(money/to-hex (money/mul (money/bignumber amount) (money/from-decimal token-decimal))))
|
|
@ -0,0 +1,10 @@
|
||||||
|
(ns status-im.contexts.wallet.send.utils-test
|
||||||
|
(:require [cljs.test :refer [deftest is testing]]
|
||||||
|
[status-im.contexts.wallet.send.utils :as utils]))
|
||||||
|
|
||||||
|
(deftest test-amount-in-hex
|
||||||
|
(testing "Test amount-in-hex function"
|
||||||
|
(let [amount 1
|
||||||
|
decimal 18]
|
||||||
|
(is (= (utils/amount-in-hex amount decimal)
|
||||||
|
"0xde0b6b3a7640000")))))
|
|
@ -338,7 +338,6 @@
|
||||||
:component wallet-select-asset/view}
|
:component wallet-select-asset/view}
|
||||||
|
|
||||||
{:name :wallet-transaction-confirmation
|
{:name :wallet-transaction-confirmation
|
||||||
:options {:insets {:bottom? true}}
|
|
||||||
:component wallet-transaction-confirmation/view}
|
:component wallet-transaction-confirmation/view}
|
||||||
|
|
||||||
{:name :wallet-transaction-progress
|
{:name :wallet-transaction-progress
|
||||||
|
|
|
@ -8,3 +8,8 @@
|
||||||
:<- [:wallet/ui]
|
:<- [:wallet/ui]
|
||||||
(fn [ui]
|
(fn [ui]
|
||||||
(get-in ui [:send :select-address-tab])))
|
(get-in ui [:send :select-address-tab])))
|
||||||
|
|
||||||
|
(rf/reg-sub
|
||||||
|
:wallet/wallet-send
|
||||||
|
:<- [:wallet/ui]
|
||||||
|
:-> :send)
|
||||||
|
|
|
@ -29,11 +29,6 @@
|
||||||
:<- [:wallet]
|
:<- [:wallet]
|
||||||
:-> :ui)
|
:-> :ui)
|
||||||
|
|
||||||
(rf/reg-sub
|
|
||||||
:wallet/wallet-send
|
|
||||||
:<- [:wallet/ui]
|
|
||||||
:-> :send)
|
|
||||||
|
|
||||||
(rf/reg-sub
|
(rf/reg-sub
|
||||||
:wallet/tokens-loading?
|
:wallet/tokens-loading?
|
||||||
:<- [:wallet/ui]
|
:<- [:wallet/ui]
|
||||||
|
|
|
@ -247,6 +247,3 @@
|
||||||
[:=> [:cat [:maybe :int]]
|
[:=> [:cat [:maybe :int]]
|
||||||
[:maybe :string]])
|
[:maybe :string]])
|
||||||
|
|
||||||
(defn amount-in-hex
|
|
||||||
[amount token-decimal]
|
|
||||||
(to-hex (mul (bignumber amount) (from-decimal token-decimal))))
|
|
||||||
|
|
|
@ -2447,5 +2447,7 @@
|
||||||
"no-relevant-tokens": "No relevant tokens",
|
"no-relevant-tokens": "No relevant tokens",
|
||||||
"from-label": "From",
|
"from-label": "From",
|
||||||
"to-label": "To",
|
"to-label": "To",
|
||||||
"oops-wrong-word": "Oops! Wrong word"
|
"oops-wrong-word": "Oops! Wrong word",
|
||||||
|
"time-in-mins": "{{minutes}} min",
|
||||||
|
"amount-with-currency-symbol": "{{symbol}} {{amount}}"
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue