Implement onboarding share usage data screen
This commit is contained in:
parent
91761a92c7
commit
338b241c8e
|
@ -2,11 +2,12 @@
|
|||
|
||||
(defn container
|
||||
[container-style]
|
||||
(merge container-style
|
||||
(merge
|
||||
{:padding-vertical 7
|
||||
:padding-horizontal 20
|
||||
:flex-direction :row
|
||||
:align-items :flex-start}))
|
||||
:align-items :flex-start}
|
||||
container-style))
|
||||
|
||||
(def index
|
||||
{:margin-left 5})
|
||||
|
|
|
@ -41,7 +41,7 @@
|
|||
|
||||
(defn view
|
||||
[{:keys [title description tag-picture tag-name description-after-tag step-number
|
||||
customization-color type blur? container-style]
|
||||
customization-color type blur? container-style icon icon-props]
|
||||
:or {type :bullet}}]
|
||||
(let [theme (quo.theme/use-theme)]
|
||||
[rn/view {:style (style/container container-style)}
|
||||
|
@ -54,6 +54,8 @@
|
|||
:type (if customization-color :complete :neutral)} step-number]
|
||||
:lock
|
||||
[icon/icon :i/locked {:color (get-colors theme blur?)}]
|
||||
:custom-icon
|
||||
[icon/icon icon icon-props]
|
||||
[icon/icon :i/bullet {:color (get-colors theme blur?)}])]
|
||||
[rn/view {:style style/text-container}
|
||||
(when title
|
||||
|
|
|
@ -1,19 +0,0 @@
|
|||
(ns status-im.common.metrics-confirmation-modal.style)
|
||||
|
||||
(def points-wrapper
|
||||
{:margin-top 11
|
||||
:margin-horizontal 20
|
||||
:gap 21
|
||||
:margin-bottom 8})
|
||||
|
||||
(def item-text
|
||||
{:margin-left -24})
|
||||
|
||||
(def info-text
|
||||
{:margin-top -5})
|
||||
|
||||
(def privacy-policy
|
||||
{:margin-top 4
|
||||
:margin-horizontal 20
|
||||
:margin-bottom 20
|
||||
:align-items :center})
|
|
@ -1,119 +0,0 @@
|
|||
(ns status-im.common.metrics-confirmation-modal.view
|
||||
(:require
|
||||
[quo.core :as quo]
|
||||
[quo.foundations.colors :as colors]
|
||||
[quo.theme]
|
||||
[react-native.core :as rn]
|
||||
[status-im.common.metrics-confirmation-modal.style :as style]
|
||||
[status-im.common.privacy.view :as privacy]
|
||||
[utils.i18n :as i18n]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(defn- dismiss-keyboard
|
||||
[]
|
||||
(rf/dispatch [:dismiss-keyboard]))
|
||||
|
||||
(defn- hide-bottom-sheet
|
||||
[]
|
||||
(rf/dispatch [:hide-bottom-sheet]))
|
||||
|
||||
(def ^:private will-receive-for-current-points
|
||||
[:t/number-of-messages-sent
|
||||
:t/connected-peers
|
||||
:t/successful-messages-rate
|
||||
:t/connection-type
|
||||
:t/os-app-version-bandwidth])
|
||||
|
||||
(def ^:private will-receive-for-all-points
|
||||
[:t/action-logs
|
||||
:t/ip-addresses-uuid])
|
||||
|
||||
(def ^:private not-receive-points
|
||||
[:t/your-profile-information
|
||||
:t/your-addresses
|
||||
:t/information-you-input-and-send])
|
||||
|
||||
(defn- bullet-points
|
||||
[{:keys [title points lock?]}]
|
||||
[rn/view
|
||||
[quo/text {:weight :semi-bold}
|
||||
title]
|
||||
(for [label points]
|
||||
^{:key label}
|
||||
[quo/markdown-list
|
||||
{:description (i18n/label label)
|
||||
:blur? true
|
||||
:type (when lock? :lock)
|
||||
:container-style style/item-text}])])
|
||||
|
||||
(defn- on-share-usage
|
||||
[]
|
||||
(rf/dispatch [:centralized-metrics/toggle-centralized-metrics true true])
|
||||
(hide-bottom-sheet))
|
||||
|
||||
(defn- on-do-not-share
|
||||
[]
|
||||
(rf/dispatch [:centralized-metrics/toggle-centralized-metrics false true])
|
||||
(hide-bottom-sheet))
|
||||
|
||||
(declare view)
|
||||
|
||||
(defn- on-privacy-policy-press
|
||||
[]
|
||||
(rf/dispatch
|
||||
[:show-bottom-sheet
|
||||
{:content privacy/privacy-statement
|
||||
:on-close (fn []
|
||||
(rf/dispatch [:show-bottom-sheet
|
||||
{:content view
|
||||
:theme :dark
|
||||
:shell? true}]))
|
||||
:theme :dark
|
||||
:shell? true}]))
|
||||
|
||||
(defn- privacy-policy-text
|
||||
[]
|
||||
[rn/view {:style style/privacy-policy}
|
||||
[quo/text
|
||||
[quo/text
|
||||
{:style {:color colors/white-opa-50}
|
||||
:size :paragraph-2}
|
||||
(i18n/label :t/more-details-in-privacy-policy-1)]
|
||||
[quo/text
|
||||
{:size :paragraph-2
|
||||
:weight :bold
|
||||
:on-press on-privacy-policy-press}
|
||||
(i18n/label :t/more-details-in-privacy-policy-2)]]])
|
||||
|
||||
(defn view
|
||||
[]
|
||||
(rn/use-mount #(dismiss-keyboard))
|
||||
[:<>
|
||||
[quo/drawer-top
|
||||
{:title (i18n/label :t/help-us-improve-status)
|
||||
:description (i18n/label :t/collecting-usage-data)}]
|
||||
[rn/scroll-view
|
||||
[rn/view {:style style/points-wrapper}
|
||||
[bullet-points
|
||||
{:title (i18n/label :t/we-will-receive-from-all-profiles)
|
||||
:points will-receive-for-all-points}]
|
||||
[bullet-points
|
||||
{:title (i18n/label :t/we-will-receive-from-the-current-profile)
|
||||
:points will-receive-for-current-points}]
|
||||
[bullet-points
|
||||
{:title (i18n/label :t/what-we-wont-receive)
|
||||
:points not-receive-points
|
||||
:lock? true}]
|
||||
[quo/text
|
||||
{:size :paragraph-2
|
||||
:style style/info-text}
|
||||
(i18n/label :t/sharing-usage-data-can-be-turned-off)]]]
|
||||
[quo/bottom-actions
|
||||
{:actions :two-actions
|
||||
:blur? true
|
||||
:button-one-label (i18n/label :t/help-us-improve-status)
|
||||
:button-one-props {:on-press on-share-usage}
|
||||
:button-two-label (i18n/label :t/not-now)
|
||||
:button-two-props {:type :grey
|
||||
:on-press on-do-not-share}}]
|
||||
[privacy-policy-text]])
|
|
@ -36,18 +36,10 @@
|
|||
(assoc :centralized-metrics/enabled? enabled?)
|
||||
(assoc :centralized-metrics/onboarding-enabled? (and onboarding? enabled?)))}))
|
||||
|
||||
(rf/reg-event-fx :centralized-metrics/check-modal
|
||||
(fn [{:keys [db]} [modal-view]]
|
||||
(rf/reg-event-fx :centralized-metrics/check-user-confirmation
|
||||
(fn [{:keys [db]}]
|
||||
(when-not (:centralized-metrics/user-confirmed? db)
|
||||
{:fx [[:dispatch
|
||||
[:show-bottom-sheet
|
||||
{:content (fn [] [modal-view])
|
||||
;; When in the profiles screen do biometric auth after the metrics sheet is dismissed
|
||||
;; https://github.com/status-im/status-mobile/issues/20932
|
||||
:on-close (when (= (:view-id db) :screen/profile.profiles)
|
||||
#(rf/dispatch [:profile.login/login-with-biometric-if-available
|
||||
(get-in db [:profile/login :key-uid])]))
|
||||
:shell? true}]]]})))
|
||||
{:fx [[:dispatch [:navigate-to :screen/onboarding.share-usage]]]})))
|
||||
|
||||
(rf/reg-fx :effects.centralized-metrics/track
|
||||
(fn [event]
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
[react-native.core :as rn]
|
||||
[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.events-helper :as events-helper]
|
||||
[status-im.common.resources :as resources]
|
||||
[status-im.config :as config]
|
||||
[status-im.contexts.onboarding.create-or-sync-profile.style :as style]
|
||||
|
@ -142,18 +142,12 @@
|
|||
[use-empty-keycard-icon-card]
|
||||
[log-in-with-keycard-icon-card])]))
|
||||
|
||||
(defn- navigate-back
|
||||
[]
|
||||
(rf/dispatch [:onboarding/overlay-dismiss])
|
||||
(rf/dispatch [:navigate-back]))
|
||||
|
||||
(defn- navigate-to-quo-preview
|
||||
[]
|
||||
(rf/dispatch [:navigate-to :quo-preview]))
|
||||
|
||||
(defn- internal-view
|
||||
[sign-in-type]
|
||||
(rn/use-mount #(rf/dispatch [:centralized-metrics/check-modal metrics-modal/view]))
|
||||
(let [{:keys [top]} (safe-area/get-insets)]
|
||||
[rn/view {:style style/content-container}
|
||||
[quo/page-nav
|
||||
|
@ -161,7 +155,7 @@
|
|||
:type :no-title
|
||||
:background :blur
|
||||
:icon-name :i/arrow-left
|
||||
:on-press navigate-back
|
||||
:on-press events-helper/navigate-back
|
||||
:right-side [{:icon-name :i/info
|
||||
:on-press getting-started-doc/show-as-bottom-sheet}
|
||||
(when config/quo-preview-enabled?
|
||||
|
|
|
@ -52,13 +52,16 @@
|
|||
[]
|
||||
(when-let [blur-show-fn @overlay/blur-show-fn-atom]
|
||||
(blur-show-fn))
|
||||
(rf/dispatch [:open-modal :screen/onboarding.sync-or-recover-profile]))
|
||||
(rf/dispatch [:open-modal
|
||||
:screen/onboarding.share-usage
|
||||
{:next-screen :screen/onboarding.sync-or-recover-profile}]))
|
||||
|
||||
(defn- create-profile
|
||||
[]
|
||||
(when-let [blur-show-fn @overlay/blur-show-fn-atom]
|
||||
(blur-show-fn))
|
||||
(rf/dispatch [:open-modal :screen/onboarding.new-to-status]))
|
||||
(rf/dispatch [:open-modal :screen/onboarding.share-usage
|
||||
{:next-screen :screen/onboarding.new-to-status}]))
|
||||
|
||||
(defn view
|
||||
[]
|
||||
|
|
|
@ -0,0 +1,58 @@
|
|||
(ns status-im.contexts.onboarding.share-usage.learn-more-sheet
|
||||
(:require
|
||||
[quo.core :as quo]
|
||||
[quo.foundations.colors :as colors]
|
||||
[quo.theme]
|
||||
[react-native.core :as rn]
|
||||
[status-im.common.terms.view :as terms]
|
||||
[utils.i18n :as i18n]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(def ^:private bullet-points-data
|
||||
[[:t/help-us-improve-status-bullet-point-1 true]
|
||||
[:t/help-us-improve-status-bullet-point-2 true]
|
||||
[:t/help-us-improve-status-bullet-point-3 false]
|
||||
[:t/help-us-improve-status-bullet-point-4 false]
|
||||
[:t/help-us-improve-status-bullet-point-5 false]])
|
||||
|
||||
(defn- privacy-policy-text
|
||||
[]
|
||||
[rn/view {:style {:margin-horizontal 20 :margin-vertical 8}}
|
||||
[quo/text
|
||||
[quo/text
|
||||
{:style {:color colors/white-opa-50}
|
||||
:size :paragraph-2}
|
||||
(i18n/label :t/more-details-in-privacy-policy-1-onboarding)]
|
||||
[quo/text
|
||||
{:size :paragraph-2
|
||||
:weight :bold
|
||||
:on-press #(rf/dispatch [:show-bottom-sheet {:content terms/terms-of-use :shell? true}])}
|
||||
(i18n/label :t/more-details-in-privacy-policy-2)]]])
|
||||
|
||||
(defn- bullet-points
|
||||
[]
|
||||
[:<>
|
||||
(for [[label collected?] bullet-points-data]
|
||||
^{:key label}
|
||||
[quo/markdown-list
|
||||
{:description (i18n/label label)
|
||||
:blur? true
|
||||
:type :custom-icon
|
||||
:container-style {:padding-vertical 5}
|
||||
:icon (if collected? :i/check-circle :i/clear)
|
||||
:icon-props (if collected?
|
||||
{:no-color true}
|
||||
{:size 20 :color colors/danger-60 :color-2 colors/white})}])])
|
||||
|
||||
(defn view
|
||||
[]
|
||||
[:<>
|
||||
[quo/drawer-top
|
||||
{:title (i18n/label :t/help-us-improve-status)}]
|
||||
[quo/text
|
||||
{:size :paragraph-1
|
||||
:style {:padding-horizontal 20}}
|
||||
(i18n/label :t/help-us-improve-status-subtitle)]
|
||||
[rn/view {:style {:padding-vertical 8}}
|
||||
[bullet-points]]
|
||||
[privacy-policy-text]])
|
|
@ -0,0 +1,18 @@
|
|||
(ns status-im.contexts.onboarding.share-usage.style)
|
||||
|
||||
(def title-container
|
||||
{:margin-horizontal 20
|
||||
:padding-bottom 20
|
||||
:padding-top 12})
|
||||
|
||||
(defn page-illustration
|
||||
[width]
|
||||
{:flex 1
|
||||
:margin-top 12
|
||||
:margin-bottom 10
|
||||
:width width})
|
||||
|
||||
(defn buttons
|
||||
[insets]
|
||||
{:margin 20
|
||||
:margin-bottom (+ 12 (:bottom insets))})
|
|
@ -0,0 +1,62 @@
|
|||
(ns status-im.contexts.onboarding.share-usage.view
|
||||
(:require
|
||||
[quo.core :as quo]
|
||||
[react-native.core :as rn]
|
||||
[react-native.safe-area :as safe-area]
|
||||
[status-im.common.events-helper :as events-helper]
|
||||
[status-im.common.resources :as resources]
|
||||
[status-im.contexts.onboarding.share-usage.learn-more-sheet :as learn-more-sheet]
|
||||
[status-im.contexts.onboarding.share-usage.style :as style]
|
||||
[utils.i18n :as i18n]
|
||||
[utils.re-frame :as rf]))
|
||||
|
||||
(defn- share-usage-data-fn
|
||||
[enabled? next-screen]
|
||||
(rf/dispatch [:centralized-metrics/toggle-centralized-metrics enabled? true])
|
||||
(if next-screen
|
||||
(rf/dispatch [:navigate-to-within-stack [next-screen :screen/onboarding.share-usage]]) ;; Onboarding
|
||||
(rf/dispatch [:navigate-back]))) ;; Login Screen
|
||||
|
||||
(defn view
|
||||
[]
|
||||
(let [insets (safe-area/get-insets)
|
||||
next-screen (:next-screen (rf/sub [:get-screen-params :screen/onboarding.share-usage]))
|
||||
share-usage-data (rn/use-callback #(share-usage-data-fn true next-screen))
|
||||
maybe-later (rn/use-callback #(share-usage-data-fn false next-screen))
|
||||
learn-more (rn/use-callback #(rf/dispatch [:show-bottom-sheet
|
||||
{:content learn-more-sheet/view
|
||||
:shell? true}]))]
|
||||
[:<>
|
||||
[quo/page-nav
|
||||
{:margin-top (:top insets)
|
||||
:background :blur
|
||||
:icon-name :i/arrow-left
|
||||
:on-press events-helper/navigate-back
|
||||
:right-side [{:icon-left :i/info
|
||||
:accessibility-label :learn-more
|
||||
:label (i18n/label :t/learn-more)
|
||||
:on-press learn-more}]}]
|
||||
[quo/text-combinations
|
||||
{:container-style style/title-container
|
||||
:title (i18n/label :t/help-us-improve-status)
|
||||
:title-accessibility-label :share-usage-title
|
||||
:description (i18n/label :t/collecting-usage-data)
|
||||
:description-accessibility-label :share-usage-subtitle}]
|
||||
[rn/image
|
||||
{:resize-mode :contain
|
||||
:style (style/page-illustration (:width (rn/get-window)))
|
||||
:source (resources/get-image :biometrics)}]
|
||||
[rn/view {:style (style/buttons insets)}
|
||||
[quo/button
|
||||
{:size 40
|
||||
:accessibility-label :share-usage-data
|
||||
:on-press share-usage-data}
|
||||
(i18n/label :t/agree)]
|
||||
[quo/button
|
||||
{:size 40
|
||||
:accessibility-label :maybe-later-button
|
||||
:background :blur
|
||||
:type :grey
|
||||
:on-press maybe-later
|
||||
:container-style {:margin-top 12}}
|
||||
(i18n/label :t/maybe-later)]]]))
|
|
@ -7,7 +7,6 @@
|
|||
[react-native.reanimated :as reanimated]
|
||||
[react-native.safe-area :as safe-area]
|
||||
[status-im.common.confirmation-drawer.view :as confirmation-drawer]
|
||||
[status-im.common.metrics-confirmation-modal.view :as metrics-modal]
|
||||
[status-im.common.standard-authentication.core :as standard-authentication]
|
||||
[status-im.config :as config]
|
||||
[status-im.constants :as constants]
|
||||
|
@ -277,10 +276,10 @@
|
|||
|
||||
(defn view
|
||||
[]
|
||||
(rn/use-mount #(rf/dispatch [:centralized-metrics/check-modal metrics-modal/view]))
|
||||
(let [[show-profiles? set-show-profiles] (rn/use-state true)
|
||||
show-profiles (rn/use-callback #(set-show-profiles true))
|
||||
hide-profiles (rn/use-callback #(set-show-profiles false))]
|
||||
(rn/use-mount #(rf/dispatch [:centralized-metrics/check-user-confirmation]))
|
||||
[:<>
|
||||
[background/view true]
|
||||
(if show-profiles?
|
||||
|
|
|
@ -43,4 +43,4 @@
|
|||
:stickers/packs-pending #{}
|
||||
:settings/change-password {}
|
||||
:keycard {}
|
||||
:theme :light})
|
||||
:theme :dark})
|
||||
|
|
|
@ -103,8 +103,8 @@
|
|||
|
||||
(rf/defn show-next-bottom-sheet
|
||||
{:events [:show-next-bottom-sheet]}
|
||||
[_]
|
||||
{:show-bottom-sheet nil})
|
||||
[{:keys [db] :as cofx}]
|
||||
{:show-bottom-sheet {:theme (:theme db)}})
|
||||
|
||||
(rf/defn show-bottom-sheet
|
||||
{:events [:show-bottom-sheet]}
|
||||
|
|
|
@ -49,6 +49,7 @@
|
|||
[status-im.contexts.onboarding.identifiers.view :as identifiers]
|
||||
[status-im.contexts.onboarding.intro.view :as intro]
|
||||
[status-im.contexts.onboarding.preparing-status.view :as preparing-status]
|
||||
[status-im.contexts.onboarding.share-usage.view :as onboarding.share-usage]
|
||||
[status-im.contexts.onboarding.sign-in.view :as sign-in]
|
||||
[status-im.contexts.onboarding.syncing.progress.view :as syncing-devices]
|
||||
[status-im.contexts.onboarding.syncing.results.view :as syncing-results]
|
||||
|
@ -769,6 +770,18 @@
|
|||
:popStackOnPress false}}
|
||||
:component enable-biometrics/view})
|
||||
|
||||
(def onboarding-share-usage
|
||||
{:name :screen/onboarding.share-usage
|
||||
:metrics {:track? true}
|
||||
:options {:theme :dark
|
||||
:layout options/onboarding-transparent-layout
|
||||
:animations (merge
|
||||
transitions/new-to-status-modal-animations
|
||||
transitions/push-animations-for-transparent-background)
|
||||
:popGesture false
|
||||
:modalPresentationStyle :overCurrentContext}
|
||||
:component onboarding.share-usage/view})
|
||||
|
||||
(def onboarding-preparing-status
|
||||
{:name :screen/onboarding.preparing-status
|
||||
:metrics {:track? true}
|
||||
|
@ -873,6 +886,7 @@
|
|||
onboarding-entering-seed-phrase
|
||||
onboarding-enable-notifications
|
||||
onboarding-identifiers
|
||||
onboarding-share-usage
|
||||
onboarding-sign-in-intro
|
||||
onboarding-sign-in
|
||||
onboarding-syncing-progress
|
||||
|
|
|
@ -108,6 +108,7 @@
|
|||
"advertiser-starter-pack-description": "Here’s some crypto to get you started! Use it to get stickers, an ENS name and try dapps",
|
||||
"advertiser-starter-pack-title": "Starter Pack",
|
||||
"advertiser-title": "Privacy by default",
|
||||
"agree": "Agree",
|
||||
"agree-by-continuing": "By continuing you agree\n to our ",
|
||||
"airdrop-addresses": "Address for airdrops",
|
||||
"album-images-count": "{{album-images-count}} photos",
|
||||
|
@ -1148,6 +1149,12 @@
|
|||
"help-center": "Help Center",
|
||||
"help-improve-status": "Help improve Status",
|
||||
"help-us-improve-status": "Help us improve Status",
|
||||
"help-us-improve-status-bullet-point-1": "Collect basic usage data like taps and page views",
|
||||
"help-us-improve-status-bullet-point-2": "Collect core diagnostics, like bandwidth usage",
|
||||
"help-us-improve-status-bullet-point-3": "Never collect your profile information or wallet address",
|
||||
"help-us-improve-status-bullet-point-4": "Never collect information you input or send",
|
||||
"help-us-improve-status-bullet-point-5": "Never sell your usage analytics data",
|
||||
"help-us-improve-status-subtitle": "We’ll collect anonymous analytics and diagnostics from your app to enhance Status’s quality and performance.",
|
||||
"here-is-a-cat-in-a-box-instead": "Here’s a cat in a box instead",
|
||||
"hex": "Hex",
|
||||
"hide": "Hide",
|
||||
|
@ -1637,6 +1644,7 @@
|
|||
"more": "more",
|
||||
"more-details": "More details",
|
||||
"more-details-in-privacy-policy-1": "For more details refer to our ",
|
||||
"more-details-in-privacy-policy-1-onboarding": "For more details and other cases where we handle your data, refer to our ",
|
||||
"more-details-in-privacy-policy-2": "Privacy Policy",
|
||||
"more-details-in-privacy-policy-settings-1": "For details on this and other potential limited data processing by Status, see our ",
|
||||
"move-and-reset": "Move and Reset",
|
||||
|
|
Loading…
Reference in New Issue