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

Add buy crypto banner 

Signed-off-by: Andrea Maria Piana <andrea.maria.piana@gmail.com>
This commit is contained in:
Andrea Maria Piana 2021-01-29 15:08:48 +01:00
parent 4f094c174d
commit 452e54fc19
No known key found for this signature in database
GPG Key ID: AA6CCA6DE0E06424
18 changed files with 229 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ios/Podfile.lock
View File

@ -645,7 +645,7 @@ SPEC CHECKSUMS:
Flipper-RSocket: 64e7431a55835eb953b0bf984ef3b90ae9fdddd7
FlipperKit: ab353d41aea8aae2ea6daaf813e67496642f3d7d
Folly: b73c3869541e86821df3c387eb0af5f65addfab4
glog: 40a13f7840415b9a77023fbcae0f1e6f43192af3
glog: cee4319f395bad5865ef3f32466c2e0ae677432c
libwebp: 946cb3063cea9236285f7e9a8505d806d30e07f3
OpenSSL-Universal: ff34003318d5e1163e9529b08470708e389ffcdd
Permission-Camera: afad27bf90337684d4a86f3825112d648c8c4d3b

BIN
resources/images/icons/buy_crypto@2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
resources/images/icons/buy_crypto@3x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

4
src/quo/components/list/item.cljs
View File

@ -130,7 +130,7 @@
;; Occupy only content width, never grow, but shrink if need be
:flex-grow 0
:flex-shrink 1
:align-items :center}}
:align-items (or (:left-side-alignment props) :center)}}
[icon-column props]
[title-column props]])
@ -169,6 +169,7 @@
(defn list-item
[{:keys [theme accessory disabled subtitle-max-lines icon icon-container-style
left-side-alignment
title subtitle active on-press on-long-press chevron size text-size
accessory-text accessibility-label title-accessibility-label
haptic-feedback haptic-type error animated animated-accessory? title-text-weight]
@ -211,6 +212,7 @@
:text-color (if on-press
text-color
(:text-color (themes :main)))
:left-side-alignment left-side-alignment
:icon-bg-color icon-bg-color
:title-accessibility-label title-accessibility-label
:icon icon

1
src/status_im/ethereum/json_rpc.cljs
View File

@ -136,6 +136,7 @@
"wallet_addFavourite" {}
"wallet_getFavourites" {}
"wallet_deleteCustomToken" {}
"wallet_getCryptoOnRamps" {}
"browsers_getBrowsers" {}
"browsers_addBrowser" {}
"browsers_deleteBrowser" {}

25
src/status_im/events.cljs
View File

@ -1,5 +1,6 @@
(ns status-im.events
(:require [re-frame.core :as re-frame]
[clojure.set :as clojure.set]
[status-im.bootnodes.core :as bootnodes]
[status-im.browser.core :as browser]
[status-im.browser.permissions :as browser.permissions]
@ -31,6 +32,8 @@
[status-im.privacy-policy.core :as privacy-policy]
[status-im.signals.core :as signals]
[status-im.stickers.core :as stickers]
[status-im.ethereum.json-rpc :as json-rpc]
[status-im.transport.core :as transport]
[status-im.transport.message.core :as transport.message]
[status-im.ui.components.react :as react]
@ -1291,3 +1294,25 @@
(reset-current-profile-chat % (get-in % [:db :contacts/identity]))
nil))))
(defn on-ramp<-rpc [on-ramp]
(clojure.set/rename-keys on-ramp {:logoUrl :logo-url
:siteUrl :site-url}))
(handlers/register-handler-fx
::crypto-loaded
(fn [{:keys [db]} [_ on-ramps]]
(log/info "on-ramps event received" on-ramps)
{:db (assoc
db
:buy-crypto/on-ramps
(map on-ramp<-rpc on-ramps))}))
(handlers/register-handler-fx
:buy-crypto.ui/loaded
(fn [_ _]
{::json-rpc/call [{:method "wallet_getCryptoOnRamps"
:params []
:on-success (fn [on-ramps]
(log/info "on-ramps received" on-ramps)
(re-frame/dispatch [::crypto-loaded on-ramps]))}]}))

3
src/status_im/subs.cljs
View File

@ -168,7 +168,6 @@
(reg-root-key-sub :wallet/recipient :wallet/recipient)
(reg-root-key-sub :wallet/favourites :wallet/favourites)
(reg-root-key-sub :wallet/refreshing-history? :wallet/refreshing-history?)
(reg-root-key-sub :wallet/buy-crypto-hidden :wallet/buy-crypto-hidden)
(reg-root-key-sub :wallet/fetching-error :wallet/fetching-error)
(reg-root-key-sub :wallet/non-archival-node :wallet/non-archival-node)
@ -217,6 +216,8 @@
(reg-root-key-sub :acquisition :acquisition)
(reg-root-key-sub :buy-crypto/on-ramps :buy-crypto/on-ramps)
;; communities
(re-frame/reg-sub
:communities

9
src/status_im/ui/screens/routing/main.cljs
View File

@ -10,6 +10,7 @@
[status-im.ui.screens.routing.intro-login-stack :as intro-login-stack]
[status-im.ui.screens.routing.chat-stack :as chat-stack]
[status-im.ui.screens.routing.wallet-stack :as wallet-stack]
[status-im.ui.screens.wallet.buy-crypto.views :as wallet.buy-crypto]
[status-im.ui.screens.routing.key-storage-stack :as key-storage-stack]
[status-im.ui.screens.group.views :as group-chat]
[status-im.ui.screens.group.events :as group.events]
@ -152,6 +153,14 @@
:transition :presentation-ios
:insets {:bottom true}
:component contact/profile}
{:name :buy-crypto
:transition :presentation-ios
:insets {:bottom true}
:component wallet.buy-crypto/container}
{:name :buy-crypto-website
:transition :presentation-ios
:insets {:bottom true}
:component wallet.buy-crypto/website}
{:name :key-storage-stack
:component key-storage-stack/key-storage-stack}]

7
src/status_im/ui/screens/wallet/account/views.cljs
View File

@ -5,14 +5,15 @@
[status-im.i18n :as i18n]
[status-im.ui.components.animation :as animation]
[status-im.ui.components.colors :as colors]
[status-im.ui.components.icons.vector-icons :as icons]
[quo.core :as quo]
[status-im.ui.components.list.views :as list]
[status-im.ui.components.react :as react]
[status-im.ui.components.topbar :as topbar]
[status-im.ui.components.icons.vector-icons :as icons]
[status-im.ui.screens.wallet.account.styles :as styles]
[status-im.ui.screens.wallet.accounts.sheets :as sheets]
[status-im.ui.screens.wallet.accounts.views :as accounts]
[status-im.ui.screens.wallet.buy-crypto.views :as buy-crypto]
[status-im.ui.screens.wallet.transactions.views :as history]
[status-im.utils.money :as money]
[status-im.wallet.utils :as wallet.utils]
@ -127,11 +128,13 @@
[tabs/tab-title state :history (i18n/label :t/history) (= tab :history)]]
(cond
(= tab :assets)
[react/view {}
[buy-crypto/banner]
[list/flat-list {:data tokens
:default-separator? false
:key-fn :name
:render-data (:code currency)
:render-fn accounts/render-asset}]
:render-fn accounts/render-asset}]]
(= tab :nft)
[react/view
[collectibles-link]

15
src/status_im/ui/screens/wallet/accounts/views.cljs
View File

@ -4,8 +4,7 @@
[re-frame.core :as re-frame]
[reagent.core :as reagent]
[status-im.i18n :as i18n]
[status-im.ui.screens.wallet.events :as wallet.events]
[status-im.ui.components.buy-crypto :as buy-crypto]
[status-im.ui.screens.wallet.buy-crypto.views :as buy-crypto]
[status-im.ui.components.chat-icon.screen :as chat-icon]
[status-im.ui.components.colors :as colors]
[status-im.ui.components.icons.vector-icons :as icons]
@ -195,16 +194,6 @@
[quo/text {:color :secondary}
(i18n/label :t/wallet-total-value)]])]))
(defn buy-crypto []
(let [empty-balances @(re-frame/subscribe [:empty-balances?])
buy-crypto-hidden @(re-frame/subscribe [:wallet/buy-crypto-hidden])]
(when (and empty-balances
(not buy-crypto-hidden))
[react/view {:style {:padding-horizontal 8
:padding-top 24}}
[buy-crypto/banner {:on-open #(re-frame/dispatch [:browser.ui/open-url crypto-onramp-link])
:on-close #(re-frame/dispatch [::wallet.events/hide-buy-crypto])}]])))
(defn accounts-overview []
(fn []
(let [mnemonic @(re-frame/subscribe [:mnemonic])]
@ -222,7 +211,7 @@
:icon :main-icons/more
:accessibility-label :accounts-more-options}]}
[accounts]
[buy-crypto/banner]
[assets]
[buy-crypto]
[react/view {:height 68}]]
[send-button]])))

31
src/status_im/ui/screens/wallet/buy_crypto/sheets.cljs Normal file
View File

@ -0,0 +1,31 @@
(ns status-im.ui.screens.wallet.buy-crypto.sheets
(:require [status-im.ui.components.colors :as colors]))
;; This needs to be a function because `colors/x` is a mutable reference
;; and changes dynamically based on the appearance settings
(defn banner-container []
{:margin-horizontal 16
:flex-direction :row
:justify-content :space-between
:align-items :center
:flex 1
:margin-top 16
:border-radius 16
:margin-bottom 8
:padding-horizontal 12
:padding-vertical 5
:background-color colors/blue-light})
(defn highlight-container []
{:padding 4
:justify-content :center
:border-radius 4
:background-color colors/blue})
(def highlight-text
{:text-transform :uppercase
:color "#FFFFFF"})
(def icon
{:width 68
:height 36})

128
src/status_im/ui/screens/wallet/buy_crypto/views.cljs Normal file
View File

@ -0,0 +1,128 @@
(ns status-im.ui.screens.wallet.buy-crypto.views
(:require [re-frame.core :as re-frame]
[reagent.core :as reagent]
[status-im.i18n :as i18n]
[status-im.ui.components.webview :as components.webview]
[status-im.ui.screens.wallet.buy-crypto.sheets :as sheets]
[status-im.ui.components.icons.icons :as icons]
[status-im.ui.screens.chat.photos :as photos]
[quo.core :as quo]
[status-im.ui.components.list.views :as list]
[status-im.ui.components.react :as react]
[status-im.ui.components.topbar :as topbar])
(:require-macros [status-im.utils.views :as views]))
(def learn-more-url "")
(defn on-buy-crypto-pressed []
(re-frame/dispatch [:navigate-to :buy-crypto]))
(defn render-on-ramp [{:keys [name fees region logo-url description] :as on-ramp}]
[react/touchable-highlight {:on-press #(re-frame/dispatch [:navigate-to :buy-crypto-website on-ramp])
:style {:flex 1}}
[quo/list-item
{:title [react/view {:style {:flex 1}}
[quo/text {:size :large
:weight :bold}
name]
[quo/text {} description]]
:subtitle [react/view {:style {:flex 1}}
[quo/text {:size :small
:color :secondary} fees]
[quo/text {:size :small
:color :secondary} region]]
:icon [photos/photo logo-url {:size 40}]
:left-side-alignment :flex-start
:accessory :text}]])
(defn buy-crypto-header []
[react/view {:padding-bottom 16
:align-items :center}
[react/view {:padding-top 16
:padding-bottom 8}
[quo/text {:weight :bold
:size :x-large}
(i18n/label :t/buy-crypto)]]
[quo/text {:color :secondary}
(i18n/label :t/buy-crypto-choose-a-service)]
(when (seq learn-more-url)
[react/touchable-highlight {:on-press #(re-frame/dispatch [:browser.ui/open-url learn-more-url])}
[react/view {:padding-vertical 11}
[quo/text {:color :link} (i18n/label :learn-more)]]])])
(views/defview buy-crypto []
(views/letsubs [on-ramps [:buy-crypto/on-ramps]]
[react/view {:flex 1}
[topbar/topbar {:border-bottom false
:modal? true}]
[list/flat-list {:data on-ramps
:key-fn :site-url
:header [buy-crypto-header]
:render-fn render-on-ramp}]]))
(defn website [route]
(let [has-loaded? (reagent/atom false)
{:keys [name
hostname
logo-url
site-url]} (get-in route [:route :params])]
(fn []
[react/view {:flex 1}
[topbar/topbar {:content [react/view {:flex 1
:align-items :center
:justify-content :center}
[quo/text
{:weight :semi-bold}
(i18n/label :t/buy-crypto)]
[quo/text {:color :secondary}
hostname]]
:modal? true}]
(when-not @has-loaded?
[react/view {:style {:flex 1
:position :absolute
:top 0
:left 0
:right 0
:bottom 0
:align-items :center
:justify-content :center}}
[photos/photo logo-url {:size 40}]
[quo/text
{:size :x-large}
(i18n/label :t/opening-buy-crypto {:site name})]
[react/view {:style {:padding-horizontal 32}}
[quo/text {:align :center
:color :secondary}
(i18n/label :t/buy-crypto-leaving)]]])
[components.webview/webview
{:onLoadEnd #(reset! has-loaded? true)
;; NOTE: without this it crashes on android 11
:androidHardwareAccelerationDisabled true
:containerStyle (when-not @has-loaded? {:opacity 0})
:source {:uri site-url}}]])))
(defn container []
(reagent/create-class
{:component-did-mount #(re-frame/dispatch [:buy-crypto.ui/loaded])
:reagent-render buy-crypto}))
(defn banner []
(fn []
[react/touchable-highlight {:on-press on-buy-crypto-pressed}
[react/view {:style (sheets/banner-container)}
[react/view {:flex-direction :row}
[react/view {:style (sheets/highlight-container)}
[quo/text {:weight :bold
:size :tiny
:style sheets/highlight-text}
(i18n/label :t/new)]]
[react/view {:style {:justify-content :center
:align-items :center
:padding-left 8}}
[quo/text {:size :large
:weight :medium
:color :link} (i18n/label :t/buy-crypto)]]]
[react/view {:style {:align-content :flex-end
:align-self :flex-end}}
[react/image {:source (icons/icon-source :buy-crypto)
:style sheets/icon}]]]]))

23
src/status_im/ui/screens/wallet/events.cljs
View File

@ -1,41 +1,20 @@
(ns status-im.ui.screens.wallet.events
(:require [status-im.ui.screens.wallet.signing-phrase.views :as signing-phrase]
[status-im.utils.handlers :as handlers]
[status-im.async-storage.core :as async-storage]
[re-frame.core :as re-frame]
[status-im.utils.fx :as fx]))
(fx/defn get-buy-crypto-preference
{:events [::get-buy-crypto]}
[_]
{::async-storage/get {:keys [:buy-crypto-hidden]
:cb #(re-frame/dispatch [::store-buy-crypto-preference %])}})
(fx/defn wallet-will-focus
{:events [::wallet-stack]}
[{:keys [db] :as cofx}]
(let [wallet-set-up-passed? (get-in db [:multiaccount :wallet-set-up-passed?])
sign-phrase-showed? (get db :wallet/sign-phrase-showed?)]
(fx/merge cofx
{:dispatch [:wallet.ui/pull-to-refresh] ;TODO temporary simple fix for v1
:db (if (or wallet-set-up-passed? sign-phrase-showed?)
db
(assoc db :popover/popover {:view [signing-phrase/signing-phrase]}
:wallet/sign-phrase-showed? true))}
(get-buy-crypto-preference))))
:wallet/sign-phrase-showed? true))}))
(handlers/register-handler-fx
::wallet-add-custom-token
(fn [{:keys [db]}]
{:db (dissoc db :wallet/custom-token-screen)}))
(fx/defn hide-buy-crypto
{:events [::hide-buy-crypto]}
[{:keys [db]}]
{:db (assoc db :wallet/buy-crypto-hidden true)
::async-storage/set! {:buy-crypto-hidden true}})
(fx/defn store-buy-crypto
{:events [::store-buy-crypto-preference]}
[{:keys [db]} {:keys [buy-crypto-hidden]}]
{:db (assoc db :wallet/buy-crypto-hidden buy-crypto-hidden)})

6
status-go-version.json
View File

@ -2,7 +2,7 @@
"_comment": "DO NOT EDIT THIS FILE BY HAND. USE 'scripts/update-status-go.sh <tag>' instead",
"owner": "status-im",
"repo": "status-go",
"version": "v0.71.2",
"commit-sha1": "31b9a924ceffded138947f2ec2acd964035fcb56",
"src-sha256": "17ljwkynbg3yzr7pahlzpdx8djkv25p8jbfy05sss9ycfk0y0mdz"
"version": "v0.71.4",
"commit-sha1": "2c0383ec2286c644fe4425c04ad692f4fa0243fe",
"src-sha256": "1kvpzmkzarg8l5gq7dz7316f1bph3zh754crhc1mmd334919cn3h"
}

4
test/appium/tests/atomic/account_management/test_wallet_management.py
View File

@ -280,7 +280,7 @@ class TestWalletManagement(SingleDeviceTestCase):
initial_STT = wallet.get_asset_amount_by_name('STT')
wallet.just_fyi('Check individual account view (imported from private key), receive option')
wallet.get_account_by_name(account_name).click()
wallet.get_account_by_name(account_name).scroll_and_click(direction="up")
if not wallet.send_transaction_button.is_element_displayed():
self.errors.append('Send button is not shown on account added with private key')
wallet.receive_transaction_button.click()
@ -314,7 +314,7 @@ class TestWalletManagement(SingleDeviceTestCase):
wallet.wait_balance_is_changed('MDS')
wallet.just_fyi('Check account view and send option (imported from seed phrase)')
wallet.get_account_by_name(account_name).click()
wallet.get_account_by_name(account_name).scroll_and_click(direction="up")
if not wallet.send_transaction_button.is_element_displayed():
self.errors.append('Send button is not shown on account added with seed phrase')
wallet.receive_transaction_button.click()

4
test/appium/views/base_element.py
View File

@ -150,8 +150,8 @@ class BaseElement(object):
raise NoSuchElementException(
"Device %s: %s by %s:* `%s` is not found on the screen" % (self.driver.number, self.name, self.by, self.locator)) from None
def scroll_and_click(self):
self.scroll_to_element()
def scroll_and_click(self, direction='down'):
self.scroll_to_element(direction=direction)
self.click()
def is_element_present(self, sec=5):

4
translations/en.json
View File

@ -805,6 +805,10 @@
"wallet-key-content": "A 64 character hex address based on the Ethereum standard and beginning with 0x. Public-facing, your account address is shared with others when you want to receive funds. Also referred to as an “Ethereum address” or “wallet address.”",
"buy-crypto-title": "Looks like your wallet is empty",
"buy-crypto-description": "Find a dapp to buy crypto now",
"buy-crypto": "Buy crypto",
"buy-crypto-choose-a-service": "Choose a service you'd like to use to buy crypto",
"buy-crypto-leaving": "You are leaving Status and entering a third party website to complete your purchase",
"opening-buy-crypto": "Opening {{site}}...",
"network": "Network",
"network-chain": "Network chain",
"network-details": "Network details",