diff options
author | Dan J Miller <danjm.com@gmail.com> | 2019-03-05 23:45:01 +0800 |
---|---|---|
committer | GitHub <noreply@github.com> | 2019-03-05 23:45:01 +0800 |
commit | c7573663557b0db778a2907eaf2fd1918ced4914 (patch) | |
tree | 3fed2dbe12a845704bff3268e9ee610d55bcc8c2 /ui/app/components/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js | |
parent | 1765864e40f548b805cdbdbe59ada3e0c445a52d (diff) | |
download | tangerine-wallet-browser-c7573663557b0db778a2907eaf2fd1918ced4914.tar.gz tangerine-wallet-browser-c7573663557b0db778a2907eaf2fd1918ced4914.tar.zst tangerine-wallet-browser-c7573663557b0db778a2907eaf2fd1918ced4914.zip |
Metametrics (#6171)
* Add metametrics provider and util.
* Add backend api and state for participating in metametrics.
* Add frontend action for participating in metametrics.
* Add metametrics opt-in screen.
* Add metametrics events to first time flow.
* Add metametrics events for route changes
* Add metametrics events for send and confirm screens
* Add metametrics events to dropdowns, transactions, log in and out, settings, sig requests and main screen
* Ensures each log in is measured as a new visit by metametrics.
* Ensure metametrics is called with an empty string for dimensions params if specified
* Adds opt in metametrics modal after unlock for existing users
* Adds settings page toggle for opting in and out of MetaMetrics
* Switch metametrics dimensions to page level scope
* Lint, test and translation fixes for metametrics.
* Update design for metametrics opt-in screen
* Complete responsive styling of metametrics-opt-in modal
* Use new chart image on metrics opt in screens
* Incorporate the metametrics opt-in screen into the new onboarding flow
* Update e2e tests to accomodate metametrics changes
* Mock out metametrics network requests in integration tests
* Fix tx-list integration test to support metametrics provider.
* Send number of tokens and accounts data with every metametrics event.
* Update metametrics event descriptor schema and add new events.
* Fix import tos bug and send gas button bug due to metametrics changes.
* Various small fixes on the metametrics branch.
* Add origin custom variable type to metametrics.util
* Fix names of onboarding complete actions (metametrics).
* Fix names of Metrics Options actions (metametrics).
* Clean up code related to metametrics.
* Fix bad merge conflict resolution and improve promise handling in sendMetaMetrics event and confrim tx base
* Don't send a second metrics event if user has gone back during first time flow.
* Collect metametrics on going back from onboarding create/import.
* Add missing custom variable constants for metametrics
* Fix metametrics provider
* Make height of opt-in modal responsive.
* Adjust text content for opt-in modal.
* Update metametrics event names and clean up code in opt-in-modal
* Put phishing warning step next to last in onboarding flow
* Link terms of service on create and import screens of first time flow
* Add subtext to options on the onboarding select action screen.
* Fix styling of bullet points on end of onboarding screen.
* Combine phishing warning and congratulations screens.
* Fix placement of users if unlocking after an incomplete onboarding import flow.
* Fix capitalization in opt-in screen
* Fix last onboarding screen translations
* Add link to 'Learn More' on the last screen of onboarding
* Code clean up: metametrics branch
* Update e2e tests for phishing warning step removal
* e2e tests passing on metametrics branch
* Different tracking urls for metametrics on development and prod
Diffstat (limited to 'ui/app/components/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js')
-rw-r--r-- | ui/app/components/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js | 135 |
1 files changed, 135 insertions, 0 deletions
diff --git a/ui/app/components/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js b/ui/app/components/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js new file mode 100644 index 000000000..36f1ed92d --- /dev/null +++ b/ui/app/components/modals/metametrics-opt-in-modal/metametrics-opt-in-modal.component.js @@ -0,0 +1,135 @@ +import React, { Component } from 'react' +import PropTypes from 'prop-types' +import PageContainerFooter from '../../page-container/page-container-footer' + +export default class MetaMetricsOptInModal extends Component { + static propTypes = { + setParticipateInMetaMetrics: PropTypes.func, + hideModal: PropTypes.func, + } + + static contextTypes = { + metricsEvent: PropTypes.func, + } + + render () { + const { metricsEvent } = this.context + const { setParticipateInMetaMetrics, hideModal } = this.props + + return ( + <div className="metametrics-opt-in metametrics-opt-in-modal"> + <div className="metametrics-opt-in__main"> + <div className="metametrics-opt-in__content"> + <div className="app-header__logo-container"> + <img + className="app-header__metafox-logo app-header__metafox-logo--horizontal" + src="/images/logo/metamask-logo-horizontal.svg" + height={30} + /> + <img + className="app-header__metafox-logo app-header__metafox-logo--icon" + src="/images/logo/metamask-fox.svg" + height={42} + width={42} + /> + </div> + <div className="metametrics-opt-in__body-graphic"> + <img src="images/metrics-chart.svg" /> + </div> + <div className="metametrics-opt-in__title">Help Us Improve MetaMask</div> + <div className="metametrics-opt-in__body"> + <div className="metametrics-opt-in__description"> + MetaMask would like to gather usage data to better understand how our users interact with the extension. This data + will be used to continually improve the usability and user experience of our product and the etheruem ecosystem. + </div> + <div className="metametrics-opt-in__description"> + MetaMask will.. + </div> + + <div className="metametrics-opt-in__committments"> + <div className="metametrics-opt-in__row"> + <i className="fa fa-check" /> + <div className="metametrics-opt-in__row-description"> + Always allow you to opt-out via Settings + </div> + </div> + <div className="metametrics-opt-in__row"> + <i className="fa fa-check" /> + <div className="metametrics-opt-in__row-description"> + Send anonymized click & pageview events + </div> + </div> + <div className="metametrics-opt-in__row"> + <i className="fa fa-check" /> + <div className="metametrics-opt-in__row-description"> + Maintain a public aggregate dashboard to educate the community + </div> + </div> + <div className="metametrics-opt-in__row metametrics-opt-in__break-row"> + <i className="fa fa-times" /> + <div className="metametrics-opt-in__row-description"> + <span className="metametrics-opt-in__bold">Never</span> collect keys, addresses, transactions, balances, hashes, or any personal information + </div> + </div> + <div className="metametrics-opt-in__row"> + <i className="fa fa-times" /> + <div className="metametrics-opt-in__row-description"> + <span className="metametrics-opt-in__bold">Never</span> collect your full IP address + </div> + </div> + <div className="metametrics-opt-in__row"> + <i className="fa fa-times" /> + <div className="metametrics-opt-in__row-description"> + <span className="metametrics-opt-in__bold">Never</span> sell data for profit. Ever! + </div> + </div> + </div> + </div> + <div className="metametrics-opt-in__bottom-text"> + This data is aggregated and is therefore anonymous for the purposes of General Data Protection Regulation (EU) 2016/679. For more information in relation to our privacy practices, please see our Privacy Policy here. + </div> + </div> + <div className="metametrics-opt-in__footer"> + <PageContainerFooter + onCancel={() => { + setParticipateInMetaMetrics(false) + .then(() => { + metricsEvent({ + eventOpts: { + category: 'Onboarding', + action: 'Metrics Option', + name: 'Metrics Opt Out', + }, + isOptIn: true, + }, { + excludeMetaMetricsId: true, + }) + hideModal() + }) + }} + cancelText={'No Thanks'} + hideCancel={false} + onSubmit={() => { + setParticipateInMetaMetrics(true) + .then(() => { + metricsEvent({ + eventOpts: { + category: 'Onboarding', + action: 'Metrics Option', + name: 'Metrics Opt In', + }, + isOptIn: true, + }) + hideModal() + }) + }} + submitText={'I agree'} + submitButtonType={'confirm'} + disabled={false} + /> + </div> + </div> + </div> + ) + } +} |