[#8993] adjust pin screens for small screen devices
find account by key-uid show pairing slots info on pairing fix pin reset flow pass retry-counter fix sign with keycard button in wallet Signed-off-by: Dmitry Novotochinov <dmitry.novot@gmail.com>
This commit is contained in:
parent
2bb7c70216
commit
5e7785d432
|
@ -47,14 +47,14 @@
|
|||
|
||||
(defn get-pairing
|
||||
([db]
|
||||
(get-pairing db (get-in db [:hardwallet :application-info :instance-uid])))
|
||||
([db instance-uid]
|
||||
(get-pairing db (get-in db [:hardwallet :application-info :key-uid])))
|
||||
([db key-uid]
|
||||
(or
|
||||
(get-in db [:multiaccount :keycard-pairing])
|
||||
(get-in db [:hardwallet :secrets :pairing])
|
||||
(when instance-uid
|
||||
(when key-uid
|
||||
(:keycard-pairing
|
||||
(find-multiaccount-by-keycard-instance-uid db instance-uid))))))
|
||||
(find-multiaccount-by-keycard-key-uid db key-uid))))))
|
||||
|
||||
(fx/defn listen-to-hardware-back-button
|
||||
[{:keys [db]}]
|
||||
|
@ -439,7 +439,7 @@
|
|||
(let [app-info (get-in db [:hardwallet :application-info])
|
||||
flow (get-in db [:hardwallet :flow])
|
||||
{:keys [instance-uid key-uid]} app-info
|
||||
pairing (get-pairing db instance-uid)
|
||||
pairing (get-pairing db key-uid)
|
||||
app-info' (if pairing (assoc app-info :paired? true) app-info)
|
||||
card-state (get-card-state app-info')]
|
||||
(fx/merge cofx
|
||||
|
@ -626,6 +626,9 @@
|
|||
(fx/merge cofx
|
||||
{:db (-> db
|
||||
(assoc-in [:hardwallet :pin :enter-step] enter-step)
|
||||
(update-in [:hardwallet :pin :error-label] #(if (= :puk enter-step)
|
||||
:t/enter-puk-code-description
|
||||
%))
|
||||
(assoc-in [:hardwallet :application-info] info')
|
||||
(assoc-in [:hardwallet :application-info :applet-installed?] true)
|
||||
(assoc-in [:hardwallet :application-info-error] nil))}
|
||||
|
@ -1061,6 +1064,7 @@
|
|||
(update-in [:hardwallet :pin] merge {:status nil
|
||||
:enter-step :original
|
||||
:current [0 0 0 0 0 0]
|
||||
:confirmation []
|
||||
:puk []
|
||||
:error-label nil}))}
|
||||
(navigation/navigate-to-cofx :enter-pin-settings nil))))
|
||||
|
@ -1076,10 +1080,10 @@
|
|||
:puk []})}))
|
||||
(fx/defn get-application-info
|
||||
[{:keys [db]} pairing on-card-read]
|
||||
(let [instance-uid (get-in db [:hardwallet :application-info :instance-uid])
|
||||
(let [key-uid (get-in db [:hardwallet :application-info :key-uid])
|
||||
pairing' (or pairing
|
||||
(when instance-uid
|
||||
(get-pairing db instance-uid)))]
|
||||
(when key-uid
|
||||
(get-pairing db key-uid)))]
|
||||
{:hardwallet/get-application-info {:pairing pairing'
|
||||
:on-success on-card-read}}))
|
||||
|
||||
|
@ -1140,15 +1144,22 @@
|
|||
|
||||
(fx/defn on-change-pin-success
|
||||
[{:keys [db] :as cofx}]
|
||||
(let [pin (vector->string (get-in db [:hardwallet :pin :original]))]
|
||||
(let [pin (get-in db [:hardwallet :pin :original])]
|
||||
(fx/merge cofx
|
||||
{:db (-> db
|
||||
(assoc-in [:hardwallet :on-card-connected] nil)
|
||||
(assoc-in [:hardwallet :pin] {:status nil
|
||||
:login pin
|
||||
:confirmation []
|
||||
:error-label nil}))
|
||||
:utils/show-popup {:title ""
|
||||
:content (i18n/label :t/pin-changed)}}
|
||||
(multiaccounts.logout/logout))))
|
||||
(when (:multiaccounts/login db)
|
||||
(navigation/navigate-to-cofx :keycard-login-pin nil))
|
||||
(when (:multiaccounts/login db)
|
||||
(get-keys-from-keycard))
|
||||
(when (:multiaccount/multiaccount db)
|
||||
(multiaccounts.logout/logout)))))
|
||||
|
||||
(fx/defn on-change-pin-error
|
||||
[{:keys [db] :as cofx} error]
|
||||
|
@ -1228,9 +1239,9 @@
|
|||
(defn unblock-pin
|
||||
[{:keys [db] :as cofx}]
|
||||
(let [puk (vector->string (get-in db [:hardwallet :pin :puk]))
|
||||
instance-uid (get-in db [:hardwallet :application-info :instance-uid])
|
||||
key-uid (get-in db [:hardwallet :application-info :key-uid])
|
||||
card-connected? (get-in db [:hardwallet :card-connected?])
|
||||
pairing (get-pairing db instance-uid)]
|
||||
pairing (get-pairing db key-uid)]
|
||||
(if card-connected?
|
||||
{:db (assoc-in db [:hardwallet :pin :status] :verifying)
|
||||
:hardwallet/unblock-pin {:puk puk
|
||||
|
@ -1322,7 +1333,8 @@
|
|||
[{:keys [db] :as cofx}]
|
||||
(let [{:keys [pairing]} (get-in db [:hardwallet :secrets])
|
||||
instance-uid (get-in db [:hardwallet :application-info :instance-uid])
|
||||
pairing' (or pairing (get-pairing db instance-uid))
|
||||
key-uid (get-in db [:hardwallet :application-info :key-uid])
|
||||
pairing' (or pairing (get-pairing db key-uid))
|
||||
pin (vector->string (get-in db [:hardwallet :pin :import-multiaccount]))]
|
||||
(fx/merge cofx
|
||||
{:db (-> db
|
||||
|
@ -1426,13 +1438,14 @@
|
|||
[{:keys [db] :as cofx} _]
|
||||
(log/debug "[hardwallet] card connected")
|
||||
(let [instance-uid (get-in db [:hardwallet :application-info :instance-uid])
|
||||
key-uid (get-in db [:hardwallet :application-info :key-uid])
|
||||
accounts-screen? (= :multiaccounts (:view-id db))
|
||||
should-read-instance-uid? (nil? instance-uid)
|
||||
on-card-connected (get-in db [:hardwallet :on-card-connected])
|
||||
on-card-read (cond
|
||||
should-read-instance-uid? :hardwallet/get-application-info
|
||||
:else (get-in db [:hardwallet :on-card-read]))
|
||||
pairing (get-pairing db instance-uid)]
|
||||
pairing (get-pairing db key-uid)]
|
||||
(fx/merge cofx
|
||||
{:db (-> db
|
||||
(assoc-in [:hardwallet :card-connected?] true)
|
||||
|
@ -1749,7 +1762,7 @@
|
|||
(let [{:keys [address whisper-address encryption-public-key whisper-private-key] :as account-data} (js->clj data :keywordize-keys true)
|
||||
address (str "0x" address)
|
||||
{:keys [photo-path name]} (get-in db [:multiaccounts/multiaccounts address])
|
||||
instance-uid (get-in db [:hardwallet :application-info :instance-uid])
|
||||
key-uid (get-in db [:hardwallet :application-info :key-uid])
|
||||
multiaccount-data (types/clj->json {:name name :address address :photo-path photo-path})]
|
||||
(fx/merge cofx
|
||||
{:db (-> db
|
||||
|
@ -1762,7 +1775,7 @@
|
|||
:address address
|
||||
:photo-path photo-path
|
||||
:name name))
|
||||
:hardwallet/get-application-info {:pairing (get-pairing db instance-uid)}
|
||||
:hardwallet/get-application-info {:pairing (get-pairing db key-uid)}
|
||||
:hardwallet/login-with-keycard {:multiaccount-data multiaccount-data
|
||||
:password encryption-public-key
|
||||
:chat-key whisper-private-key}})))
|
||||
|
@ -1771,7 +1784,7 @@
|
|||
[{:keys [db] :as cofx} error]
|
||||
(log/debug "[hardwallet] get keys error: " error)
|
||||
(let [tag-was-lost? (= "Tag was lost." (:error error))
|
||||
instance-uid (get-in db [:hardwallet :application-info :instance-uid])
|
||||
key-uid (get-in db [:hardwallet :application-info :key-uid])
|
||||
flow (get-in db [:hardwallet :flow])]
|
||||
(if tag-was-lost?
|
||||
(fx/merge cofx
|
||||
|
@ -1779,7 +1792,7 @@
|
|||
(navigation/navigate-to-cofx :keycard-connection-lost nil))
|
||||
(if (re-matches pin-mismatch-error (:error error))
|
||||
(fx/merge cofx
|
||||
{:hardwallet/get-application-info {:pairing (get-pairing db instance-uid)}
|
||||
{:hardwallet/get-application-info {:pairing (get-pairing db key-uid)}
|
||||
:db (update-in db [:hardwallet :pin] merge {:status :error
|
||||
:login []
|
||||
:import-multiaccount []
|
||||
|
|
|
@ -334,6 +334,12 @@
|
|||
:<- [:dimensions/window]
|
||||
:height)
|
||||
|
||||
(re-frame/reg-sub
|
||||
:dimensions/small-screen?
|
||||
:<- [:dimensions/window-height]
|
||||
(fn [height]
|
||||
(< height 550)))
|
||||
|
||||
(re-frame/reg-sub
|
||||
:get-screen-params
|
||||
:<- [:screen-params]
|
||||
|
|
|
@ -9,16 +9,16 @@
|
|||
(styles/def pin-container
|
||||
{:flex 1
|
||||
:flex-direction :column
|
||||
:justify-content :space-between
|
||||
:android {:margin-top 10}
|
||||
:ios {:margin-top 10}})
|
||||
:justify-content :space-between})
|
||||
|
||||
(styles/def error-container
|
||||
{:height 22})
|
||||
(styles/defn error-container [small-screen?]
|
||||
{:height (if small-screen? 18 22)
|
||||
:margin-top (if small-screen? 14 10)
|
||||
:margin-bottom (if small-screen? 10 0)})
|
||||
|
||||
(def error-text
|
||||
(defn error-text [small-screen?]
|
||||
{:color colors/red
|
||||
:font-size 15
|
||||
:font-size (if small-screen? 12 15)
|
||||
:text-align :center})
|
||||
|
||||
(defn center-container [title]
|
||||
|
@ -59,29 +59,29 @@
|
|||
{:margin-top 26})
|
||||
|
||||
(def numpad-container
|
||||
{:margin-top 20})
|
||||
{:margin-top 18})
|
||||
|
||||
(def numpad-row-container
|
||||
(defn numpad-row-container [small-screen?]
|
||||
{:flex-direction :row
|
||||
:justify-content :center
|
||||
:align-items :center
|
||||
:margin-vertical 12})
|
||||
:margin-vertical (if small-screen? 4 10)})
|
||||
|
||||
(def numpad-button
|
||||
{:width 64
|
||||
:margin-horizontal 16
|
||||
:height 64
|
||||
(defn numpad-button [small-screen?]
|
||||
{:width (if small-screen? 50 64)
|
||||
:margin-horizontal (if small-screen? 10 14)
|
||||
:height (if small-screen? 50 64)
|
||||
:align-items :center
|
||||
:justify-content :center
|
||||
:flex-direction :row
|
||||
:border-radius 50
|
||||
:background-color colors/blue-light})
|
||||
|
||||
(def numpad-delete-button
|
||||
(assoc numpad-button :background-color colors/white))
|
||||
(defn numpad-delete-button [small-screen?]
|
||||
(assoc (numpad-button small-screen?) :background-color colors/white))
|
||||
|
||||
(def numpad-empty-button
|
||||
(assoc numpad-button :background-color colors/white
|
||||
(defn numpad-empty-button [small-screen?]
|
||||
(assoc (numpad-button small-screen?) :background-color colors/white
|
||||
:border-color colors/white))
|
||||
|
||||
(def numpad-button-text
|
||||
|
|
|
@ -12,32 +12,32 @@
|
|||
[status-im.ui.components.toolbar.actions :as actions]
|
||||
[status-im.ui.components.toolbar.actions :as toolbar.actions]))
|
||||
|
||||
(defn numpad-button [n step enabled?]
|
||||
(defn numpad-button [n step enabled? small-screen?]
|
||||
[react/touchable-highlight
|
||||
{:on-press #(when enabled?
|
||||
(re-frame/dispatch [:hardwallet.ui/pin-numpad-button-pressed n step]))}
|
||||
[react/view styles/numpad-button
|
||||
[react/view (styles/numpad-button small-screen?)
|
||||
[react/text {:style styles/numpad-button-text}
|
||||
n]]])
|
||||
|
||||
(defn numpad-row [[a b c] step enabled?]
|
||||
[react/view styles/numpad-row-container
|
||||
[numpad-button a step enabled?]
|
||||
[numpad-button b step enabled?]
|
||||
[numpad-button c step enabled?]])
|
||||
(defn numpad-row [[a b c] step enabled? small-screen?]
|
||||
[react/view (styles/numpad-row-container small-screen?)
|
||||
[numpad-button a step enabled? small-screen?]
|
||||
[numpad-button b step enabled? small-screen?]
|
||||
[numpad-button c step enabled? small-screen?]])
|
||||
|
||||
(defn numpad [step enabled?]
|
||||
(defn numpad [step enabled? small-screen?]
|
||||
[react/view styles/numpad-container
|
||||
[numpad-row [1 2 3] step enabled?]
|
||||
[numpad-row [4 5 6] step enabled?]
|
||||
[numpad-row [7 8 9] step enabled?]
|
||||
[react/view styles/numpad-row-container
|
||||
[react/view styles/numpad-empty-button]
|
||||
[numpad-button 0 step enabled?]
|
||||
[numpad-row [1 2 3] step enabled? small-screen?]
|
||||
[numpad-row [4 5 6] step enabled? small-screen?]
|
||||
[numpad-row [7 8 9] step enabled? small-screen?]
|
||||
[react/view (styles/numpad-row-container small-screen?)
|
||||
[react/view (styles/numpad-empty-button small-screen?)]
|
||||
[numpad-button 0 step enabled? small-screen?]
|
||||
[react/touchable-highlight
|
||||
{:on-press #(when enabled?
|
||||
(re-frame/dispatch [:hardwallet.ui/pin-numpad-delete-button-pressed step]))}
|
||||
[react/view styles/numpad-delete-button
|
||||
[react/view (styles/numpad-delete-button small-screen?)
|
||||
[vector-icons/icon :main-icons/backspace {:color colors/blue}]]]]])
|
||||
|
||||
(defn pin-indicator [pressed? status]
|
||||
|
@ -60,18 +60,18 @@
|
|||
nil)))))])
|
||||
|
||||
(defn puk-indicators [puk status]
|
||||
[react/view
|
||||
[react/view {:margin-top 28}
|
||||
(map-indexed
|
||||
(fn [i puk-group]
|
||||
^{:key i}
|
||||
[pin-indicators puk-group status {:margin-top 15}])
|
||||
[pin-indicators puk-group status {:margin-top 8}])
|
||||
(partition 6
|
||||
(concat puk
|
||||
(repeat (- 12 (count puk))
|
||||
nil))))])
|
||||
|
||||
(defn pin-view [{:keys [pin title-label description-label step status error-label
|
||||
retry-counter]}]
|
||||
retry-counter small-screen?]}]
|
||||
(let [enabled? (not= status :verifying)]
|
||||
[react/scroll-view
|
||||
[react/view styles/pin-container
|
||||
|
@ -83,24 +83,23 @@
|
|||
[react/text {:style styles/create-pin-text
|
||||
:number-of-lines 2}
|
||||
(i18n/label description-label)])
|
||||
[react/view {:height 10}
|
||||
(when retry-counter
|
||||
[react/text {:style {:font-weight "700"
|
||||
:color colors/red}}
|
||||
(i18n/label :t/pin-retries-left {:number retry-counter})])]
|
||||
[react/view {:height 22}
|
||||
[react/view {:margin-top 40
|
||||
:height (if small-screen? 18 22)}
|
||||
(case status
|
||||
:verifying [react/view styles/waiting-indicator-container
|
||||
[react/activity-indicator {:animating true
|
||||
:size :small}]]
|
||||
:error [react/view styles/error-container
|
||||
[react/text {:style styles/error-text}
|
||||
:error [react/view (styles/error-container small-screen?)
|
||||
[react/text {:style (styles/error-text small-screen?)}
|
||||
(i18n/label error-label)]]
|
||||
nil)]
|
||||
(when retry-counter
|
||||
[react/view {:margin-top (if (= step :puk) 24 8)}
|
||||
[react/text {:style {:text-align :center}}
|
||||
(i18n/label :t/pin-retries-left {:number retry-counter})]]))]
|
||||
(if (= step :puk)
|
||||
[puk-indicators pin status]
|
||||
[pin-indicators pin status nil])
|
||||
[numpad step enabled?]]]]))
|
||||
[numpad step enabled? small-screen?]]]]))
|
||||
|
||||
(def pin-retries 3)
|
||||
(def puk-retries 5)
|
||||
|
|
|
@ -29,6 +29,18 @@
|
|||
(fn [db]
|
||||
(get-in db [:hardwallet :application-info :puk-retry-counter])))
|
||||
|
||||
(re-frame/reg-sub
|
||||
:hardwallet/retry-counter
|
||||
:<- [:hardwallet/pin-retry-counter]
|
||||
:<- [:hardwallet/puk-retry-counter]
|
||||
(fn [[pin puk]]
|
||||
(if (zero? pin) puk pin)))
|
||||
|
||||
(re-frame/reg-sub
|
||||
:hardwallet/puk-retry-counter
|
||||
(fn [db]
|
||||
(get-in db [:hardwallet :application-info :puk-retry-counter])))
|
||||
|
||||
(re-frame/reg-sub
|
||||
:keycard-reset-card-disabled?
|
||||
(fn [db]
|
||||
|
|
|
@ -238,7 +238,8 @@
|
|||
enter-step [:hardwallet/pin-enter-step]
|
||||
status [:hardwallet/pin-status]
|
||||
error-label [:hardwallet/pin-error-label]
|
||||
steps [:hardwallet-flow-steps]]
|
||||
steps [:hardwallet-flow-steps]
|
||||
small-screen? [:dimensions/small-screen?]]
|
||||
[react/view styles/container
|
||||
[toolbar/toolbar
|
||||
{:transparent? true
|
||||
|
@ -256,20 +257,21 @@
|
|||
:align-items :center}
|
||||
[react/view {:flex-direction :column
|
||||
:align-items :center}
|
||||
[react/view {:margin-top 16}
|
||||
[react/view {:margin-top (if small-screen? 4 16)}
|
||||
[react/text {:style {:typography :header
|
||||
:text-align :center}}
|
||||
(i18n/label (if (= :original enter-step)
|
||||
:t/intro-wizard-title4
|
||||
:t/intro-wizard-title5))]]
|
||||
[react/view {:margin-top 16
|
||||
:height 22}
|
||||
[react/view {:margin-top (if small-screen? 8 16)
|
||||
:height (if small-screen? 16 22)}
|
||||
(when (= :original enter-step)
|
||||
[react/text {:style {:color colors/gray}}
|
||||
(i18n/label :t/intro-wizard-text4)])]]
|
||||
[pin.views/pin-view
|
||||
{:pin pin
|
||||
:status status
|
||||
:small-screen? small-screen?
|
||||
:error-label error-label
|
||||
:step enter-step}]
|
||||
[react/view {:align-items :center
|
||||
|
|
|
@ -114,7 +114,9 @@
|
|||
(defview pin []
|
||||
(letsubs [pin [:hardwallet/pin]
|
||||
status [:hardwallet/pin-status]
|
||||
error-label [:hardwallet/pin-error-label]]
|
||||
error-label [:hardwallet/pin-error-label]
|
||||
small-screen? [:dimensions/small-screen?]
|
||||
retry-counter [:hardwallet/retry-counter]]
|
||||
[react/view styles/container
|
||||
[toolbar/toolbar
|
||||
{:transparent? true
|
||||
|
@ -138,6 +140,8 @@
|
|||
(i18n/label :t/enter-your-code)]]]
|
||||
[pin.views/pin-view
|
||||
{:pin pin
|
||||
:retry-counter retry-counter
|
||||
:small-screen? small-screen?
|
||||
:status status
|
||||
:error-label error-label
|
||||
:step :import-multiaccount}]]]))
|
||||
|
@ -145,6 +149,7 @@
|
|||
(defview pair []
|
||||
(letsubs [pair-code [:hardwallet-pair-code]
|
||||
error [:hardwallet-setup-error]
|
||||
{:keys [free-pairing-slots]} [:hardwallet-application-info]
|
||||
width [:dimensions/window-width]
|
||||
ref (atom nil)]
|
||||
[react/view styles/container
|
||||
|
@ -173,7 +178,13 @@
|
|||
:align-items :center}
|
||||
[react/text {:style {:color colors/gray
|
||||
:text-align :center}}
|
||||
(i18n/label :t/enter-pair-code-description)]]]
|
||||
(i18n/label :t/enter-pair-code-description)]]
|
||||
(when free-pairing-slots
|
||||
[react/view {:align-items :center
|
||||
:margin-top 20}
|
||||
[react/text {:style {:text-align :center
|
||||
:color (if (> 3 free-pairing-slots) colors/red colors/gray)}}
|
||||
(i18n/label :t/keycard-free-pairing-slots {:n free-pairing-slots})]])]
|
||||
[react/view
|
||||
[text-input/text-input-with-label
|
||||
{:on-change-text #(re-frame/dispatch [:keycard.onboarding.pair.ui/input-changed %])
|
||||
|
|
|
@ -365,7 +365,9 @@
|
|||
status [:hardwallet/pin-status]
|
||||
error-label [:hardwallet/pin-error-label]
|
||||
multiple-multiaccounts? [:multiple-multiaccounts?]
|
||||
{:keys [address name] :as account} [:multiaccounts/login]]
|
||||
{:keys [address name] :as account} [:multiaccounts/login]
|
||||
small-screen? [:dimensions/small-screen?]
|
||||
retry-counter [:hardwallet/retry-counter]]
|
||||
[react/view styles/container
|
||||
[toolbar/toolbar
|
||||
{:transparent? true
|
||||
|
@ -386,7 +388,7 @@
|
|||
:flex-direction :column
|
||||
:justify-content :space-between
|
||||
:align-items :center
|
||||
:margin-top 60}
|
||||
:margin-top (if small-screen? 28 46)}
|
||||
[react/view {:flex-direction :column
|
||||
:flex 1
|
||||
:justify-content :center
|
||||
|
@ -396,17 +398,17 @@
|
|||
[react/view {:justify-content :center
|
||||
:align-items :center
|
||||
:flex-direction :row}
|
||||
[react/view {:width 69
|
||||
:height 69
|
||||
[react/view {:width (if small-screen? 50 69)
|
||||
:height (if small-screen? 50 69)
|
||||
:justify-content :center
|
||||
:align-items :center}
|
||||
;;TODO this should be done in a subscription
|
||||
[photos/photo (multiaccounts/displayed-photo account) {:size 61}]
|
||||
[photos/photo (multiaccounts/displayed-photo account) {:size (if small-screen? 45 61)}]
|
||||
[react/view {:justify-content :center
|
||||
:align-items :center
|
||||
:width 24
|
||||
:height 24
|
||||
:border-radius 24
|
||||
:width (if small-screen? 18 24)
|
||||
:height (if small-screen? 18 24)
|
||||
:border-radius (if small-screen? 18 24)
|
||||
:position :absolute
|
||||
:right 0
|
||||
:bottom 0
|
||||
|
@ -414,10 +416,10 @@
|
|||
:border-width 1
|
||||
:border-color colors/black-transparent}
|
||||
[react/image {:source (resources/get-image :keycard-key)
|
||||
:style {:width 8
|
||||
:height 14}}]]]]
|
||||
:style {:width (if small-screen? 6 8)
|
||||
:height (if small-screen? 11 14)}}]]]]
|
||||
[react/text {:style {:text-align :center
|
||||
:margin-top 12
|
||||
:margin-top (if small-screen? 8 12)
|
||||
:color colors/black
|
||||
:font-weight "500"}
|
||||
:number-of-lines 1
|
||||
|
@ -432,10 +434,12 @@
|
|||
(utils.core/truncate-str address 14 true)]]]
|
||||
[pin.views/pin-view
|
||||
{:pin pin
|
||||
:retry-counter retry-counter
|
||||
:small-screen? small-screen?
|
||||
:status status
|
||||
:error-label error-label
|
||||
:step enter-step}]
|
||||
[react/view {:margin-bottom 32}
|
||||
[react/view {:margin-bottom (if small-screen? 25 32)}
|
||||
[react/touchable-highlight
|
||||
{:on-press #(re-frame/dispatch [:keycard.login.ui/recover-key-pressed])}
|
||||
[react/text {:style {:color colors/blue}}
|
||||
|
|
|
@ -40,3 +40,22 @@
|
|||
:border-top-right-radius 16
|
||||
:border-top-left-radius 16
|
||||
:padding-bottom 40})
|
||||
|
||||
(defn sign-with-keycard-button [disabled?]
|
||||
{:background-color colors/black-light
|
||||
:padding-top 2
|
||||
:border-radius 8
|
||||
:width 182
|
||||
:height 44
|
||||
:flex-direction :row
|
||||
:justify-content :center
|
||||
:align-items :center
|
||||
:opacity (if disabled? 0.1 1)
|
||||
:padding-horizontal 12})
|
||||
|
||||
(defn sign-with-keycard-button-text [disabled?]
|
||||
{:padding-right 2
|
||||
:padding-left 16
|
||||
:color (if disabled? colors/black colors/white)
|
||||
:padding-horizontal 16
|
||||
:padding-vertical 10})
|
||||
|
|
|
@ -111,14 +111,20 @@
|
|||
[react/text {:style {:color colors/blue}} (i18n/label :t/cancel)]]]])
|
||||
|
||||
(views/defview keycard-pin-view []
|
||||
(views/letsubs [pin [:hardwallet/pin]]
|
||||
(views/letsubs [pin [:hardwallet/pin]
|
||||
small-screen? [:dimensions/small-screen?]
|
||||
error-label [:hardwallet/pin-error-label]
|
||||
enter-step [:hardwallet/pin-enter-step]
|
||||
status [:hardwallet/pin-status]
|
||||
retry-counter [:hardwallet/retry-counter]]
|
||||
[react/view
|
||||
[pin.views/pin-view
|
||||
{:pin pin
|
||||
:retry-counter nil
|
||||
:step :sign
|
||||
:status nil
|
||||
:error-label nil}]]))
|
||||
:retry-counter retry-counter
|
||||
:step enter-step
|
||||
:small-screen? small-screen?
|
||||
:status status
|
||||
:error-label error-label}]]))
|
||||
|
||||
(defn- keycard-connect-view []
|
||||
[react/view {:padding-vertical 20
|
||||
|
@ -145,11 +151,19 @@
|
|||
:color colors/gray}}
|
||||
(i18n/label :t/processing)]])
|
||||
|
||||
(defn- sign-with-keycard-button
|
||||
(defn sign-with-keycard-button
|
||||
[amount-error gas-error]
|
||||
[button/button {:on-press #(re-frame/dispatch [:signing.ui/sign-with-keycard-pressed])
|
||||
:disabled? (or amount-error gas-error)
|
||||
:label :t/sign-with-keycard}])
|
||||
(let [disabled? (or amount-error gas-error)]
|
||||
[react/touchable-highlight {:on-press #(when-not disabled?
|
||||
(re-frame/dispatch [:signing.ui/sign-with-keycard-pressed]))}
|
||||
[react/view (styles/sign-with-keycard-button disabled?)
|
||||
[react/text {:style (styles/sign-with-keycard-button-text disabled?)}
|
||||
(i18n/label :t/sign-with)]
|
||||
[react/view {:padding-right 16}
|
||||
[react/image {:source (resources/get-image :keycard-logo)
|
||||
:style {:width 64
|
||||
:margin-bottom 7
|
||||
:height 26}}]]]]))
|
||||
|
||||
(defn- signing-phrase-view [phrase]
|
||||
[react/view {:align-items :center}
|
||||
|
@ -158,7 +172,7 @@
|
|||
|
||||
(defn- keycard-view
|
||||
[{:keys [keycard-step]} phrase]
|
||||
[react/view {:height 500}
|
||||
[react/view {:height 520}
|
||||
[signing-phrase-view phrase]
|
||||
(case keycard-step
|
||||
:pin [keycard-pin-view]
|
||||
|
|
|
@ -1118,5 +1118,6 @@
|
|||
"apply": "Apply",
|
||||
"on-status-tree": "On Status tree",
|
||||
"derivation-path": "Derivation path",
|
||||
"storage": "Storage"
|
||||
"storage": "Storage",
|
||||
"keycard-free-pairing-slots": "Keycard has {{n}} free pairing slots"
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue