chore(wallet): remove account confirmation UI (#18518)

This commit is contained in:
Nikolay 2024-01-22 21:00:07 +03:00 committed by GitHub
parent ca2b1d5c8e
commit 9c322397a2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
7 changed files with 162 additions and 24 deletions

View File

@ -76,15 +76,19 @@
(str description " · " (i18n/label :t/on-device))])
(defn- context-tag-subtitle
[{:keys [community-logo community-name]}]
[rn/view
{:accessibility-label :context-tag-wrapper
:style {:flex-wrap :wrap}}
[context-tag/view
{:type :community
:community-name community-name
:community-logo community-logo
:size 24}]])
[{:keys [context-tag-type community-logo community-name account-name emoji customization-color]}]
(let [tag-type (or context-tag-type :account)]
[rn/view
{:accessibility-label :context-tag-wrapper
:style {:flex-wrap :wrap}}
[context-tag/view
{:type tag-type
:account-name account-name
:emoji emoji
:community-name community-name
:community-logo community-logo
:size 24
:customization-color customization-color}]]))
(defn- description-subtitle
[{:keys [theme blur? description]}]
@ -95,7 +99,8 @@
description])
(defn- subtitle
[{:keys [type theme blur? keycard? networks description community-name community-logo]}]
[{:keys [type theme blur? keycard? networks description community-name community-logo
context-tag-type account-name emoji customization-color]}]
(cond
(= :keypair type)
[keypair-subtitle
@ -118,8 +123,12 @@
(= :context-tag type)
[context-tag-subtitle
{:community-logo community-logo
:community-name community-name}]
{:context-tag-type context-tag-type
:community-logo community-logo
:community-name community-name
:account-name account-name
:emoji emoji
:customization-color customization-color}]
(and (not= :label type) description)
[description-subtitle
@ -173,6 +182,7 @@
(defn- view-internal
[{:keys [title title-icon type theme description blur? community-name community-logo button-icon
account-name emoji
on-button-press
on-button-long-press
button-disabled? account-avatar-emoji account-avatar-type customization-color icon-avatar
@ -196,14 +206,17 @@
:theme theme
:blur? blur?}]
[subtitle
{:type type
:theme theme
:blur? blur?
:keycard? keycard?
:networks networks
:description description
:community-name community-name
:community-logo community-logo}]]
{:type type
:theme theme
:blur? blur?
:keycard? keycard?
:networks networks
:description description
:community-name community-name
:community-logo community-logo
:customization-color customization-color
:account-name account-name
:emoji emoji}]]
[right-icon
{:theme theme
:type type

View File

@ -20,7 +20,7 @@
network-image]
:or {subtitle-type :default}}]
[rn/view {:style style/subtitle-container}
(when (not= :small size)
(when (and subtitle-type (not= :small size))
[rn/view {:style (style/subtitle-icon-container subtitle-type)}
(case subtitle-type
:icon [icons/icon icon

View File

@ -10,6 +10,7 @@
[react-native.platform :as platform]
[reagent.core :as reagent]
[status-im.contexts.wallet.common.sheets.account-options.style :as style]
[status-im.contexts.wallet.common.sheets.remove-account.view :as remove-account]
[status-im.contexts.wallet.common.utils :as utils]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
@ -95,7 +96,11 @@
:icon :i/delete
:accessibility-label :remove-account
:label (i18n/label :t/remove-account)
:danger? true}]]]
:danger? true
:on-press #(rf/dispatch [:show-bottom-sheet
{:content
(fn []
[remove-account/view])}])}]]]
(when show-account-selector?
[:<>
[quo/divider-line {:container-style style/divider-label}]

View File

@ -0,0 +1,17 @@
(ns status-im.contexts.wallet.common.sheets.remove-account.style)
(def desc-container
{:padding-horizontal 20
:padding-top 4
:padding-bottom 12})
(def copy-container
{:margin-horizontal 20
:margin-top 4
:margin-bottom 8})
(def checkbox-container
{:flex-direction :row
:padding-horizontal 20
:padding-vertical 8
:gap 10})

View File

@ -0,0 +1,91 @@
(ns status-im.contexts.wallet.common.sheets.remove-account.view
(:require
[quo.core :as quo]
[quo.theme]
[react-native.clipboard :as clipboard]
[react-native.core :as rn]
[reagent.core :as reagent]
[status-im.contexts.wallet.common.sheets.remove-account.style :as style]
[status-im.contexts.wallet.common.utils :as utils]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
(defn- footer
[{:keys [submit-disabled?]}]
[quo/bottom-actions
{:actions :2-actions
:customization-color :danger
:button-one-label (i18n/label :t/remove)
:button-one-props {:on-press #(js/alert "Will be implemented")
:type :danger
:disabled? submit-disabled?}
:button-two-label (i18n/label :t/cancel)
:button-two-props {:on-press #(rf/dispatch [:hide-bottom-sheet])
:type :grey}}])
(defn- recovery-phase-flow
[]
(let [confirmed? (reagent/atom false)]
(fn [{:keys [name emoji path color] :as _account}]
(let [formatted-path (utils/format-derivation-path path)]
[:<>
[quo/drawer-top
{:title (i18n/label :t/remove-account-title)
:type :context-tag
:context-tag-type :account
:account-name name
:emoji emoji
:customization-color color}]
[rn/view {:style style/desc-container}
[quo/text {:weight :medium}
(i18n/label :t/remove-account-desc)]]
[quo/data-item
{:size :default
:status :default
:card? true
:title (i18n/label :t/derivation-path)
:custom-subtitle (fn []
[quo/text {:weight :medium}
formatted-path])
:icon-right? true
:right-icon :i/copy
:on-press (fn []
(rf/dispatch [:toasts/upsert
{:type :positive
:text (i18n/label :t/derivation-path-copied)}])
(clipboard/set-string formatted-path))
:container-style style/copy-container}]
[rn/pressable
{:style style/checkbox-container
:on-press #(swap! confirmed? not)}
[quo/selectors
{:type :checkbox
:customization-color color
:checked? @confirmed?
:on-change #(swap! confirmed? not)}]
[quo/text (i18n/label :t/remove-account-confirmation)]]
[footer {:submit-disabled? (not @confirmed?)}]]))))
(defn- watched-address-flow
[{:keys [name emoji color] :as _account}]
[:<>
[quo/drawer-top
{:title (i18n/label :t/remove-watched-address-title)
:type :context-tag
:context-tag-type :account
:account-name name
:emoji emoji
:customization-color color}]
[rn/view {:style style/desc-container}
[quo/text {:weight :medium}
(i18n/label :t/remove-watched-address-desc)]]
[footer {:submit-disabled? false}]])
(defn- view-internal
[]
(let [{:keys [type] :as account} (rf/sub [:wallet/current-viewing-account])]
(case type
:generated [recovery-phase-flow account]
:watch [watched-address-flow account])))
(def view (quo.theme/with-theme view-internal))

View File

@ -6,6 +6,7 @@
:as create-or-edit-account]
[status-im.contexts.wallet.common.sheets.network-preferences.view
:as network-preferences]
[status-im.contexts.wallet.common.sheets.remove-account.view :as remove-account]
[status-im.contexts.wallet.edit-account.style :as style]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
@ -62,7 +63,12 @@
(= name @edited-account-name))]
[create-or-edit-account/view
{:page-nav-right-side [{:icon-name :i/delete
:on-press #(js/alert "Delete account: to be implemented")}]
:on-press
(fn []
(rf/dispatch [:show-bottom-sheet
{:content
(fn []
[remove-account/view])}]))}]
:account-name account-name
:account-emoji emoji
:account-color color

View File

@ -2463,5 +2463,11 @@
"oops-wrong-word": "Oops! Wrong word",
"time-in-mins": "{{minutes}} min",
"amount-with-currency-symbol": "{{symbol}} {{amount}}",
"no-routes-found": "No routes found"
"no-routes-found": "No routes found",
"remove-watched-address-title": "Remove watched address",
"remove-watched-address-desc": "The watched address will be removed from all of your synced devices.",
"remove-account-title": "Remove account",
"remove-account-desc": "The account will be removed from all of your synced devices. Make sure you have a backup of your keypair or recovery phrase and derivation path (if its not default).",
"derivation-path-copied": "Derivation path copied",
"remove-account-confirmation": "I have taken note of the derivation path"
}