Update create profile and sign in screen
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 2.7 KiB |
Before Width: | Height: | Size: 5.9 KiB After Width: | Height: | Size: 4.7 KiB |
Before Width: | Height: | Size: 3.5 KiB After Width: | Height: | Size: 2.8 KiB |
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 4.8 KiB |
After Width: | Height: | Size: 49 KiB |
After Width: | Height: | Size: 91 KiB |
|
@ -17,6 +17,7 @@
|
|||
:generate-keys1 (js/require "../resources/images/ui2/generating-keys-1.png")
|
||||
:ethereum-address (js/require "../resources/images/ui2/ethereum-address.png")
|
||||
:use-keycard (js/require "../resources/images/ui2/keycard.png")
|
||||
:use-recovery-phrase (js/require "../resources/images/ui2/recovery-phrase.png")
|
||||
:check-your-keycard (js/require "../resources/images/ui2/check-your-keycard.png")
|
||||
:onboarding-illustration (js/require "../resources/images/ui2/onboarding_illustration.png")
|
||||
:qr-code (js/require "../resources/images/ui2/qr-code.png")
|
||||
|
|
|
@ -3,11 +3,7 @@
|
|||
[quo.foundations.colors :as colors]))
|
||||
|
||||
(def content-container
|
||||
{:position :absolute
|
||||
:top 0
|
||||
:bottom 0
|
||||
:left 0
|
||||
:right 0})
|
||||
{:flex 1})
|
||||
|
||||
(def options-container
|
||||
{:padding-top 12
|
||||
|
|
|
@ -6,6 +6,7 @@
|
|||
[react-native.safe-area :as safe-area]
|
||||
[status-im.common.check-before-syncing.view :as check-before-syncing]
|
||||
[status-im.common.metrics-confirmation-modal.view :as metrics-modal]
|
||||
[status-im.common.not-implemented :as not-implemented]
|
||||
[status-im.common.resources :as resources]
|
||||
[status-im.config :as config]
|
||||
[status-im.contexts.onboarding.create-or-sync-profile.style :as style]
|
||||
|
@ -35,7 +36,7 @@
|
|||
{:on-submit navigate-to-sign-in-by-syncing}])
|
||||
:shell? true}]))
|
||||
|
||||
(defn- navigate-to-sign-in-by-seed-phrase
|
||||
(defn- navigate-to-sign-in-by-recovery-phrase
|
||||
[create-profile?]
|
||||
(rf/dispatch [:syncing/clear-syncing-fallback-flow])
|
||||
(rf/dispatch [:onboarding/navigate-to-sign-in-by-seed-phrase
|
||||
|
@ -43,6 +44,11 @@
|
|||
:screen/onboarding.new-to-status
|
||||
:screen/onboarding.sync-or-recover-profile)]))
|
||||
|
||||
(defn- check-your-keycard
|
||||
[]
|
||||
(rf/dispatch [:open-modal :screen/keycard.check
|
||||
{:on-press #(rf/dispatch [:keycard.login/check-card])}]))
|
||||
|
||||
(defn- option-card-max-height
|
||||
[window-height]
|
||||
(- window-height
|
||||
|
@ -50,75 +56,95 @@
|
|||
(* 2 16) ;; spacing between items
|
||||
220)) ;; extra spacing (top bar)
|
||||
|
||||
|
||||
(defn- create-profile-option-card
|
||||
(defn- start-fresh-main-card
|
||||
[window-height]
|
||||
[quo/small-option-card
|
||||
{:variant :main
|
||||
:title (i18n/label :t/generate-keys)
|
||||
:subtitle (i18n/label :t/generate-keys-subtitle)
|
||||
:title (i18n/label :t/start-fresh)
|
||||
:subtitle (i18n/label :t/start-fresh-subtitle)
|
||||
:button-label (i18n/label :t/lets-go)
|
||||
:accessibility-label :generate-key-option-card
|
||||
:accessibility-label :start-fresh-main-card
|
||||
:image (resources/get-image :generate-keys)
|
||||
:max-height (option-card-max-height window-height)
|
||||
:on-press navigate-to-create-profile}])
|
||||
|
||||
(defn- sync-profile-option-card
|
||||
(defn- log-in-with-recovery-phrase-main-card
|
||||
[window-height]
|
||||
[quo/small-option-card
|
||||
{:variant :main
|
||||
:title (i18n/label :t/sign-in-by-syncing)
|
||||
:subtitle (i18n/label :t/if-you-have-status-on-another-device)
|
||||
:button-label (i18n/label :t/scan-sync-code)
|
||||
:accessibility-label :scan-sync-code-option-card
|
||||
:image (resources/get-image :generate-keys)
|
||||
:title (i18n/label :t/log-in-with-recovery-phrase)
|
||||
:subtitle (i18n/label :t/log-in-with-recovery-phrase-subtitle)
|
||||
:button-label (i18n/label :t/use-recovery-phrase)
|
||||
:accessibility-label :log-in-with-recovery-phrase-main-card
|
||||
:image (resources/get-image :use-recovery-phrase)
|
||||
:max-height (option-card-max-height window-height)
|
||||
:on-press #(navigate-to-sign-in-by-recovery-phrase false)}])
|
||||
|
||||
(defn- use-recovery-phrase-icon-card
|
||||
[]
|
||||
[quo/small-option-card
|
||||
{:variant :icon
|
||||
:title (i18n/label :t/use-a-recovery-phrase)
|
||||
:subtitle (i18n/label :t/use-a-recovery-phrase-subtitle)
|
||||
:accessibility-label :use-a-recovery-phrase-icon-card
|
||||
:image (resources/get-image :ethereum-address)
|
||||
:on-press #(navigate-to-sign-in-by-recovery-phrase true)}])
|
||||
|
||||
(defn- use-empty-keycard-icon-card
|
||||
[]
|
||||
[quo/small-option-card
|
||||
{:variant :icon
|
||||
:title (i18n/label :t/use-an-empty-keycard)
|
||||
:subtitle (i18n/label :t/use-an-empty-keycard-subtitle)
|
||||
:accessibility-label :use-an-empty-keycard-icon-card
|
||||
:image (resources/get-image :use-keycard)
|
||||
:on-press status-im.common.not-implemented/alert}])
|
||||
|
||||
(defn- log-in-by-syncing-icon-card
|
||||
[]
|
||||
[quo/small-option-card
|
||||
{:variant :icon
|
||||
:title (i18n/label :t/log-in-by-syncing)
|
||||
:subtitle (i18n/label :t/log-in-by-syncing-subtitle)
|
||||
:accessibility-label :log-in-by-syncing-icon-card
|
||||
:image (resources/get-image :ethereum-address)
|
||||
:on-press show-check-before-syncing}])
|
||||
|
||||
(defn- log-in-with-keycard-icon-card
|
||||
[]
|
||||
[quo/small-option-card
|
||||
{:variant :icon
|
||||
:title (i18n/label :t/log-in-with-keycard)
|
||||
:subtitle (i18n/label :t/log-in-with-keycard-subtitle)
|
||||
:accessibility-label :log-in-with-keycard
|
||||
:image (resources/get-image :use-keycard)
|
||||
:on-press check-your-keycard}])
|
||||
|
||||
(defn sign-in-options
|
||||
[sign-in-type]
|
||||
(let [window-height (rf/sub [:dimensions/window-height])
|
||||
create-profile? (= sign-in-type :create-profile)
|
||||
nav-to-seed-phrase-with-cur-screen (rn/use-callback
|
||||
#(navigate-to-sign-in-by-seed-phrase
|
||||
create-profile?)
|
||||
[create-profile?])
|
||||
main-option-card (if create-profile?
|
||||
create-profile-option-card
|
||||
sync-profile-option-card)]
|
||||
[create-profile?]
|
||||
(let [window-height (rf/sub [:dimensions/window-height])]
|
||||
[rn/view {:style style/options-container}
|
||||
[quo/text
|
||||
{:style style/title
|
||||
:size :heading-1
|
||||
:weight :semi-bold}
|
||||
(i18n/label (if create-profile? :t/create-profile :t/sync-or-recover-profile))]
|
||||
[main-option-card window-height]
|
||||
(i18n/label (if create-profile? :t/create-profile :t/log-in))]
|
||||
(if create-profile?
|
||||
[start-fresh-main-card window-height]
|
||||
[log-in-with-recovery-phrase-main-card window-height])
|
||||
[rn/view {:style style/subtitle-container}
|
||||
[quo/text
|
||||
{:style style/subtitle
|
||||
:size :paragraph-2
|
||||
:weight :medium}
|
||||
(i18n/label (if create-profile? :t/experienced-web3 :t/dont-have-statatus-on-another-device))]]
|
||||
[rn/view
|
||||
[quo/small-option-card
|
||||
{:variant :icon
|
||||
:title (i18n/label :t/use-recovery-phrase)
|
||||
:subtitle (i18n/label :t/use-recovery-phrase-subtitle)
|
||||
:accessibility-label :use-recovery-phrase-option-card
|
||||
:image (resources/get-image :ethereum-address)
|
||||
:on-press nav-to-seed-phrase-with-cur-screen}]
|
||||
(i18n/label :t/other-options)]]
|
||||
(if create-profile?
|
||||
[use-recovery-phrase-icon-card]
|
||||
[log-in-by-syncing-icon-card])
|
||||
[rn/view {:style style/space-between-suboptions}]
|
||||
[quo/small-option-card
|
||||
{:variant :icon
|
||||
:title (i18n/label :t/use-keycard)
|
||||
:subtitle (i18n/label :t/profile-keys-on-keycard)
|
||||
:accessibility-label :use-keycard-option-card
|
||||
:image (resources/get-image :use-keycard)
|
||||
:on-press (fn []
|
||||
(rf/dispatch [:open-modal :screen/keycard.check
|
||||
{:on-press
|
||||
#(rf/dispatch
|
||||
[:keycard.login/check-card])}]))}]]]))
|
||||
(if create-profile?
|
||||
[use-empty-keycard-icon-card]
|
||||
[log-in-with-keycard-icon-card])]))
|
||||
|
||||
(defn- navigate-back
|
||||
[]
|
||||
|
@ -145,7 +171,7 @@
|
|||
(when config/quo-preview-enabled?
|
||||
{:icon-name :i/reveal-whitelist
|
||||
:on-press navigate-to-quo-preview})]}]
|
||||
[sign-in-options sign-in-type]]))
|
||||
[sign-in-options (= sign-in-type :create-profile)]]))
|
||||
|
||||
(defn create-profile
|
||||
[]
|
||||
|
|
|
@ -1087,7 +1087,6 @@
|
|||
"generate-account": "Generate keys",
|
||||
"generate-an-account": "Generate an account",
|
||||
"generate-keys": "Generate keys",
|
||||
"generate-keys-subtitle": "Create your new self-sovereign identity",
|
||||
"generate-new-key": "Generate keys",
|
||||
"generate-new-keypair": "Generate new key pair",
|
||||
"generate-scan-sync-code": "Generate Scan Sync Code",
|
||||
|
@ -1467,6 +1466,12 @@
|
|||
"local-pairing-experimental-mode": "Local Pairing Mode (alpha)",
|
||||
"lock-app-with": "Lock app with",
|
||||
"log-in": "Log in",
|
||||
"log-in-by-syncing": "Log in by syncing",
|
||||
"log-in-by-syncing-subtitle": "If you have your profile on another device",
|
||||
"log-in-with-keycard": "Log in with Keycard",
|
||||
"log-in-with-keycard-subtitle": "If your profile keys are stored on a Keycard",
|
||||
"log-in-with-recovery-phrase": "Log in with recovery phrase",
|
||||
"log-in-with-recovery-phrase-subtitle": "If you have your Status recovery phrase",
|
||||
"log-level": "Log level",
|
||||
"log-level-settings": "Log level settings",
|
||||
"log-out-remove": "Log out & Remove profile",
|
||||
|
@ -1863,6 +1868,7 @@
|
|||
"origin-desc": "Origin is where your key pair (your private and public key) comes from. You can generate a new key pair or import an existing private key.",
|
||||
"origin-header": "Origin",
|
||||
"os-app-version-bandwidth": "OS, app version and bandwidth usage",
|
||||
"other-options": "Other options",
|
||||
"outgoing": "Outgoing",
|
||||
"outgoing-transaction": "Outgoing transaction",
|
||||
"overview": "Overview",
|
||||
|
@ -2410,6 +2416,8 @@
|
|||
"spending-cap-set": "Spending cap set: {{token-amount}} {{token-symbol}} for {{provider-name}} in {{account-name}}",
|
||||
"start-chat": "Start chat",
|
||||
"start-conversation": "Start conversation",
|
||||
"start-fresh": "Start fresh",
|
||||
"start-fresh-subtitle": "Create a new profile from scratch",
|
||||
"start-group-chat": "Start group chat",
|
||||
"start-new-chat": "Start new chat",
|
||||
"start-using-status": "Start using Status",
|
||||
|
@ -2690,6 +2698,10 @@
|
|||
"url": "URL",
|
||||
"usage-data-shared-from-all-profiles": "Usage data will be shared from all profiles added to device. ",
|
||||
"usd-currency": "USD",
|
||||
"use-a-recovery-phrase": "Use a recovery phrase",
|
||||
"use-a-recovery-phrase-subtitle": "If you already have an Ethereum wallet",
|
||||
"use-an-empty-keycard": "Use an empty Keycard",
|
||||
"use-an-empty-keycard-subtitle": "Store your new profile keys on Keycard",
|
||||
"use-as-profile-picture": "Use as profile picture",
|
||||
"use-biometrics": "Use biometrics to fill in your password",
|
||||
"use-keycard": "Use Keycard",
|
||||
|
@ -2699,7 +2711,6 @@
|
|||
"use-keycard-subtitle": "Keys will be stored on your Keycard",
|
||||
"use-photo": "Use Photo",
|
||||
"use-recovery-phrase": "Use recovery phrase",
|
||||
"use-recovery-phrase-subtitle": "If you already have an Ethereum address",
|
||||
"use-the-multichain-wallet": "Use the leading multi-chain self-custodial wallet",
|
||||
"use-valid-contact-code": "Please enter or scan a valid chat key or username",
|
||||
"user-blocked": "{{username}} blocked",
|
||||
|
|