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

Wallet: Create Account UI (2) (#17468) 

* Wallet: create account UI (2)
This commit is contained in:
Omar Basem 2023-10-04 14:17:55 +04:00 committed by GitHub
parent df2b5147cd
commit 191f5de6f1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 57 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/quo2/components/colors/color_picker/view.cljs
View File

@ -18,10 +18,11 @@
- `blur?` Boolean to enable blur background support.}"
[{:keys [default-selected]}]
(let [selected (reagent/atom default-selected)]
(fn [{:keys [blur? on-change feng-shui?]}]
(fn [{:keys [blur? on-change feng-shui? container-style]}]
[rn/scroll-view
{:horizontal true
:shows-horizontal-scroll-indicator false}
:shows-horizontal-scroll-indicator false
:content-container-style container-style}
(doall (map (fn [color]
[color/view
{:selected? (= color @selected)

2
src/quo2/components/inputs/title_input/view.cljs
View File

@ -39,7 +39,7 @@
[rn/text-input
{:style
(text/text-style
{:size :heading-2
{:size :heading-1
:weight :semi-bold
:style (style/title-text theme)})
:default-value default-value

5
src/quo2/components/settings/settings_item/style.cljs
View File

@ -13,9 +13,10 @@
{:flex-direction :row
:align-items (if (or tag description) :flex-start :center)})
(def sub-container
(defn sub-container
[align-action]
{:flex-direction :row
:align-items :center})
:align-items (or align-action :center)})
(def left-container
{:margin-left 12

12
src/quo2/components/settings/settings_item/view.cljs
View File

@ -28,7 +28,7 @@
[{:keys [description-props blur? theme]}]
(let [{:keys [text icon]} description-props]
[rn/view
{:style style/sub-container}
{:style (style/sub-container :center)}
[text/text
{:size :paragraph-2
:style (style/color blur? theme)}
@ -93,15 +93,15 @@
(case action
:arrow [icon/icon :i/chevron-right (style/color blur? theme)]
:button [button/button
{:type :outline
:size 24
:on-press (:on-press action-props)}
(merge action-props
{:type :outline
:size 24})
(:button-text action-props)]
:selector [selectors/toggle action-props]
nil)])
(defn- internal-view
[{:keys [title on-press accessibility-label] :as props}]
[{:keys [title on-press action-props accessibility-label] :as props}]
[rn/pressable
{:style (style/container props)
:on-press on-press
@ -112,7 +112,7 @@
[text/text {:weight :medium} title]
[description-component props]
[tag-component props]]]
[rn/view {:style style/sub-container}
[rn/view {:style (style/sub-container (:alignment action-props))}
[label-component props]
[action-component props]]])

42
src/status_im2/contexts/wallet/common/temp.cljs
View File

@ -1,10 +1,13 @@
(ns status-im2.contexts.wallet.common.temp
(:require [quo2.core :as quo]
[quo2.foundations.resources :as quo.resources]
[react-native.core :as rn]
[status-im2.contexts.wallet.common.utils :as utils]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
(:require
[clojure.string :as string]
[quo2.core :as quo]
[quo2.foundations.resources :as quo.resources]
[react-native.core :as rn]
[status-im2.constants :as constants]
[status-im2.contexts.wallet.common.utils :as utils]
[utils.i18n :as i18n]
[utils.re-frame :as rf]))
(def networks
[{:source (quo.resources/get-network :ethereum)}
@ -78,9 +81,24 @@
(defn create-account-state
[name]
[{:title (keypair-string name)
:button-props {:title (i18n/label :t/edit)}
:left-icon :i/placeholder}
{:title (i18n/label :t/derivation-path)
:button-props {:title (i18n/label :t/edit)}
:left-icon :i/derivated-path}])
[{:title (keypair-string name)
:image :avatar
:image-props {:full-name "A Y"
:size :xxs
:customization-color :blue}
:action :button
:action-props {:on-press #(js/alert "Button pressed!")
:button-text (i18n/label :t/edit)
:alignment :flex-start}
:description :text
:description-props {:text (i18n/label :t/on-device)}}
{:title (i18n/label :t/derivation-path)
:image :icon
:image-props :i/derivated-path
:action :button
:action-props {:on-press #(js/alert "Button pressed!")
:button-text (i18n/label :t/edit)
:icon-left :i/placeholder
:alignment :flex-start}
:description :text
:description-props {:text (string/replace constants/path-default-wallet #"/" " / ")}}])

17
src/status_im2/contexts/wallet/create_account/style.cljs
View File

@ -24,20 +24,17 @@
:padding-bottom 16})
(def color-picker-container
{:padding-vertical 12
:padding-horizontal 20})
{:padding-vertical 12})
(defn color-label
[theme]
{:color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)
:padding-bottom 4})
{:color (colors/theme-colors colors/neutral-50 colors/neutral-40 theme)
:padding-bottom 4
:padding-horizontal 20})
(defn divider-line
[theme]
{:border-color (colors/theme-colors colors/neutral-10 colors/neutral-90 theme)
:padding-top 12
:padding-bottom 8
:border-bottom-width 1})
(def divider-line
{:margin-top 12
:margin-bottom 8})
(defn slide-button-container
[bottom]

9
src/status_im2/contexts/wallet/create_account/view.cljs
View File

@ -57,6 +57,7 @@
:disabled? false
:default-value "Account 2"
:container-style style/title-input-container}]
[quo/divider-line]
[rn/view
{:style style/color-picker-container}
[quo/text
@ -66,14 +67,16 @@
(i18n/label :t/colour)]
[quo/color-picker
{:default-selected @account-color
:on-change #(reset! account-color %)}]]
[rn/view {:style (style/divider-line theme)}]
:on-change #(reset! account-color %)
:container-style {:padding-horizontal 12
:padding-vertical 12}}]]
[quo/divider-line]
[quo/category
{:list-type :settings
:label (i18n/label :t/origin)
:data (temp/create-account-state display-name)}]
[quo/slide-button
{:track-text (i18n/label :t/slide-create)
{:track-text (i18n/label :t/slide-to-sign)
:track-icon :face-id
:customization-color @account-color
:on-complete (fn []

2
translations/en.json
View File

@ -2300,7 +2300,7 @@
"add-address-description": "Watch a public address or ENS name",
"colour": "Colour",
"origin": "Origin",
"slide-create": "Slide to create account",
"slide-to-sign": "Slide to sign",
"user-keypair": "{{name}}'s Keypair",
"trip-accounts": "Trip accounts",
"destroy": "Destroy",