chore: add skeleton for sign in with syncing flow
This commit is contained in:
parent
3f3cbe98a4
commit
ada7a02c21
|
@ -61,7 +61,7 @@
|
|||
:source (get-in carousels [@carousel-index :image])}]
|
||||
[quo/drawer-buttons
|
||||
{:top-card {:on-press (fn []
|
||||
(rf/dispatch [:navigate-to :new-to-status])
|
||||
(rf/dispatch [:navigate-to :sign-in])
|
||||
(rf/dispatch [:hide-terms-of-services-opt-in-screen]))
|
||||
:heading (i18n/label :t/sign-in)
|
||||
:accessibility-label :already-use-status-button}
|
||||
|
|
|
@ -0,0 +1,14 @@
|
|||
(ns status-im2.contexts.onboarding.sign-in.style
|
||||
(:require [quo2.foundations.colors :as colors]
|
||||
[react-native.platform :as platform]))
|
||||
|
||||
(def navigation-bar {:height 56})
|
||||
|
||||
(def page-container
|
||||
{:padding-top (if platform/ios? 44 0)
|
||||
:position :absolute
|
||||
:top 0
|
||||
:bottom 0
|
||||
:left 0
|
||||
:right 0
|
||||
:background-color colors/neutral-80-opa-80-blur})
|
|
@ -0,0 +1,42 @@
|
|||
(ns status-im2.contexts.onboarding.sign-in.view
|
||||
(:require [quo2.core :as quo]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[react-native.core :as rn]
|
||||
[status-im2.contexts.onboarding.sign-in.style :as style]
|
||||
[utils.i18n :as i18n]
|
||||
[status-im2.contexts.onboarding.common.background.view :as background]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(defn navigation-bar
|
||||
[]
|
||||
[rn/view {:style style/navigation-bar}
|
||||
[quo/page-nav
|
||||
{:align-mid? true
|
||||
:mid-section {:type :text-only :main-text ""}
|
||||
:left-section {:type :blur-bg
|
||||
:icon :i/arrow-left
|
||||
:icon-override-theme :dark
|
||||
:on-press #(rf/dispatch [:navigate-back])}
|
||||
:right-section-buttons [{:type :blur-bg
|
||||
:icon :i/info
|
||||
:icon-override-theme :dark
|
||||
:on-press #(js/alert "Pending")}]}]])
|
||||
|
||||
(defn page
|
||||
[]
|
||||
[rn/view {:style style/page-container}
|
||||
[navigation-bar]
|
||||
[rn/view {:style {:padding-horizontal 20}}
|
||||
[quo/text
|
||||
{:size :heading-1
|
||||
:weight :semi-bold
|
||||
:style {:color colors/white}} "Sign in by syncing"]
|
||||
[quo/button
|
||||
{:on-press #(rf/dispatch [:navigate-to :syncing-devices])
|
||||
:style {}} (i18n/label :t/continue)]]])
|
||||
|
||||
(defn sign-in
|
||||
[]
|
||||
[rn/view {:style {:flex 1}}
|
||||
[background/view true]
|
||||
[page]])
|
|
@ -0,0 +1,14 @@
|
|||
(ns status-im2.contexts.onboarding.syncing.syncing-devices.style
|
||||
(:require [quo2.foundations.colors :as colors]
|
||||
[react-native.platform :as platform]))
|
||||
|
||||
(def navigation-bar {:height 56})
|
||||
|
||||
(def page-container
|
||||
{:padding-top (if platform/ios? 44 0)
|
||||
:position :absolute
|
||||
:top 0
|
||||
:bottom 0
|
||||
:left 0
|
||||
:right 0
|
||||
:background-color colors/neutral-80-opa-80-blur})
|
|
@ -0,0 +1,51 @@
|
|||
(ns status-im2.contexts.onboarding.syncing.syncing-devices.view
|
||||
(:require [quo2.core :as quo]
|
||||
[quo2.foundations.colors :as colors]
|
||||
[react-native.core :as rn]
|
||||
[status-im2.contexts.onboarding.syncing.syncing-devices.style :as style]
|
||||
[utils.i18n :as i18n]
|
||||
[status-im2.contexts.onboarding.common.background.view :as background]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
|
||||
(defn navigation-bar
|
||||
[]
|
||||
[rn/view {:style style/navigation-bar}
|
||||
[quo/page-nav
|
||||
{:align-mid? true
|
||||
:mid-section {:type :text-only :main-text ""}
|
||||
:left-section {:type :blur-bg
|
||||
:icon :i/arrow-left
|
||||
:icon-override-theme :dark
|
||||
:on-press #(rf/dispatch [:navigate-back])}
|
||||
:right-section-buttons [{:type :blur-bg
|
||||
:icon :i/info
|
||||
:icon-override-theme :dark
|
||||
:on-press #(js/alert "Pending")}]}]])
|
||||
|
||||
(defn page
|
||||
[]
|
||||
[rn/view {:style style/page-container}
|
||||
[navigation-bar]
|
||||
[rn/view {:style {:padding-horizontal 20}}
|
||||
[quo/text
|
||||
{:size :heading-1
|
||||
:weight :semi-bold
|
||||
:style {:color colors/white}} "Syncing devices..."]
|
||||
[quo/text
|
||||
{:size :heading-2
|
||||
:weight :semi-bold
|
||||
:style {:color colors/white}} "will show sync complete if successful"]
|
||||
[quo/text
|
||||
{:size :heading-2
|
||||
:weight :semi-bold
|
||||
:style {:color colors/white}} "will show sync failed if unsuccessful"]
|
||||
[quo/button
|
||||
{:on-press #(rf/dispatch [:navigate-to :enable-notifications])
|
||||
:style {}} (i18n/label :t/continue)]]])
|
||||
|
||||
(defn syncing-devices
|
||||
[]
|
||||
[rn/view {:style {:flex 1}}
|
||||
[background/view true]
|
||||
[page]])
|
|
@ -1,27 +1,30 @@
|
|||
(ns status-im2.navigation.screens
|
||||
(:require [utils.i18n :as i18n] ;; TODO remove when not used anymore
|
||||
[quo2.foundations.colors :as colors]
|
||||
[react-native.platform :as platform]
|
||||
[status-im.ui.screens.screens :as old-screens]
|
||||
[status-im2.config :as config]
|
||||
[status-im2.contexts.activity-center.view :as activity-center]
|
||||
[status-im2.contexts.add-new-contact.views :as add-new-contact]
|
||||
[status-im2.contexts.chat.lightbox.view :as lightbox]
|
||||
[status-im2.contexts.chat.messages.view :as chat]
|
||||
[status-im2.contexts.chat.photo-selector.album-selector.view :as album-selector]
|
||||
[status-im2.contexts.chat.photo-selector.view :as photo-selector]
|
||||
[status-im2.contexts.communities.discover.view :as communities.discover]
|
||||
[status-im2.contexts.communities.overview.view :as communities.overview]
|
||||
[status-im2.contexts.onboarding.common.intro.view :as intro]
|
||||
[status-im2.contexts.onboarding.create-password.view :as create-password]
|
||||
[status-im2.contexts.onboarding.create-profile.view :as create-profile]
|
||||
[status-im2.contexts.onboarding.enable-biometrics.view :as enable-biometrics]
|
||||
[status-im2.contexts.onboarding.enable-notifications.view :as enable-notifications]
|
||||
[status-im2.contexts.onboarding.new-to-status.view :as new-to-status]
|
||||
[status-im2.contexts.onboarding.profiles.view :as profiles]
|
||||
[status-im2.contexts.quo-preview.main :as quo.preview]
|
||||
[status-im2.contexts.shell.view :as shell]
|
||||
[status-im2.contexts.syncing.view :as settings-syncing]))
|
||||
(:require
|
||||
[utils.i18n :as i18n] ;; TODO remove when not used anymore
|
||||
[quo2.foundations.colors :as colors]
|
||||
[react-native.platform :as platform]
|
||||
[status-im.ui.screens.screens :as old-screens]
|
||||
[status-im2.config :as config]
|
||||
[status-im2.contexts.activity-center.view :as activity-center]
|
||||
[status-im2.contexts.add-new-contact.views :as add-new-contact]
|
||||
[status-im2.contexts.chat.lightbox.view :as lightbox]
|
||||
[status-im2.contexts.chat.messages.view :as chat]
|
||||
[status-im2.contexts.chat.photo-selector.album-selector.view :as album-selector]
|
||||
[status-im2.contexts.chat.photo-selector.view :as photo-selector]
|
||||
[status-im2.contexts.communities.discover.view :as communities.discover]
|
||||
[status-im2.contexts.communities.overview.view :as communities.overview]
|
||||
[status-im2.contexts.onboarding.common.intro.view :as intro]
|
||||
[status-im2.contexts.onboarding.create-password.view :as create-password]
|
||||
[status-im2.contexts.onboarding.create-profile.view :as create-profile]
|
||||
[status-im2.contexts.onboarding.enable-biometrics.view :as enable-biometrics]
|
||||
[status-im2.contexts.onboarding.enable-notifications.view :as enable-notifications]
|
||||
[status-im2.contexts.onboarding.new-to-status.view :as new-to-status]
|
||||
[status-im2.contexts.onboarding.sign-in.view :as sign-in]
|
||||
[status-im2.contexts.onboarding.syncing.syncing-devices.view :as syncing-devices]
|
||||
[status-im2.contexts.onboarding.profiles.view :as profiles]
|
||||
[status-im2.contexts.quo-preview.main :as quo.preview]
|
||||
[status-im2.contexts.shell.view :as shell]
|
||||
[status-im2.contexts.syncing.view :as settings-syncing]))
|
||||
|
||||
(def components
|
||||
[])
|
||||
|
@ -148,7 +151,21 @@
|
|||
:topBar {:visible false}
|
||||
:navigationBar {:backgroundColor colors/black}}
|
||||
:insets {:top false}
|
||||
:component enable-notifications/enable-notifications}]
|
||||
:component enable-notifications/enable-notifications}
|
||||
|
||||
{:name :sign-in
|
||||
:options {:statusBar {:style :light}
|
||||
:topBar {:visible false}
|
||||
:navigationBar {:backgroundColor colors/black}}
|
||||
:insets {:top false}
|
||||
:component sign-in/sign-in}
|
||||
|
||||
{:name :syncing-devices
|
||||
:options {:statusBar {:style :light}
|
||||
:topBar {:visible false}
|
||||
:navigationBar {:backgroundColor colors/black}}
|
||||
:insets {:top false}
|
||||
:component syncing-devices/syncing-devices}]
|
||||
|
||||
(when config/quo-preview-enabled?
|
||||
quo.preview/screens)
|
||||
|
|
Loading…
Reference in New Issue