Skip to content

Commit

Permalink
[status-im#18817] Import private key: UI for key pair name
Browse files Browse the repository at this point in the history 
Move files

Fix label

Enable feature and fix auto-focus

Add events and subs

Some fixes

Merge screens
  • Loading branch information
@Rende11
Rende11 committed May 2, 2024
1 parent 7b9f498 commit 538fffc
Show file tree
Hide file tree
Showing 11 changed files with 190 additions and 138 deletions.
1 change: 1 addition & 0 deletions src/quo/components/text_combinations/standard_title/style.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@

(def container
{:flex-direction :row
:flex 1
:justify-content :space-between})

(def right-counter
Expand Down
15 changes: 15 additions & 0 deletions src/status_im/contexts/wallet/add_account/create_account/events.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,3 +90,18 @@
(cske/transform-keys transforms/->kebab-case-keyword derived-address)))}))

(rf/reg-event-fx :wallet/get-derived-addresses-success get-derived-addresses-success)

(rf/reg-event-fx
:wallet/set-private-key
(fn [{:keys [db]} [value]]
{:db (assoc-in db [:wallet :ui :create-account :private-key] value)}))

(rf/reg-event-fx
:wallet/set-public-address
(fn [{:keys [db]} [value]]
{:db (assoc-in db [:wallet :ui :create-account :public-address] value)}))

(rf/reg-event-fx
:wallet/clear-private-key-data
(fn [{:keys [db]} _]
{:db (update-in db [:wallet :ui :create-account] dissoc :private-key :public-address)}))
98 changes: 54 additions & 44 deletions src/status_im/contexts/wallet/add_account/create_account/import_private_key/view.cljs
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
(ns status-im.contexts.wallet.add-account.create-account.import-private-key.view
(:require
[clojure.string :as string]
[quo.core :as quo]
[quo.theme :as theme]
[react-native.clipboard :as clipboard]
Expand All @@ -9,48 +10,54 @@
[status-im.contexts.wallet.common.validation :as v]
[utils.debounce :as debounce]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
[utils.re-frame :as rf]
[utils.security.core :as security]))

(defn- address-input
[{:keys [input-value set-input-value set-flow-state error?]}]
(let [check-address (rn/use-callback
(debounce/debounce (fn [v]
(if (empty? v)
(set-flow-state nil)
;; TODO check for validation
(if-not (v/private-key? v)
(set-flow-state :invalid-private-key)
;; TODO add real requests
(do
(set-flow-state :scanning)
(js/setTimeout
set-flow-state
400
(rand-nth [:active-address :inactive-address]))))))
500))
on-change (rn/use-callback
(fn [v]
(set-input-value v)
(check-address v)))
on-paste (rn/use-callback
(fn []
(clipboard/get-string
(fn [clipboard]
(when-not (empty? clipboard)
(on-change clipboard))))))]
[{:keys [input-value set-flow-state error?]}]
(let [check-address
(rn/use-callback
(debounce/debounce
(fn [v]
(if (empty? v)
(set-flow-state nil)
;; TODO check for validation
(if-not (v/private-key? v)
(set-flow-state :invalid-private-key)
;; TODO add real requests
(do
(set-flow-state :scanning)
;; TODO get real address
;; Should be fixed in #18819
(rf/dispatch [:wallet/set-public-address
"0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045"])
(js/setTimeout set-flow-state 400 (rand-nth [:active-address :inactive-address]))))))
500))

on-change (rn/use-callback
(fn [v]
(rf/dispatch [:wallet/set-private-key (security/mask-data v)])
(check-address v)))
on-paste (rn/use-callback
(fn []
(clipboard/get-string
(fn [clipboard]
(when-not (empty? clipboard)
(on-change clipboard))))))]
[quo/input
{:accessibility-label :add-address-to-watch
{:accessibility-label :import-private-key
:placeholder (i18n/label :t/enter-private-key-placeholder)
:container-style style/input
:label (i18n/label :t/private-key)
:type :password
:error? error?
:return-key-type :done
:auto-focus true
:on-change-text on-change
:button (when (empty? input-value)
{:on-press on-paste
:text (i18n/label :t/paste)})
:value input-value}]))
:default-value input-value}]))

(defn- activity-indicator
[state]
Expand Down Expand Up @@ -86,11 +93,13 @@

(defn view
[]
(let [theme (theme/use-theme)
customization-color (rf/sub [:profile/customization-color])
[input-value set-input-value] (rn/use-state "")
[flow-state set-flow-state] (rn/use-state)
error? (= :invalid-private-key flow-state)]
(let [theme (theme/use-theme)
customization-color (rf/sub [:profile/customization-color])
private-key (rf/sub [:wallet/import-private-key])
public-address (rf/sub [:wallet/public-address])
[flow-state set-flow-state] (rn/use-state)
error? (= :invalid-private-key flow-state)]
(rn/use-mount #(rf/dispatch [:wallet/clear-private-key-data]))
[rn/view {:flex 1}
[floating-button-page/view
{:customization-color customization-color
Expand All @@ -108,26 +117,27 @@
(i18n/label :t/import-private-key-info)])
[quo/button
{:customization-color customization-color
:disabled? (or (empty? input-value) error?)
:on-press #()}
:disabled? (or (string/blank? private-key) error?)
:on-press #(rf/dispatch [:navigate-to
:screen/wallet.keypair-name
{:workflow :import-private-key}])}
(i18n/label :t/continue)]]}
[quo/page-top
{:container-style style/page-top
:title (i18n/label :t/import-private-key)
:description :text
:description-text (i18n/label :t/enter-private-key)}]
[address-input
{:input-value input-value
:set-input-value set-input-value
:set-flow-state set-flow-state
:error? error?}]
{:input-value private-key
:set-flow-state set-flow-state
:error? error?}]
(when (#{:scanning :active-address :inactive-address} flow-state)
[rn/view {:style style/key-section}
[quo/section-label
{:section (i18n/label :t/private-key-public-address)
:container-style style/section-label}]
;; TODO Get real address
[rn/view {:style (style/public-address flow-state theme)}
[quo/text "0xd8dA6BF26964aF9D7eEd9e03E53415D37aA96045"]]])
(when (seq input-value)
(when (seq public-address)
[rn/view {:style (style/public-address flow-state theme)}
[quo/text public-address]])])
(when (seq private-key)
[activity-indicator flow-state])]]))
12 changes: 12 additions & 0 deletions src/status_im/contexts/wallet/add_account/create_account/key_pair_name/style.cljs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
(ns status-im.contexts.wallet.add-account.create-account.key-pair-name.style)

(def top
{:margin-top 2})

(def input
{:padding-top 12
:padding-horizontal 20})

(def error-container
{:padding-horizontal 20
:padding-vertical 8})
88 changes: 88 additions & 0 deletions src/status_im/contexts/wallet/add_account/create_account/key_pair_name/view.cljs
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,88 @@
(ns status-im.contexts.wallet.add-account.create-account.key-pair-name.view
(:require
[clojure.string :as string]
[quo.core :as quo]
[react-native.core :as rn]
[status-im.common.floating-button-page.view :as floating-button-page]
[status-im.common.validation.general :as validators]
[status-im.contexts.wallet.add-account.create-account.key-pair-name.style :as style]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))

(def ^:private key-pair-name-max-length 15)
(def ^:private key-pair-name-min-length 5)

(def error-messages
{:too-long (i18n/label :t/key-name-error-length)
:too-short (i18n/label :t/key-name-error-too-short {:count key-pair-name-min-length})
:emoji (i18n/label :t/key-name-error-emoji)
:special-char (i18n/label :t/key-name-error-special-char)})

(defn navigate-back
[]
(rf/dispatch [:navigate-back]))

(defn view
[]
(let [{:keys [workflow]} (rf/sub [:get-screen-params])
customization-color (rf/sub [:profile/customization-color])
[key-pair-name set-key-pair-name] (rn/use-state "")
[error set-error] (rn/use-state nil)
on-change-text (rn/use-callback
(fn [value]
(set-key-pair-name value)
(cond
(> (count value) key-pair-name-max-length)
(set-error :too-long)

(< 0 (count value) key-pair-name-min-length)
(set-error :too-short)

(validators/has-emojis? value)
(set-error :emoji)

(validators/has-special-characters? value)
(set-error :special-char)

:else (set-error nil))))
on-continue (rn/use-callback
(fn [_]
(if (= :import-private-key workflow)
;; TODO issue #19759. Implement creation account from
;; private key
(js/alert "Implement it!")
(rf/dispatch [:wallet/new-keypair-continue
{:keypair-name key-pair-name}]))))
disabled? (or (some? error) (string/blank? key-pair-name))]
[rn/view {:style {:flex 1}}
[floating-button-page/view
{:customization-color customization-color
:header [quo/page-nav
{:icon-name :i/arrow-left
:on-press navigate-back
:accessibility-label :top-bar}]
:footer [quo/button
{:customization-color customization-color
:disabled? disabled?
:on-press on-continue}
(i18n/label :t/continue)]}
[quo/page-top
{:title (i18n/label :t/keypair-name)
:description-text (i18n/label :t/keypair-name-description)
:description :text
:container-style style/top}]
[quo/input
{:container-style style/input
:placeholder (i18n/label :t/keypair-name-input-placeholder)
:label (i18n/label :t/keypair-name)
:char-limit key-pair-name-max-length
:auto-focus true
:on-change-text on-change-text
:error error}]
(when error
[quo/info-message
{:type :error
:size :default
:icon :i/info
:container-style style/error-container}
(get error-messages error)])]]))
13 changes: 0 additions & 13 deletions src/status_im/contexts/wallet/add_account/create_account/new_keypair/keypair_name/style.cljs
View file

This file was deleted.

75 changes: 0 additions & 75 deletions src/status_im/contexts/wallet/add_account/create_account/new_keypair/keypair_name/view.cljs
View file

This file was deleted.

2 changes: 1 addition & 1 deletion src/status_im/contexts/wallet/add_account/create_account/select_keypair/view.cljs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@
{:icon :i/key
:accessibility-label :import-private-key
:label (i18n/label :t/import-private-key)
:on-press (when (ff/enabled? ::wallet.import-private-key)
:on-press (when (or true (ff/enabled? ::wallet.import-private-key))
#(rf/dispatch [:navigate-to :screen/wallet.import-private-key]))}]]])

(defn- parse-accounts
Expand Down

0 comments on commit 538fffc

Please sign in to comment.