[#5825] add hardwallet auth method and connect screens

* add react-native-nfc-manager to detect NFC support
* add "Choose auth method" screen https://www.figma.com/file/UfQjpWl1hmRchHIyY3Wvu2nW/Hardwallet-light-flows?node-id=259%3A29
* add "Hardwallet connect" screen https://www.figma.com/file/UfQjpWl1hmRchHIyY3Wvu2nW/Hardwallet-light-flows?node-id=258%3A594

Signed-off-by: Dmitry Novotochinov <dmitry.novot@gmail.com>
This commit is contained in:
Dmitry Novotochinov 2018-09-18 19:27:58 +03:00
parent 18b71ee625
commit 60cb0eb36c
No known key found for this signature in database
GPG Key ID: 43D1DAF5AD39C927
37 changed files with 458 additions and 39 deletions

1
.env
View File

@ -15,3 +15,4 @@ INSTABUG_SURVEYS=1
GROUP_CHATS_ENABLED=0
CACHED_WEBVIEWS_ENABLED=1
EXTENSIONS=1
HARDWALLET_ENABLED=0

View File

@ -219,6 +219,7 @@ configurations.all {
}
dependencies {
compile project(':react-native-nfc-manager')
implementation project(':react-native-background-timer')
implementation project(':react-native-svg')
implementation 'com.android.support:multidex:1.0.2'

View File

@ -4,6 +4,7 @@ import android.support.multidex.MultiDexApplication;
import com.aakashns.reactnativedialogs.ReactNativeDialogsPackage;
import org.devio.rn.splashscreen.SplashScreenReactPackage;
import com.facebook.react.ReactApplication;
import community.revteltech.nfc.NfcManagerPackage;
import io.invertase.firebase.RNFirebasePackage;
import io.invertase.firebase.messaging.RNFirebaseMessagingPackage;
import io.invertase.firebase.notifications.RNFirebaseNotificationsPackage;
@ -57,6 +58,7 @@ public class MainApplication extends MultiDexApplication implements ReactApplica
Function<String, String> callRPC = statusPackage.getCallRPC();
List<ReactPackage> packages = new ArrayList<ReactPackage>(Arrays.asList(
new MainReactPackage(),
new NfcManagerPackage(),
new RNFirebasePackage(),
new RNFirebaseMessagingPackage(),
new RNFirebaseNotificationsPackage(),

View File

@ -1,4 +1,6 @@
rootProject.name = 'StatusIm'
include ':react-native-nfc-manager'
project(':react-native-nfc-manager').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-nfc-manager/android')
include ':react-native-firebase'
project(':react-native-firebase').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-firebase/android')
include ':react-native-securerandom'

View File

@ -38,6 +38,7 @@
"react-native-background-timer"
"react-native-fetch-polyfill"
"react-native-testfairy"
"react-native-nfc-manager"
"text-encoding"
"js-sha3"
"react-navigation"]

View File

@ -21,6 +21,8 @@ target 'StatusIm' do
pod 'RNKeychain', :path => '../node_modules/react-native-keychain'
pod 'react-native-camera', path: '../node_modules/react-native-camera'
pod 'react-native-nfc-manager', :path => '../node_modules/react-native-nfc-manager'
target 'StatusImTests' do
inherit! :search_paths
# Pods for testing

View File

@ -66,6 +66,8 @@ PODS:
- React
- react-native-camera/RN (1.1.5):
- React
- react-native-nfc-manager (0.5.5):
- React
- React/Core (0.56.0):
- yoga (= 0.56.0.React)
- RNKeychain (3.0.0):
@ -78,6 +80,7 @@ DEPENDENCIES:
- React (from `../node_modules/react-native`)
- react-native-background-timer (from `../node_modules/react-native-background-timer`)
- react-native-camera (from `../node_modules/react-native-camera`)
- react-native-nfc-manager (from `../node_modules/react-native-nfc-manager`)
- RNKeychain (from `../node_modules/react-native-keychain`)
- yoga (from `../node_modules/react-native/ReactCommon/yoga`)
@ -100,6 +103,8 @@ EXTERNAL SOURCES:
:path: "../node_modules/react-native-background-timer"
react-native-camera:
:path: "../node_modules/react-native-camera"
react-native-nfc-manager:
:path: "../node_modules/react-native-nfc-manager"
RNKeychain:
:path: "../node_modules/react-native-keychain"
yoga:
@ -118,9 +123,10 @@ SPEC CHECKSUMS:
React: 1fe0eb13d90b625d94c3b117c274dcfd2e760e11
react-native-background-timer: bb7a98c8e97fc7c290de2d423dd09ddb73dcbcbb
react-native-camera: 68ad5143d2d0636236d46c7de8d2a6455ca52a36
react-native-nfc-manager: a74ef58b29f0015ae9e70f120645b796668ba5c2
RNKeychain: 627c6095cef215dd3d9804a9a9cf45ab96aa3997
yoga: b1ce48b6cf950b98deae82838f5173ea7cf89e85
PODFILE CHECKSUM: 7636f960a0dbec2dd55b8b20e244befa3fdb4438
PODFILE CHECKSUM: b24b9e1dd90a715fd354083342dceb8f1a2f6d75
COCOAPODS: 1.5.2

View File

@ -6641,6 +6641,11 @@
"levelup": "0.18.6"
}
},
"react-native-nfc-manager": {
"version": "0.5.5",
"resolved": "https://registry.npmjs.org/react-native-nfc-manager/-/react-native-nfc-manager-0.5.5.tgz",
"integrity": "sha512-4gFuyDnNWXe81R7tTbc1AFlrz1LfBHp/S7daWL7gEsBFdeRegDmopecUJER511UR5d5Ymttw37LzTZUbnNKTlQ=="
},
"react-native-os": {
"version": "git+https://github.com/status-im/react-native-os.git#1a6d0835f919cb075793ad7c602f2724eee4702d"
},

View File

@ -49,6 +49,7 @@
"react-native-invertible-scroll-view": "1.1.0",
"react-native-keychain": "3.0.0",
"react-native-level-fs": "3.0.1",
"react-native-nfc-manager": "^0.5.5",
"react-native-os": "https://github.com/status-im/react-native-os.git#1.1.0-1",
"react-native-qrcode": "0.2.7",
"react-native-randombytes": "3.5.0",

View File

@ -13,6 +13,7 @@
(def fetch (.-default (js/require "react-native-fetch-polyfill")))
(def i18n (js/require "react-native-i18n"))
(def react-native-firebase #js {})
(def nfc-manager #js {})
(def camera #js {:default #js {:constants {:Aspect "Portrait"}}})
(def dialogs #js {})
(def dismiss-keyboard #js {})

View File

@ -20,6 +20,7 @@
(def instabug (js/require "instabug-reactnative"))
(def svg (js/require "react-native-svg"))
(def react-native-firebase (js/require "react-native-firebase"))
(def nfc-manager (js/require "react-native-nfc-manager"))
(def snoopy (js/require "rn-snoopy"))
(def snoopy-filter (js/require "rn-snoopy/stream/filter"))
(def snoopy-bars (js/require "rn-snoopy/stream/bars"))

View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M4 6H20C20.5523 6 21 6.44772 21 7V17C21 17.5523 20.5523 18 20 18H4C3.44769 18 3 17.5523 3 17V7C3 6.44772 3.44769 6 4 6ZM1 7C1 5.34314 2.34314 4 4 4H20C21.6569 4 23 5.34314 23 7V17C23 18.6569 21.6569 20 20 20H4C2.34314 20 1 18.6569 1 17V7ZM6 10C5.44769 10 5 10.4477 5 11V13C5 13.5523 5.44769 14 6 14H8C8.55231 14 9 13.5523 9 13V11C9 10.4477 8.55231 10 8 10H6Z" fill="#4360DF"/>
</svg>

After

Width:  |  Height:  |  Size: 529 B

3
resources/icons/nfc.svg Normal file
View File

@ -0,0 +1,3 @@
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M35 18C35 27.3889 27.3888 35 18 35C8.61121 35 1 27.3889 1 18C1 8.61115 8.61121 1 18 1C27.3888 1 35 8.61115 35 18ZM36 18C36 27.9411 27.9412 36 18 36C8.05884 36 0 27.9411 0 18C0 8.0589 8.05884 0 18 0C27.9412 0 36 8.0589 36 18ZM29.3284 14.4471C27.7992 12.9387 26.016 11.7706 24.0283 10.9755C22.1088 10.2076 20.0804 9.81824 18 9.81824C15.9194 9.81824 13.8911 10.2076 11.9716 10.9755C9.98389 11.7706 8.20081 12.9387 6.67151 14.4471C6.50342 14.613 6.50342 14.882 6.67151 15.0479C6.83972 15.2138 7.1123 15.2138 7.28052 15.0479C10.1438 12.2234 13.9507 10.6678 18 10.6678C22.0493 10.6678 25.8562 12.2234 28.7195 15.0479C28.7462 15.0742 28.7755 15.0964 28.8066 15.1144C28.832 15.1291 28.8586 15.141 28.886 15.1501C28.9307 15.1649 28.9773 15.1723 29.0239 15.1723C29.0691 15.1723 29.1141 15.1653 29.1575 15.1514C29.22 15.1314 29.2787 15.0969 29.3284 15.0479C29.4966 14.882 29.4966 14.613 29.3284 14.4471ZM18.0001 19.0457C16.2194 19.0457 14.5453 19.7298 13.286 20.9719C13.1179 21.1378 13.1179 21.4068 13.286 21.5726C13.2943 21.5808 13.3029 21.5886 13.3116 21.596C13.3176 21.6011 13.3237 21.6059 13.33 21.6105C13.3588 21.6322 13.3896 21.6498 13.4219 21.6633C13.4408 21.6712 13.4601 21.6777 13.4797 21.6829C13.5161 21.6923 13.5533 21.6971 13.5906 21.6971C13.7007 21.6971 13.8109 21.6556 13.895 21.5726C14.9915 20.491 16.4493 19.8953 18.0001 19.8953C19.5508 19.8953 21.0087 20.4909 22.1051 21.5726C22.2733 21.7385 22.5459 21.7385 22.7141 21.5726C22.8823 21.4067 22.8823 21.1377 22.7141 20.9718C21.4551 19.7297 19.7809 19.0457 18.0001 19.0457ZM9.97876 17.7094C12.1213 15.5959 14.9701 14.4319 18.0001 14.4319C21.03 14.4319 23.8788 15.5959 26.0214 17.7094C26.1895 17.8754 26.1895 18.1443 26.0214 18.3102C25.9373 18.3931 25.827 18.4346 25.7169 18.4346C25.6067 18.4346 25.4965 18.3932 25.4124 18.3102C23.4325 16.3571 20.8 15.2815 18.0001 15.2815C15.2001 15.2815 12.5677 16.3571 10.5878 18.3102C10.4196 18.4761 10.147 18.4761 9.97876 18.3102C9.81067 18.1443 9.81067 17.8753 9.97876 17.7094ZM18.0001 23.6769C17.3 23.6769 16.7305 24.2388 16.7305 24.9293C16.7305 25.62 17.3 26.1818 18.0001 26.1818C18.7002 26.1818 19.2698 25.6199 19.2698 24.9293C19.2698 24.2388 18.7002 23.6769 18.0001 23.6769ZM18.0001 25.3322C17.7749 25.3322 17.5917 25.1515 17.5917 24.9293C17.5917 24.7072 17.7749 24.5265 18.0001 24.5265C18.2252 24.5265 18.4084 24.7072 18.4084 24.9293C18.4084 25.1515 18.2252 25.3322 18.0001 25.3322Z" fill="#939BA1"/>
</svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

3
resources/icons/password.svg Executable file
View File

@ -0,0 +1,3 @@
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M13 4C13 3.44772 12.5523 3 12 3C11.4477 3 11 3.44772 11 4V9.58582L7.41418 6C7.02368 5.6095 6.3905 5.6095 6 6C5.60944 6.39053 5.60944 7.02371 6 7.41422L9.58575 11H4C3.44769 11 3 11.4477 3 12C3 12.5523 3.44769 13 4 13H9.58582L6 16.5858C5.6095 16.9763 5.6095 17.6095 6 18C6.39056 18.3905 7.02368 18.3905 7.41425 18L11 14.4142V20C11 20.5523 11.4477 21 12 21C12.5523 21 13 20.5523 13 20V14.4142L16.5858 18C16.9763 18.3905 17.6094 18.3905 18 18C18.3905 17.6095 18.3905 16.9763 18 16.5858L14.4142 13H20C20.5523 13 21 12.5523 21 12C21 11.4477 20.5523 11 20 11H14.4142L18 7.41418C18.3906 7.02368 18.3906 6.3905 18 5.99997C17.6095 5.60947 16.9763 5.60947 16.5858 5.99997L13 9.58578V4Z" fill="#4360DF"/>
</svg>

After

Width:  |  Height:  |  Size: 845 B

7
resources/icons/wifi.svg Normal file
View File

@ -0,0 +1,7 @@
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M32.5871 16.0524C30.888 14.3763 28.9067 13.0785 26.6982 12.195C24.5653 11.3417 22.3117 10.9091 20 10.9091C17.6882 10.9091 15.4346 11.3417 13.3017 12.195C11.0933 13.0785 9.11198 14.3763 7.41284 16.0524C7.22599 16.2367 7.22599 16.5355 7.41284 16.7199C7.59973 16.9042 7.9026 16.9042 8.08954 16.7199C11.2709 13.5815 15.5008 11.8531 20 11.8531C24.4992 11.8531 28.7291 13.5815 31.9105 16.7199C32.004 16.812 32.1264 16.8581 32.2488 16.8581C32.3713 16.8581 32.4937 16.812 32.5872 16.7199C32.774 16.5355 32.774 16.2367 32.5871 16.0524Z" fill="#939BA1"/>
<path d="M20.0001 21.1619C18.0215 21.1619 16.1613 21.922 14.7622 23.3021C14.5754 23.4865 14.5754 23.7853 14.7622 23.9696C14.8556 24.0618 14.9781 24.1079 15.1005 24.1079C15.223 24.1079 15.3454 24.0618 15.4389 23.9696C16.6572 22.7678 18.277 22.1059 20.0001 22.1059C21.7231 22.1059 23.3429 22.7677 24.5612 23.9695C24.7481 24.1539 25.051 24.1539 25.2379 23.9695C25.4247 23.7852 25.4247 23.4864 25.2379 23.302C23.8389 21.922 21.9787 21.1619 20.0001 21.1619Z" fill="#939BA1"/>
<path d="M20.0001 16.0355C16.6334 16.0355 13.4681 17.3288 11.0875 19.6772C10.9007 19.8615 10.9007 20.1604 11.0875 20.3447C11.2744 20.529 11.5773 20.5291 11.7642 20.3447C13.9641 18.1746 16.889 16.9795 20.0001 16.9795C23.1112 16.9795 26.036 18.1746 28.236 20.3447C28.3294 20.4369 28.4518 20.483 28.5743 20.483C28.6967 20.483 28.8192 20.4369 28.9126 20.3447C29.0994 20.1604 29.0994 19.8615 28.9126 19.6772C26.5319 17.3288 23.3667 16.0355 20.0001 16.0355Z" fill="#939BA1"/>
<path d="M20 26.3077C19.2222 26.3077 18.5894 26.932 18.5894 27.6993C18.5894 28.4667 19.2222 29.0909 20 29.0909C20.7779 29.0909 21.4107 28.4666 21.4107 27.6993C21.4107 26.932 20.7779 26.3077 20 26.3077ZM20 28.1469C19.7498 28.1469 19.5463 27.9461 19.5463 27.6993C19.5463 27.4525 19.7498 27.2517 20 27.2517C20.2502 27.2517 20.4538 27.4525 20.4538 27.6993C20.4538 27.9462 20.2502 28.1469 20 28.1469Z" fill="#939BA1"/>
<circle cx="20" cy="20" r="19.5" stroke="#939BA1"/>
</svg>

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 616 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.1 KiB

View File

@ -7,6 +7,7 @@
[status-im.constants :as constants]
[status-im.data-store.accounts :as accounts-store]
[status-im.i18n :as i18n]
[status-im.hardwallet.core :as hardwallet]
[status-im.native-module.core :as status]
[status-im.ui.screens.navigation :as navigation]
[status-im.utils.config :as config]
@ -98,6 +99,11 @@
:enter-password (navigation/navigate-back cofx)
:confirm-password (reset-account-creation cofx)))
(defn navigate-to-authentication-method [{:keys [db] :as cofx}]
(if (hardwallet/hardwallet-supported? db)
(navigation/navigate-to-cofx :hardwallet/authentication-method nil cofx)
(navigation/navigate-to-cofx :create-account nil cofx)))
;;;; COFX
(re-frame/reg-cofx

View File

@ -11,6 +11,7 @@
[status-im.bootnodes.core :as bootnodes]
[status-im.data-store.core :as data-store]
[status-im.fleet.core :as fleet]
[status-im.hardwallet.core :as hardwallet]
[status-im.i18n :as i18n]
[status-im.init.core :as init]
[status-im.log-level.core :as log-level]
@ -141,6 +142,11 @@
(fn [cofx [_ result password]]
(accounts.create/on-account-created result password false cofx)))
(handlers/register-handler-fx
:accounts.create.ui/create-new-account-button-pressed
(fn [cofx _]
(accounts.create/navigate-to-authentication-method cofx)))
;; accounts recover module
(handlers/register-handler-fx
@ -486,3 +492,25 @@
:notifications.callback/request-notifications-permissions-denied
(fn [cofx _]
(accounts/show-mainnet-is-default-alert cofx)))
;; hardwallet module
(handlers/register-handler-fx
:hardwallet.callback/check-nfc-support-success
(fn [cofx [_ supported?]]
(hardwallet/set-nfc-support supported? cofx)))
(handlers/register-handler-fx
:hardwallet.callback/check-nfc-enabled-success
(fn [cofx [_ enabled?]]
(hardwallet/set-nfc-enabled enabled? cofx)))
(handlers/register-handler-fx
:hardwallet.ui/status-hardwallet-option-pressed
(fn [cofx _]
(hardwallet/navigate-to-connect-screen cofx)))
(handlers/register-handler-fx
:hardwallet.ui/go-to-settings-button-pressed
(fn [_ _]
{:hardwallet/open-nfc-settings nil}))

View File

@ -0,0 +1,61 @@
(ns status-im.hardwallet.core
(:require-macros [status-im.utils.handlers-macro :as handlers-macro])
(:require [status-im.utils.platform :as platform]
[status-im.utils.config :as config]
[status-im.react-native.js-dependencies :as js-dependencies]
[re-frame.core :as re-frame]
[status-im.ui.screens.navigation :as navigation]))
(defn check-nfc-support []
(when config/hardwallet-enabled?
(.. js-dependencies/nfc-manager
-default
isSupported
(then #(re-frame/dispatch [:hardwallet.callback/check-nfc-support-success %])))))
(defn check-nfc-enabled []
(when platform/android?
(.. js-dependencies/nfc-manager
-default
isEnabled
(then #(re-frame/dispatch [:hardwallet.callback/check-nfc-enabled-success %])))))
(defn set-nfc-support [supported? {:keys [db]}]
{:db (assoc-in db [:hardwallet :nfc-supported?] supported?)})
(defn set-nfc-enabled [enabled? {:keys [db]}]
{:db (assoc-in db [:hardwallet :nfc-enabled?] enabled?)})
(defn open-nfc-settings []
(when platform/android?
(.. js-dependencies/nfc-manager
-default
goToNfcSetting)))
(defn navigate-to-connect-screen [cofx]
(handlers-macro/merge-fx
cofx
{:hardwallet/check-nfc-enabled nil}
(navigation/navigate-to-cofx :hardwallet/connect nil)))
(defn hardwallet-supported? [db]
(and config/hardwallet-enabled?
platform/android?
(get-in db [:hardwallet :nfc-supported?])))
(defn return-back-from-nfc-settings [app-coming-from-background? {:keys [db]}]
(when (and app-coming-from-background?
(= :hardwallet/connect (:view-id db)))
{:hardwallet/check-nfc-enabled nil}))
(re-frame/reg-fx
:hardwallet/check-nfc-support
check-nfc-support)
(re-frame/reg-fx
:hardwallet/check-nfc-enabled
check-nfc-enabled)
(re-frame/reg-fx
:hardwallet/open-nfc-settings
open-nfc-settings)

View File

@ -85,7 +85,9 @@
:init/testfairy-alert nil
:notifications/handle-initial-push-notification nil
:network/listen-to-network-status nil
:network/listen-to-connection-status nil}
:network/listen-to-connection-status nil
:hardwallet/check-nfc-support nil
:hardwallet/check-nfc-enabled nil}
(initialize-app-db)
(node/start)))

View File

@ -59,4 +59,6 @@
:width 993
:height 933}
:wallet-welcome (js/require "./resources/images/ui/wallet-welcome.png")
:wallet-setup (js/require "./resources/images/ui/wallet-setup.png")})
:wallet-setup (js/require "./resources/images/ui/wallet-setup.png")
:hardwallet-card (js/require "./resources/images/ui/hardwallet-card.png")
:phone-nfc (js/require "./resources/images/ui/phone-nfc.png")})

View File

@ -18,6 +18,7 @@
(def gray-border "#ececf0")
(def blue "#4360df") ;; Used as main wallet color, and ios home add button
(def blue-transparent "rgba(67, 96, 223, 0.2)")
(def blue-transparent-10 "rgba(67, 96, 223, 0.1)")
(def blue-transparent-40 "rgba(67, 96, 223, 0.4)")
(def blue-darker "#c4cced")
(def blue-dark "#3147ac") ;; Used as secondary wallet color (icon background)

View File

@ -92,7 +92,10 @@
:icons/check (js/require "./resources/icons/check.svg")
:icons/dots (js/require "./resources/icons/dots.svg")
:icons/warning (js/require "./resources/icons/warning.svg")
:icons/info (js/require "./resources/icons/info.svg")}
:icons/info (js/require "./resources/icons/info.svg")
:icons/hardwallet (js/require "./resources/icons/hardwallet.svg")
:icons/password (js/require "./resources/icons/password.svg")
:icons/nfc (js/require "./resources/icons/nfc.svg")}
{:icons/discover (components.svg/slurp-svg "./resources/icons/bottom/discover_gray.svg")
:icons/contacts (components.svg/slurp-svg "./resources/icons/bottom/contacts_gray.svg")
:icons/home (components.svg/slurp-svg "./resources/icons/bottom/home_gray.svg")
@ -157,8 +160,11 @@
:icons/check (components.svg/slurp-svg "./resources/icons/check.svg")
:icons/dots (components.svg/slurp-svg "./resources/icons/dots.svg")
:icons/warning (components.svg/slurp-svg "./resources/icons/warning.svg")
:icons/settings (components.svg/slurp-svg "./resources/icons/settings.svg")
:icons/info (components.svg/slurp-svg "./resources/icons/info.svg")
:icons/settings (components.svg/slurp-svg "./resources/icons/settings.svg")}))
:icons/hardwallet (components.svg/slurp-svg "./resources/icons/hardwallet.svg")
:icons/password (components.svg/slurp-svg "./resources/icons/password.svg")
:icons/nfc (components.svg/slurp-svg "./resources/icons/nfc.svg")}))
(defn normalize-property-name [n]
(if (= n :icons/options)

View File

@ -42,7 +42,7 @@
:render-fn (fn [account] [account-view account])
:separator [react/view {:height 12}]}]]
[react/view
[components.common/button {:on-press #(re-frame/dispatch [:navigate-to :create-account])
[components.common/button {:on-press #(re-frame/dispatch [:accounts.create.ui/create-new-account-button-pressed])
:label (i18n/label :t/create-new-account)}]
[react/view styles/bottom-button-container
[components.common/button {:on-press #(re-frame/dispatch [:navigate-to :recover])

View File

@ -58,7 +58,9 @@
:desktop/desktop {:tab-view-id :home}
:dimensions/window (dimensions/window)
:push-notifications/stored {}
:registry {}})
:registry {}
:hardwallet {:nfc-supported? false
:nfc-enabled? false}})
;;;;GLOBAL
@ -173,6 +175,8 @@
(spec/def ::semaphores set?)
(spec/def ::hardwallet map?)
(spec/def ::db (allowed-keys
:opt
[:contacts/contacts
@ -248,6 +252,7 @@
::chain
::app-state
::semaphores
::hardwallet
:navigation/view-id
:navigation/navigation-stack
:navigation/prev-tab-view-id

View File

@ -38,7 +38,8 @@
[status-im.utils.handlers :as handlers]
[status-im.utils.handlers-macro :as handlers-macro]
[status-im.utils.http :as http]
[status-im.utils.utils :as utils]))
[status-im.utils.utils :as utils]
[status-im.hardwallet.core :as hardwallet]))
(defn- http-get [{:keys [url response-validator success-event-creator failure-event-creator timeout-ms]}]
(let [on-success #(re-frame/dispatch (success-event-creator %))
@ -114,7 +115,8 @@
(handlers-macro/merge-fx cofx
{::app-state-change-fx state
:db (assoc db :app-state state)}
(inbox/request-messages app-coming-from-background?))))
(inbox/request-messages app-coming-from-background?)
(hardwallet/return-back-from-nfc-settings app-coming-from-background?))))
(handlers/register-handler-fx
:app-state-change

View File

@ -0,0 +1,47 @@
(ns status-im.ui.screens.hardwallet.authentication-method.styles
(:require [status-im.ui.components.colors :as colors]))
(def container
{:flex 1
:background-color colors/white})
(def choose-authentication-method
{:flex-direction :column
:flex 1
:align-items :center
:justify-content :center})
(def choose-authentication-method-text
{:color colors/black
:padding-horizontal 60
:text-align :center
:font-weight :bold
:font-size 22})
(def choose-authentication-method-row-text
{:color colors/blue
:text-align :center
:font-size 17})
(def authentication-methods
{:padding-vertical 24})
(def authentication-method-row
{:padding-horizontal 16
:flex-direction :row
:align-items :center
:height 63})
(def authentication-method-row-icon-container
{:background-color colors/blue-transparent-10
:width 40
:height 40
:border-radius 50
:align-items :center
:justify-content :center})
(def authentication-method-row-wrapper
{:flex 1
:flex-direction :row
:padding-horizontal 16
:justify-content :space-between})

View File

@ -0,0 +1,42 @@
(ns status-im.ui.screens.hardwallet.authentication-method.views
(:require [re-frame.core :as re-frame]
[status-im.ui.screens.hardwallet.authentication-method.styles :as styles]
[status-im.ui.components.icons.vector-icons :as vector-icons]
[status-im.ui.components.react :as react]
[status-im.ui.components.toolbar.view :as toolbar]
[status-im.ui.components.styles :as components.styles]
[status-im.ui.components.common.common :as common]
[status-im.ui.components.status-bar.view :as status-bar]
[status-im.i18n :as i18n]
[status-im.ui.components.colors :as colors]))
(defn authentication-method-row [{:keys [title on-press icon]}]
[react/touchable-highlight {:on-press on-press}
[react/view styles/authentication-method-row
[react/view styles/authentication-method-row-icon-container
[vector-icons/icon icon {:color colors/blue}]]
[react/view styles/authentication-method-row-wrapper
[react/text {:style styles/choose-authentication-method-row-text
:number-of-lines 1}
title]]
[vector-icons/icon :icons/forward {:color colors/gray}]]])
(defn hardwallet-authentication-method []
[react/view styles/container
[status-bar/status-bar]
[react/view components.styles/flex
[toolbar/toolbar {}
toolbar/default-nav-back
nil]
[common/separator]
[react/view styles/choose-authentication-method
[react/text {:style styles/choose-authentication-method-text
:number-of-lines 3}
(i18n/label :t/choose-authentication-method)]]
[react/view styles/authentication-methods
[authentication-method-row {:title (i18n/label :t/status-hardwallet-capitalized)
:icon :icons/hardwallet
:on-press #(re-frame/dispatch [:hardwallet.ui/status-hardwallet-option-pressed])}]
[authentication-method-row {:title (i18n/label :t/password)
:icon :icons/password
:on-press #(re-frame/dispatch [:navigate-to :create-account])}]]]])

View File

@ -0,0 +1,94 @@
(ns status-im.ui.screens.hardwallet.connect.styles
(:require [status-im.ui.components.colors :as colors]))
(def container
{:flex 1
:background-color colors/white})
(def hardwallet-connect
{:flex-direction :column
:flex 1
:align-items :center
:justify-content :space-between})
(def hardwallet-card-image-container
{:margin-top 120})
(def hardwallet-card-image
{:width 255
:height 160})
(def hardwallet-card-image-small
{:width 44
:height 28
:margin-right 20})
(def status-hardwallet-text-container
{:margin-top 30})
(def status-hardwallet-text
{:font-size 22
:font-weight :bold
:color colors/black
:text-align :center})
(def link-card-text
{:text-align :center
:font-size 15
:color colors/gray
:padding-horizontal 80
:padding-vertical 10})
(def bottom-action-container
{:background-color colors/gray-lighter
:width 369
:height 80
:border-radius 10
:margin-bottom 20})
(def nfc-enabled-container
{:flex-direction :row
:justify-content :space-between
:align-items :center})
(def phone-nfc-image
{:width 54
:height 72
:margin-left 20
:margin-top 8
:align-items :baseline})
(def hold-card-text
{:width 186
:text-align :center
:font-size 14
:color colors/blue
:line-height 20
:text-transform :uppercase
:margin-right 40})
(def nfc-disabled-container
{:flex-direction :row
:justify-content :space-between
:align-items :center})
(def nfc-icon
{:margin-left 52
:margin-top 22})
(def nfc-disabled-actions-container
{:flex-direction :column
:align-items :center
:justify-content :space-between
:margin-right 100
:margin-top 20})
(def turn-nfc-text
{:text-transform :uppercase
:line-height 20
:letter-spacing 0.5
:color colors/gray})
(def go-to-settings-text
{:color colors/gray})

View File

@ -0,0 +1,7 @@
(ns status-im.ui.screens.hardwallet.connect.subs
(:require [re-frame.core :as re-frame]))
(re-frame/reg-sub
:hardwallet/nfc-enabled?
(fn [db]
(get-in db [:hardwallet :nfc-enabled?])))

View File

@ -0,0 +1,60 @@
(ns status-im.ui.screens.hardwallet.connect.views
(:require-macros [status-im.utils.views :refer [defview letsubs]])
(:require [re-frame.core :as re-frame]
[status-im.react-native.resources :as resources]
[status-im.ui.screens.hardwallet.connect.styles :as styles]
[status-im.ui.components.icons.vector-icons :as vector-icons]
[status-im.ui.components.react :as react]
[status-im.ui.components.toolbar.view :as toolbar]
[status-im.ui.components.styles :as components.styles]
[status-im.ui.components.status-bar.view :as status-bar]
[status-im.i18n :as i18n]
[status-im.ui.components.colors :as colors]))
(defview hardwallet-connect []
(letsubs [nfc-enabled? [:hardwallet/nfc-enabled?]]
[react/view styles/container
[status-bar/status-bar]
[react/view components.styles/flex
[toolbar/toolbar {}
toolbar/default-nav-back
nil
[toolbar/actions [{:icon :icons/info
:icon-opts {:color :black
:accessibility-label :hardwallet-connect-info-button}
:handler #(re-frame/dispatch [:open-url-in-browser "https://hardwallet.status.im"])}]]]
[react/view styles/hardwallet-connect
[react/view styles/hardwallet-card-image-container
[react/image {:source (:hardwallet-card resources/ui)
:style styles/hardwallet-card-image}]]
[react/view styles/status-hardwallet-text-container
[react/text {:style styles/status-hardwallet-text}
(i18n/label :t/status-hardwallet)]
[react/text {:style styles/status-hardwallet-text}
(i18n/label :t/secure-your-assets)]
[react/text {:style styles/link-card-text
:number-of-lines 2}
(i18n/label :t/link-card)]]
[react/view styles/bottom-action-container
(if nfc-enabled?
[react/view styles/nfc-enabled-container
[react/image {:source (:phone-nfc resources/ui)
:style styles/phone-nfc-image}]
[react/image {:source (:hardwallet-card resources/ui)
:style styles/hardwallet-card-image-small}]
[react/text {:style styles/hold-card-text
:number-of-lines 2
:uppercase? true}
(i18n/label :t/hold-card)]]
[react/view styles/nfc-disabled-container
[vector-icons/icon :icons/nfc {:color colors/gray
:container-style styles/nfc-icon}]
[react/view styles/nfc-disabled-actions-container
[react/text {:style styles/turn-nfc-text
:font :medium
:on-press #(re-frame/dispatch [:hardwallet.ui/go-to-settings-button-pressed])
:uppercase? true}
(i18n/label :t/turn-nfc-on)]
[react/text {:style styles/go-to-settings-text
:on-press #(re-frame/dispatch [:hardwallet.ui/go-to-settings-button-pressed])}
(i18n/label :t/go-to-settings)]]])]]]]))

View File

@ -21,7 +21,8 @@
status-im.ui.screens.browser.subs
status-im.ui.screens.add-new.new-chat.subs
status-im.ui.screens.add-new.new-public-chat.subs
status-im.ui.screens.profile.subs))
status-im.ui.screens.profile.subs
status-im.ui.screens.hardwallet.connect.subs))
(reg-sub :get
(fn [db [_ k]]

View File

@ -56,6 +56,8 @@
[status-im.ui.screens.add-new.open-dapp.views :refer [open-dapp dapp-description]]
[status-im.ui.screens.intro.views :refer [intro]]
[status-im.ui.screens.accounts.create.views :refer [create-account]]
[status-im.ui.screens.hardwallet.authentication-method.views :refer [hardwallet-authentication-method]]
[status-im.ui.screens.hardwallet.connect.views :refer [hardwallet-connect]]
[status-im.ui.screens.profile.seed.views :refer [backup-seed]]
[status-im.ui.screens.about-app.views :as about-app]
[status-im.utils.navigation :as navigation]
@ -124,11 +126,13 @@
{:screen
(nav-reagent/stack-navigator
(stack-screens
(cond-> {:login login
:progress progress
:create-account create-account
:recover recover
:accounts accounts}
(cond-> {:login login
:progress progress
:create-account create-account
:recover recover
:accounts accounts
:hardwallet/authentication-method hardwallet-authentication-method
:hardwallet/connect hardwallet-connect}
(= :intro view-id)
(assoc :intro intro)))
(cond-> {:headerMode "none"}
@ -246,29 +250,31 @@
{:screen
(nav-reagent/stack-navigator
(stack-screens
{:my-profile (main-tabs/get-main-tab :my-profile)
:profile-photo-capture profile-photo-capture
:about-app about-app/about-app
:bootnodes-settings bootnodes-settings
:edit-bootnode edit-bootnode
:offline-messaging-settings offline-messaging-settings
:edit-mailserver edit-mailserver
:help-center help-center
:extensions-settings extensions-settings
:add-extension add-extension
:show-extension show-extension
:network-settings network-settings
:network-details network-details
:edit-network edit-network
:log-level-settings log-level-settings
:fleet-settings fleet-settings
:currency-settings currency-settings
:backup-seed backup-seed
:login login
:create-account create-account
:recover recover
:accounts accounts
:qr-scanner qr-scanner})
{:my-profile (main-tabs/get-main-tab :my-profile)
:profile-photo-capture profile-photo-capture
:about-app about-app/about-app
:bootnodes-settings bootnodes-settings
:edit-bootnode edit-bootnode
:offline-messaging-settings offline-messaging-settings
:edit-mailserver edit-mailserver
:help-center help-center
:extensions-settings extensions-settings
:add-extension add-extension
:show-extension show-extension
:network-settings network-settings
:network-details network-details
:edit-network edit-network
:log-level-settings log-level-settings
:fleet-settings fleet-settings
:currency-settings currency-settings
:backup-seed backup-seed
:login login
:create-account create-account
:recover recover
:accounts accounts
:hardwallet/authentication-method hardwallet-authentication-method
:hardwallet/connect hardwallet-connect
:qr-scanner qr-scanner})
{:headerMode "none"
:initialRouteName "my-profile"})}
:profile-qr-viewer

View File

@ -27,6 +27,7 @@
(def cached-webviews-enabled? (enabled? (get-config :CACHED_WEBVIEWS_ENABLED 0)))
(def rn-bridge-threshold-warnings-enabled? (enabled? (get-config :RN_BRIDGE_THRESHOLD_WARNINGS 0)))
(def extensions-enabled? (enabled? (get-config :EXTENSIONS 0)))
(def hardwallet-enabled? (enabled? (get-config :HARDWALLET_ENABLED 0)))
;; CONFIG VALUES
(def log-level

View File

@ -17,6 +17,7 @@
(def orientation #js {})
(def popup-menu #js {})
(def qr-code #js {})
(def nfc-manager #js {:default #js {}})
(def react-native
#js {:NativeModules #js {}
:Animated #js {:View #js {}

View File

@ -704,5 +704,13 @@
"send-request-amount-invalid-number": "Amount is not a valid number",
"send-request-amount-max-decimals": "Max number of decimals is {{asset-decimals}}",
"send-command-payment": "Send a payment",
"request-command-payment": "Request a payment"
"request-command-payment": "Request a payment",
"choose-authentication-method": "Choose an authentication method to protect your account",
"status-hardwallet-capitalized": "Status Hardwallet",
"status-hardwallet": "Status hardwallet",
"secure-your-assets": "secure your assets",
"link-card": "Link the card and use it to confirm your identity on the platform.",
"hold-card": "hold card to the back of your phone",
"turn-nfc-on": "turn nfc on",
"go-to-settings": "Go to Settings"
}