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

Fixes #3944: Improve metrics opt-in screen 

Signed-off-by: Julien Eluard <julien.eluard@gmail.com>
This commit is contained in:
pacamara 2018-05-11 09:54:18 +01:00 committed by Julien Eluard
parent 89632bea1b
commit 7334938d96
No known key found for this signature in database
GPG Key ID: 6FD7DB5437FCBEF6
6 changed files with 83 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
resources/images/ui/analytics-image.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.9 KiB

After

Width:  |  Height:  |  Size: 26 KiB

10
src/status_im/translations/en.cljs
View File

@ -50,9 +50,13 @@
:help-improve "Help improve Status\nby sharing usage patterns"
:help-improve? "Help improve Status?"
:help-improve-description "We collect anonymous data to help improve Status."
:share-usage-data "Share usage"
:dont-want-to-share "No, I don't want to share"
:help-improve-description "We collect anonymous data to understand how Status is used and inform future development. Whilst we appreciate your help to make Status better, this is an optional choice and can be changed at any time."
:learn-what-we-collect-link "Learn more about what we collect"
:share-usage-data "Share data"
:dont-want-to-share "Do not share"
:confirmation-title "Share data with Status?"
:confirmation-text "Are you sure you want to share anonymous data with Status?"
:confirmation-action "Share"
;;drawer
:switch-users "Switch users"

6
src/status_im/ui/components/common/common.cljs
View File

@ -72,10 +72,10 @@
(when forward?
[icons/icon :icons/forward {:color colors/blue}])]])
(defn button [{:keys [on-press label background? button-style label-style] :or {background? true}}]
(defn button [{:keys [on-press label background? uppercase? button-style label-style] :or {background? true uppercase? true}}]
[react/touchable-highlight {:on-press on-press}
[react/view {:style (styles/button button-style background?)}
[react/text {:uppercase? true
[react/text {:uppercase? uppercase?
:style (merge styles/button-label label-style)}
label]]])
@ -99,4 +99,4 @@
:resize-mode :contain
:style (merge style
{:width @content-width
:height (/ (* @content-width height) width)})}]])})))
:height (/ (* @content-width height) width)})}]])})))

75
src/status_im/ui/screens/usage_data/styles.cljs
View File

@ -1,48 +1,71 @@
(ns status-im.ui.screens.usage-data.styles
(:require-macros [status-im.utils.styles :refer [defnstyle defstyle]])
(:require [status-im.ui.components.colors :as colors]))
(:require [status-im.ui.components.colors :as colors]
[status-im.ui.components.react :as react]
[status-im.utils.platform :as platform]))
(def window-width (:width (react/get-dimensions "window")))
(def window-height (:height (react/get-dimensions "window")))
(defn scaled-x [n] (* (/ window-width 375) n))
(defn scaled-y [n] (* (/ window-height 667) n))
(def usage-data-view
{:flex 1
:padding-horizontal 30
:background-color colors/white})
:background-color colors/white
:align-items :center})
(def logo-container
(def image-container
{:flex 1
:align-items :center
:justify-content :center})
(def logo
{:size 82
:icon-size 34})
:justify-content :center
:margin-top (scaled-y 90)
:margin-bottom (scaled-y 90)})
(def usage-data-image
{:width 138
:height 208
:margin-top 10})
{:width (* (/ 390 432) (scaled-y 138))
:height (scaled-y 138)})
(defstyle help-improve-text
{:text-align :center
:color colors/black
:ios {:line-height 28
:font-size 22
:font-weight :bold
:letter-spacing -0.3}
:android {:font-size 24
:line-height 30}})
{:text-align :center
:color colors/black
:margin-bottom (scaled-y 8)
:margin-left 46
:margin-right 46
:ios {:line-height 28
:font-size 22
:font-weight :bold
:letter-spacing -0.3}
:android {:font-size 24
:line-height 30}})
(def help-improve-text-description
{:line-height 21
:margin-top 8
:margin-bottom 16
:margin-bottom (scaled-y 26)
:margin-left 34
:margin-right 34
:font-size 14
:letter-spacing -0.2
:text-align :center
:color colors/gray})
(def buttons-container
{:align-items :center})
(def learn-what-we-collect-link
{:text-align :center
:color colors/blue
:margin-bottom (scaled-y 109)
:margin-left 61
:margin-right 63})
(def bottom-button-container
{:margin-bottom 6
:margin-top 38})
{:flex-direction :row
:margin-bottom (scaled-y (if platform/ios? 96 48))
:margin-left 41
:margin-right 42})
(def share-button
{:padding-horizontal 18
:width (scaled-x 138)
:margin-right 16})
(def dont-share-button
{:padding-horizontal 18
:width (scaled-x 138)})

32
src/status_im/ui/screens/usage_data/views.cljs
View File

@ -6,14 +6,14 @@
[status-im.ui.components.common.common :as components.common]
[status-im.ui.components.react :as react]
[status-im.ui.components.status-bar.view :as status-bar]
[status-im.ui.screens.usage-data.styles :as styles]))
[status-im.ui.screens.usage-data.styles :as styles]
[status-im.utils.utils :as utils]))
(views/defview usage-data []
(views/letsubs [next [:get-screen-params]]
[react/view {:style styles/usage-data-view}
[status-bar/status-bar {:flat? true}]
[react/view {:style styles/logo-container}
[components.common/logo styles/logo]
[react/view {:style styles/image-container}
[react/image {:source (:analytics-image resources/ui)
:style styles/usage-data-image}]]
[react/text {:style styles/help-improve-text}
@ -21,11 +21,21 @@
[react/view
[react/text {:style styles/help-improve-text-description}
(i18n/label :t/help-improve-description)]]
[react/view styles/buttons-container
[components.common/button {:button-style {:flex-direction :row}
:on-press #(re-frame/dispatch [:help-improve-handler true next])
:label (i18n/label :t/share-usage-data)}]
[react/view styles/bottom-button-container
[components.common/button {:on-press #(re-frame/dispatch [:help-improve-handler false next])
:label (i18n/label :t/dont-want-to-share)
:background? false}]]]]))
[react/text {:style styles/learn-what-we-collect-link
:on-press #(.openURL react/linking "https://wiki.status.im/Help_Improve_Status#Help_Improve_Status")}
(i18n/label :t/learn-what-we-collect-link)]
[react/view styles/bottom-button-container
[components.common/button {:button-style styles/share-button
:uppercase? false
:on-press #(utils/show-confirmation {:ios-confirm-style "default"}
(i18n/label :t/confirmation-title)
(i18n/label :t/confirmation-text)
(i18n/label :t/confirmation-action)
(fn [] (re-frame/dispatch [:help-improve-handler true next]))
nil)
:label (i18n/label :t/share-usage-data)}]
[components.common/button {:button-style styles/dont-share-button
:uppercase? false
:on-press #(re-frame/dispatch [:help-improve-handler false next])
:label (i18n/label :t/dont-want-to-share)}]]]))

4
src/status_im/utils/utils.cljs
View File

@ -23,6 +23,8 @@
([title content confirm-button-text on-accept]
(show-confirmation title content confirm-button-text on-accept nil))
([title content confirm-button-text on-accept on-cancel]
(show-confirmation nil title content confirm-button-text on-accept on-cancel))
([{:keys [ios-confirm-style] :or {ios-confirm-style "destructive"}} title content confirm-button-text on-accept on-cancel]
(.alert (.-Alert rn-dependencies/react-native)
title
content
@ -34,7 +36,7 @@
(when on-cancel {:onPress on-cancel}))
{:text (or confirm-button-text "OK")
:onPress on-accept
:style "destructive"
:style ios-confirm-style
:accessibility-label :confirm-button})))))
(defn show-question