From 071e835fdbd3aa86b92c1ea1fa18ef78ce6e4dcd Mon Sep 17 00:00:00 2001 From: Ben Date: Tue, 26 Jan 2021 14:19:30 -0500 Subject: [PATCH 01/12] Add setup_number for step 1 and step 2 --- .../OnboardingView/OnboardingConstants.js | 4 ++ .../Step1_CreateAccountView.jsx | 26 ++++++++++--- .../BlockSettingsView.jsx | 37 +++++++++++++++---- 3 files changed, 54 insertions(+), 13 deletions(-) diff --git a/app/ghostery-browser-hub/Views/OnboardingView/OnboardingConstants.js b/app/ghostery-browser-hub/Views/OnboardingView/OnboardingConstants.js index fc325d8fb..bc88ffb5c 100644 --- a/app/ghostery-browser-hub/Views/OnboardingView/OnboardingConstants.js +++ b/app/ghostery-browser-hub/Views/OnboardingView/OnboardingConstants.js @@ -10,3 +10,7 @@ export const BLOCK_SETTINGS = '2'; export const CHOOSE_DEFAULT_SEARCH = '3'; export const CHOOSE_PLAN = '4'; export const SUCCESS = '5'; + +export const SIGN_IN_SUCCESSFUL = '1'; +export const CREATE_ACCOUNT_SUCCESSFUL = '2'; +export const SKIP_ACCOUNT_CREATION = '3'; diff --git a/app/ghostery-browser-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx b/app/ghostery-browser-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx index 985b346ee..0a9ac2832 100644 --- a/app/ghostery-browser-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx +++ b/app/ghostery-browser-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx @@ -17,7 +17,13 @@ import PropTypes from 'prop-types'; import Step1_LogInForm from '../Step1_LogInForm'; import Step1_CreateAccountForm from '../Step1_CreateAccountForm'; import globals from '../../../../../src/classes/Globals'; -import { LOGIN, ONBOARDING } from '../../OnboardingView/OnboardingConstants'; +import { + LOGIN, + ONBOARDING, + SIGN_IN_SUCCESSFUL, + CREATE_ACCOUNT_SUCCESSFUL, + SKIP_ACCOUNT_CREATION +} from '../../OnboardingView/OnboardingConstants'; const SIGN_IN = 'SIGN_IN'; const CREATE_ACCOUNT = 'CREATE_ACCOUNT'; @@ -59,8 +65,12 @@ const Step1_CreateAccountView = (props) => { const [view, setView] = useState(CREATE_ACCOUNT); - const handleSkipButton = () => { - setSetupStep({ setup_step: LOGIN, origin: ONBOARDING }); + const handleSkipButton = (setup_number) => { + setSetupStep({ + setup_step: LOGIN, + setup_number, + origin: ONBOARDING, + }); setToast({ toastMessage: '', toastClass: '' @@ -70,6 +80,12 @@ const Step1_CreateAccountView = (props) => { const handleNextOnSelectPlanStep = () => { const { prev } = props; + setSetupStep({ + setup_step: LOGIN, + setup_number: CREATE_ACCOUNT_SUCCESSFUL, + origin: ONBOARDING, + }); + setToast({ toastMessage: '', toastClass: '' @@ -82,7 +98,7 @@ const Step1_CreateAccountView = (props) => {
- handleSkipButton()}> + handleSkipButton(SKIP_ACCOUNT_CREATION)}> {t('ghostery_dawn_onboarding_skip')}
@@ -99,7 +115,7 @@ const Step1_CreateAccountView = (props) => {
{email}
{step === LOGIN && ( - handleSkipButton()}> + handleSkipButton(SIGN_IN_SUCCESSFUL)}> {t('next')} )} diff --git a/app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx b/app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx index c4691c26b..a22f0efe1 100644 --- a/app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx +++ b/app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx @@ -42,7 +42,7 @@ class BlockSettingsView extends Component { this.setState({ recommendedChoices: true, blockAds: true, - kindsOfTrackers: 1, + kindsOfTrackers: 2, antiTracking: true, smartBrowsing: true }); @@ -61,6 +61,23 @@ class BlockSettingsView extends Component { this.setState({ [category]: answer }); } + // Refer to https://ghostery.atlassian.net/wiki/spaces/BI/pages/488079383/Ghostery+Browser+-+Onboarding+Pings for setup_number string formatting + buildSetupNumberString = () => { + const { + blockAds, + kindsOfTrackers, + antiTracking, + smartBrowsing + } = this.state; + + const partOne = (blockAds) ? '1' : '2'; + const partTwo = kindsOfTrackers.toString(); + const partThree = (antiTracking) ? '1' : '2'; + const partFour = (smartBrowsing) ? '1' : '2'; + + return partOne + partTwo + partThree + partFour; + } + handleSubmit = () => { const { blockAds, kindsOfTrackers, antiTracking, smartBrowsing @@ -87,13 +104,13 @@ class BlockSettingsView extends Component { let blockingPolicy; switch (kindsOfTrackers) { - case 0: + case 1: blockingPolicy = 'BLOCKING_POLICY_EVERYTHING'; break; - case 1: + case 2: blockingPolicy = 'BLOCKING_POLICY_RECOMMENDED'; break; - case 2: + case 3: blockingPolicy = 'BLOCKING_POLICY_NOTHING'; break; default: @@ -101,7 +118,11 @@ class BlockSettingsView extends Component { } setBlockingPolicy({ blockingPolicy }); - setSetupStep({ setup_step: CHOOSE_DEFAULT_SEARCH, origin: ONBOARDING }); + setSetupStep({ + setup_step: CHOOSE_DEFAULT_SEARCH, + setup_number: this.buildSetupNumberString(), + origin: ONBOARDING + }); history.push('/onboarding/3'); } else { setToast({ @@ -163,19 +184,19 @@ class BlockSettingsView extends Component {
- this.handleAnswerChange('kindsOfTrackers', 0)} altDesign /> + this.handleAnswerChange('kindsOfTrackers', 1)} altDesign />
{t('ghostery_dawn_onboarding_kinds_of_trackers_all')}
- this.handleAnswerChange('kindsOfTrackers', 1)} altDesign /> + this.handleAnswerChange('kindsOfTrackers', 2)} altDesign />
{t('ghostery_dawn_onboarding_kinds_of_trackers_ad_and_analytics')}
- this.handleAnswerChange('kindsOfTrackers', 2)} altDesign /> + this.handleAnswerChange('kindsOfTrackers', 3)} altDesign />
{t('ghostery_dawn_onboarding_kinds_of_trackers_none')}
From 17047d9d747fd858f647410508caf2e60ebc1493 Mon Sep 17 00:00:00 2001 From: Ben Date: Tue, 26 Jan 2021 15:58:19 -0500 Subject: [PATCH 02/12] Get rid of dawn_setup_number, replace with setup_number --- src/background.js | 1 + 1 file changed, 1 insertion(+) diff --git a/src/background.js b/src/background.js index e2f9e4062..057c4fa73 100644 --- a/src/background.js +++ b/src/background.js @@ -524,6 +524,7 @@ function handleGhosteryHub(name, message, callback) { const origin = message.origin || ''; if (origin === 'onboarding') { conf.setup_step = message.setup_step; + conf.setup_number = message.setup_number; metrics.ping('gb_onboarding'); } callback({ setup_step }); From 6c7ecff452e9deb58b5cdf66008ef8f2572f1daf Mon Sep 17 00:00:00 2001 From: Ben Date: Wed, 27 Jan 2021 04:20:04 -0500 Subject: [PATCH 03/12] Add setup_number to ChooseSearchView --- _locales/en/messages.json | 2 +- .../BlockSettingsView.jsx | 2 +- .../ChooseDefaultSearchConstants.js | 10 +++ .../ChooseDefaultSearchView.jsx | 71 +++++++++++++++---- 4 files changed, 69 insertions(+), 16 deletions(-) diff --git a/_locales/en/messages.json b/_locales/en/messages.json index 51fc98d76..765174e11 100644 --- a/_locales/en/messages.json +++ b/_locales/en/messages.json @@ -2436,7 +2436,7 @@ "ghostery_dawn_onboarding_select_option": { "message": "Select option" }, - "ghostery_dawn_onboarding_you_have_selected_an_alternate_serach_engine": { + "ghostery_dawn_onboarding_you_have_selected_an_alternate_search_engine": { "message": "You have selected an alternate search engine:" }, "ghostery_dawn_onboarding_create_account_for_trial": { diff --git a/app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx b/app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx index d30ded0a7..4b9e2c236 100644 --- a/app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx +++ b/app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx @@ -75,7 +75,7 @@ class BlockSettingsView extends Component { const partThree = (antiTracking) ? '1' : '2'; const partFour = (smartBrowsing) ? '1' : '2'; - return partOne + partTwo + partThree + partFour; + return `${partOne}${partTwo}${partThree}${partFour}`; } handleSubmit = () => { diff --git a/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants.js b/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants.js index e1cbe5caf..db54563e1 100644 --- a/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants.js +++ b/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants.js @@ -16,4 +16,14 @@ export const SEARCH_GHOSTERY = 'Ghostery'; export const SEARCH_BING = 'Bing'; export const SEARCH_YAHOO = 'Yahoo'; export const SEARCH_STARTPAGE = 'Startpage'; +export const SEARCH_DUCKDUCK_GO = 'DuckDuck Go'; +export const SEARCH_ECOSIA = 'Ecosia'; +export const SEARCH_EKORU = 'Ekoru'; +export const SEARCH_GIBIRU = 'Gibiru'; +export const SEARCH_GOOGLE = 'Google'; +export const SEARCH_ONESEARCH = 'OneSearch'; +export const SEARCH_PRIVADO = 'Privado'; +export const SEARCH_QWANT = 'Qwant'; +export const SEARCH_ENCRYPT = 'Search Encrypt'; +export const SEARCH_TAILCAT = 'Tailcat'; export const SEARCH_OTHER = t('ghostery_dawn_onboarding_other'); diff --git a/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx b/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx index ac0ad7dab..5578692fd 100644 --- a/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx +++ b/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx @@ -18,13 +18,39 @@ import RadioButton from '../../../../shared-components/RadioButton'; import { ONBOARDING, CHOOSE_PLAN } from '../../OnboardingView/OnboardingConstants'; import { SEARCH_GHOSTERY, + SEARCH_BING, SEARCH_YAHOO, SEARCH_STARTPAGE, - SEARCH_BING, + SEARCH_DUCKDUCK_GO, + SEARCH_ECOSIA, + SEARCH_EKORU, + SEARCH_GIBIRU, + SEARCH_GOOGLE, + SEARCH_ONESEARCH, + SEARCH_PRIVADO, + SEARCH_QWANT, + SEARCH_ENCRYPT, + SEARCH_TAILCAT, SEARCH_OTHER } from './ChooseDefaultSearchConstants'; import { Modal } from '../../../../shared-components'; +const mapSearchToSetupNumber = { + Ghostery: 1, + Bing: 2, + Yahoo: 3, + Startpage: 4, + 'DuckDuck Go': 6, + Ecosia: 7, + Ekoru: 8, + Gibiru: 9, + Google: 10, + OneSearch: 11, + Privado: 12, + Qwant: 13, + 'Search Encrypt': 14, + Tailcat: 15, +}; class ChooseDefaultSearchView extends Component { constructor(props) { super(props); @@ -79,7 +105,21 @@ class ChooseDefaultSearchView extends Component { const { actions, history } = this.props; const { setSetupStep, setDefaultSearch } = actions; - if (chosenSearch === SEARCH_OTHER && otherSearchSelected) { + if (otherSearchSelected && + ( + SEARCH_DUCKDUCK_GO || + SEARCH_ECOSIA || + SEARCH_EKORU || + SEARCH_ECOSIA || + SEARCH_GIBIRU || + SEARCH_GOOGLE || + SEARCH_ONESEARCH || + SEARCH_PRIVADO || + SEARCH_QWANT || + SEARCH_ENCRYPT || + SEARCH_TAILCAT + ) + ) { chosenSearch = otherSearchSelected; } @@ -105,7 +145,11 @@ class ChooseDefaultSearchView extends Component { // }); setDefaultSearch(chosenSearch); - setSetupStep({ setup_step: CHOOSE_PLAN, origin: ONBOARDING }); + setSetupStep({ + setup_step: CHOOSE_PLAN, + setup_number: mapSearchToSetupNumber[chosenSearch], + origin: ONBOARDING + }); history.push(`/${ONBOARDING}/${CHOOSE_PLAN}`); } @@ -151,16 +195,15 @@ class ChooseDefaultSearchView extends Component { renderOtherOptionsList = () => { const otherSearchOptions = [ - 'DuckDuck Go', - 'Ecosia', - 'Ekoru', - 'Gibiru', - 'Google', - 'OneSearch', - 'Privado', - 'Qwant', - 'Search Encrypt', - 'Tailcat', + SEARCH_DUCKDUCK_GO, + SEARCH_ECOSIA, + SEARCH_EKORU, + SEARCH_GOOGLE, + SEARCH_ONESEARCH, + SEARCH_PRIVADO, + SEARCH_QWANT, + SEARCH_ENCRYPT, + SEARCH_TAILCAT, ]; return ( @@ -241,7 +284,7 @@ class ChooseDefaultSearchView extends Component { {(searchBeingConsidered === SEARCH_OTHER) && ( { - `${t('ghostery_dawn_onboarding_you_have_selected_an_alternate_serach_engine')} \n + `${t('ghostery_dawn_onboarding_you_have_selected_an_alternate_search_engine')} \n ${otherSearchSelected}` } From c5dbdb11713c17c9540780137b9ef70206ba79fb Mon Sep 17 00:00:00 2001 From: Ben Date: Wed, 27 Jan 2021 05:16:11 -0500 Subject: [PATCH 04/12] Add setup_number to ChooseDefaultSearchView. TODO: Add trial setup pings 2, and 3 --- .../ChooseDefaultSearchView.jsx | 1 + .../Step4_ChoosePlanView/ChoosePlanView.jsx | 8 ++++---- 2 files changed, 5 insertions(+), 4 deletions(-) diff --git a/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx b/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx index 5578692fd..b7f2985cb 100644 --- a/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx +++ b/app/ghostery-browser-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx @@ -198,6 +198,7 @@ class ChooseDefaultSearchView extends Component { SEARCH_DUCKDUCK_GO, SEARCH_ECOSIA, SEARCH_EKORU, + SEARCH_GIBIRU, SEARCH_GOOGLE, SEARCH_ONESEARCH, SEARCH_PRIVADO, diff --git a/app/ghostery-browser-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx b/app/ghostery-browser-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx index 6b23a5728..4e97207b7 100644 --- a/app/ghostery-browser-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx +++ b/app/ghostery-browser-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx @@ -363,20 +363,20 @@ class ChoosePlanView extends React.Component { {(isBasic && (
{(selectedPlan === BASIC) && ( - setSetupStep({ setup_step: CHOOSE_PLAN, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 1, origin: ONBOARDING })}> {t('next_or_start_trial')} )} {selectedPlan === PLUS && ( - {t('next_or_start_trial')} + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 4, origin: ONBOARDING })} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )} {selectedPlan === PREMIUM && ( - {t('next_or_start_trial')} + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 5, origin: ONBOARDING })} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )}
))} {isPremium && ( - setSetupStep({ setup_step: CHOOSE_PLAN, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 5, origin: ONBOARDING })}> {t('next')} )} From cd47952ba36fb11845f49056f98dc1f440d62d34 Mon Sep 17 00:00:00 2001 From: Ben Date: Wed, 27 Jan 2021 10:12:03 -0500 Subject: [PATCH 05/12] Add back in subscriptionType ping param... --- src/classes/Metrics.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/classes/Metrics.js b/src/classes/Metrics.js index 69cf8ab9d..c2ada585c 100644 --- a/src/classes/Metrics.js +++ b/src/classes/Metrics.js @@ -257,7 +257,8 @@ class Metrics { this._buildQueryPair('id', conf.install_date) + // Showing campaign messages (former show_cmp) this._buildQueryPair('sc', conf.show_cmp ? '1' : '0') + - // Subscription Typerics._getSubscriptionType().toString()) + + // Subscription Type + this._buildQueryPair('st', Metrics._getSubscriptionType().toString()) + // New parameters for Ghostery 8.5.2 // Subscription Interval From d1c592324026f8f3c4ed72c095097b6c1220cfc1 Mon Sep 17 00:00:00 2001 From: Ben Date: Wed, 27 Jan 2021 17:47:46 -0500 Subject: [PATCH 06/12] Update setup_number to use fetchSearchEnginesAsync value for other dropdown list --- .../OnboardingView/OnboardingConstants.js | 3 ++ .../ChooseDefaultSearchView.jsx | 33 +++++++------------ 2 files changed, 15 insertions(+), 21 deletions(-) diff --git a/app/dawn-hub/Views/OnboardingView/OnboardingConstants.js b/app/dawn-hub/Views/OnboardingView/OnboardingConstants.js index 522154ce7..1a74da084 100644 --- a/app/dawn-hub/Views/OnboardingView/OnboardingConstants.js +++ b/app/dawn-hub/Views/OnboardingView/OnboardingConstants.js @@ -19,3 +19,6 @@ export const BLOCK_SETTINGS = '2'; export const CHOOSE_DEFAULT_SEARCH = '3'; export const CHOOSE_PLAN = '4'; export const SUCCESS = '5'; +export const SIGN_IN_SUCCESSFUL = '1'; +export const CREATE_ACCOUNT_SUCCESSFUL = '2'; +export const SKIP_ACCOUNT_CREATION = '3'; diff --git a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx index de0fc742c..d1575da0d 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx @@ -21,16 +21,6 @@ import { SEARCH_BING, SEARCH_YAHOO, SEARCH_STARTPAGE, - SEARCH_DUCKDUCK_GO, - SEARCH_ECOSIA, - SEARCH_EKORU, - SEARCH_GIBIRU, - SEARCH_GOOGLE, - SEARCH_ONESEARCH, - SEARCH_PRIVADO, - SEARCH_QWANT, - SEARCH_ENCRYPT, - SEARCH_TAILCAT, SEARCH_OTHER } from './ChooseDefaultSearchConstants'; import { Modal } from '../../../../shared-components'; @@ -51,6 +41,7 @@ const mapSearchToSetupNumber = { 'Search Encrypt': 14, Tailcat: 15, }; + class ChooseDefaultSearchView extends Component { constructor(props) { super(props); @@ -68,6 +59,16 @@ class ChooseDefaultSearchView extends Component { this.fetchSearchEnginesAsync = this.fetchSearchEnginesAsync.bind(this); } + componentDidMount() { + document.addEventListener('click', this.handleClickAway); + + this.fetchSearchEnginesAsync(); + } + + componentWillUnmount() { + document.removeEventListener('click', this.handleClickAway); + } + async fetchSearchEnginesAsync() { // eslint-disable-next-line no-undef if (typeof browser === 'undefined') { // we are not in Dawn (or Firefox) @@ -95,16 +96,6 @@ class ChooseDefaultSearchView extends Component { })); } - componentDidMount() { - document.addEventListener('click', this.handleClickAway); - - this.fetchSearchEnginesAsync(); - } - - componentWillUnmount() { - document.removeEventListener('click', this.handleClickAway); - } - updateSelection = () => this.setState(prevState => ( { chosenSearch: prevState.searchBeingConsidered, @@ -166,7 +157,7 @@ class ChooseDefaultSearchView extends Component { setDefaultSearch(chosenSearch); setSetupStep({ setup_step: CHOOSE_PLAN, - setup_number: mapSearchToSetupNumber[chosenSearch], + setup_number: mapSearchToSetupNumber[chosenSearchName], origin: ONBOARDING }); history.push(`/${ONBOARDING}/${CHOOSE_PLAN}`); From 9b5a66cddb2bf60e193b1554c7064150c969ef4a Mon Sep 17 00:00:00 2001 From: Ben Date: Wed, 27 Jan 2021 18:27:52 -0500 Subject: [PATCH 07/12] Update setSetupStep setup_numbers --- .../Step4_ChoosePlanView/ChoosePlanView.jsx | 150 +++++++++--------- 1 file changed, 76 insertions(+), 74 deletions(-) diff --git a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx index ecf86a2da..6df7ea5d5 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx @@ -77,72 +77,6 @@ const basicCard = (checked, handleClick) => { ); }; -const premiumCard = (checked, handleClick, showCTAButton = false) => { - const cardClassNames = ClassNames('ChoosePlanView__card premium', { - checked - }); - return ( - -
-
-
- -
-
-
-
-
-

Ghostery Premium

-
- -

$11.99

-

{t('per_month')}

- -
-

{t('hub_upgrade_maximum_protection')}

-
-
- - {t('ghostery_dawn_onboarding_private_search')} -
-
- - {t('ghostery_dawn_onboarding_tracker_protection')} -
-
- - {t('ghostery_dawn_onboarding_speedy_page_loads')} -
-
- - {t('ghostery_dawn_onboarding_intelligence_technology')} -
-
- - {t('ghostery_dawn_onboarding_ad_free')} -
-
- - {t('ghostery_dawn_onboarding_supports_ghosterys_mission')} -
-
- - VPN -
-
- - {t('ghostery_dawn_onboarding_unlimited_bandwidth')} -
-
-
-
- {showCTAButton && ( - {t('ghostery_dawn_onboarding_upgrade')} - )} - - ); -}; - class ChoosePlanView extends React.Component { constructor(props) { super(props); @@ -274,7 +208,7 @@ class ChoosePlanView extends React.Component {
{showCTAButton && ( - setSetupStep({ setup_step: CHOOSE_PLAN, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 5, origin: ONBOARDING })}> {t('ghostery_dawn_onboarding_keep')} )} @@ -282,6 +216,74 @@ class ChoosePlanView extends React.Component { ); }; + premiumCard = (checked, handleClick, showCTAButton = false) => { + const { actions } = this.props; + const { setSetupStep } = actions; + const cardClassNames = ClassNames('ChoosePlanView__card premium', { + checked + }); + return ( + +
+
+
+ +
+
+
+
+
+

Ghostery Premium

+
+ +

$11.99

+

{t('per_month')}

+ +
+

{t('hub_upgrade_maximum_protection')}

+
+
+ + {t('ghostery_dawn_onboarding_private_search')} +
+
+ + {t('ghostery_dawn_onboarding_tracker_protection')} +
+
+ + {t('ghostery_dawn_onboarding_speedy_page_loads')} +
+
+ + {t('ghostery_dawn_onboarding_intelligence_technology')} +
+
+ + {t('ghostery_dawn_onboarding_ad_free')} +
+
+ + {t('ghostery_dawn_onboarding_supports_ghosterys_mission')} +
+
+ + VPN +
+
+ + {t('ghostery_dawn_onboarding_unlimited_bandwidth')} +
+
+
+
+ {showCTAButton && ( + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 6, origin: ONBOARDING })}>{t('ghostery_dawn_onboarding_upgrade')} + )} + + ); + }; + render() { const { actions, @@ -326,10 +328,10 @@ class ChoosePlanView extends React.Component { 2. DONE If user is signed out, clicking this should take them to Step 4b */} {loggedIn && ( - {t('ghostery_dawn_onboarding_start_trial')} + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 2, origin: ONBOARDING })}>{t('ghostery_dawn_onboarding_start_trial')} )} {!loggedIn && ( -
next()}>{t('ghostery_dawn_onboarding_start_trial')}
+
{ setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 2, origin: ONBOARDING }); next(); }}>{t('ghostery_dawn_onboarding_start_trial')}
)}
{t('ghostery_dawn_onboarding_see_all_plans')}
@@ -344,7 +346,7 @@ class ChoosePlanView extends React.Component {
{t('ghostery_dawn_onboarding_or')}
- {premiumCard(this.isPremiumPlanChecked(), this.selectPremiumPlan, isPlus)} + {this.premiumCard(this.isPremiumPlanChecked(), this.selectPremiumPlan, isPlus)}
) : ( @@ -357,7 +359,7 @@ class ChoosePlanView extends React.Component { {this.plusCard(this.isPlusPlanChecked(), this.selectPlusPlan)} )} - {premiumCard(this.isPremiumPlanChecked(), this.selectPremiumPlan)} + {this.premiumCard(this.isPremiumPlanChecked(), this.selectPremiumPlan)}
)} {(isBasic && ( @@ -368,15 +370,15 @@ class ChoosePlanView extends React.Component { )} {selectedPlan === PLUS && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 4, origin: ONBOARDING })} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 3, origin: ONBOARDING })} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )} {selectedPlan === PREMIUM && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 5, origin: ONBOARDING })} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 4, origin: ONBOARDING })} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )}
))} {isPremium && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 5, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 7, origin: ONBOARDING })}> {t('next')} )} From 2ae2f7de3e2b66ce8edf3450b8877a293c11c314 Mon Sep 17 00:00:00 2001 From: Ben Date: Wed, 27 Jan 2021 18:59:52 -0500 Subject: [PATCH 08/12] Move user to success screen if they get redirected to checkout-web in a new tab --- .../Step4_ChoosePlanView/ChoosePlanView.jsx | 15 ++++++++------- .../Step4_ChoosePlanView/index.jsx | 3 ++- 2 files changed, 10 insertions(+), 8 deletions(-) diff --git a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx index 6df7ea5d5..1c0be6fa4 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx @@ -217,7 +217,7 @@ class ChoosePlanView extends React.Component { }; premiumCard = (checked, handleClick, showCTAButton = false) => { - const { actions } = this.props; + const { actions, history } = this.props; const { setSetupStep } = actions; const cardClassNames = ClassNames('ChoosePlanView__card premium', { checked @@ -278,7 +278,7 @@ class ChoosePlanView extends React.Component {
{showCTAButton && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 6, origin: ONBOARDING })}>{t('ghostery_dawn_onboarding_upgrade')} + { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 6, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_upgrade')} )} ); @@ -289,7 +289,7 @@ class ChoosePlanView extends React.Component { actions, defaultSearch, loggedIn, - next, + history, user, } = this.props; const { setSetupStep } = actions; @@ -327,11 +327,12 @@ class ChoosePlanView extends React.Component { and move them to Step 5 if signed in 2. DONE If user is signed out, clicking this should take them to Step 4b */} + {/* May have to change the below links depending on GH-2248 */} {loggedIn && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 2, origin: ONBOARDING })}>{t('ghostery_dawn_onboarding_start_trial')} + { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 2, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_start_trial')} )} {!loggedIn && ( -
{ setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 2, origin: ONBOARDING }); next(); }}>{t('ghostery_dawn_onboarding_start_trial')}
+
{ setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 2, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_start_trial')}
)}
{t('ghostery_dawn_onboarding_see_all_plans')}
@@ -370,10 +371,10 @@ class ChoosePlanView extends React.Component { )} {selectedPlan === PLUS && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 3, origin: ONBOARDING })} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} + { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 3, origin: ONBOARDING }); history.push('/onboarding/5'); }} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )} {selectedPlan === PREMIUM && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 4, origin: ONBOARDING })} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} + { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 4, origin: ONBOARDING }); history.push('/onboarding/5'); }} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )}
))} diff --git a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/index.jsx b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/index.jsx index 535df2203..aae3575df 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/index.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/index.jsx @@ -11,6 +11,7 @@ * file, You can obtain one at http://mozilla.org/MPL/2.0 */ +import { withRouter } from 'react-router-dom'; import { buildReduxHOC } from '../../../../shared-hub/utils'; import ChoosePlanView from './ChoosePlanView'; import { setSetupStep } from '../../../../shared-hub/actions/SetupLifecycleActions'; @@ -19,4 +20,4 @@ const actionCreators = { setSetupStep, }; -export default buildReduxHOC(['account', 'defaultSearch'], actionCreators, ChoosePlanView); +export default withRouter(buildReduxHOC(['account', 'defaultSearch'], actionCreators, ChoosePlanView)); From 6db22fdf9ea6d37d3df73c4eee9edabad126e263 Mon Sep 17 00:00:00 2001 From: Ben Date: Thu, 28 Jan 2021 12:57:09 -0500 Subject: [PATCH 09/12] Add setupStep constants to Step 4 and update BlockSettingsView renderHelpers --- .../OnboardingView/OnboardingConstants.js | 13 +++++++++ .../BlockSettingsView.jsx | 6 ++-- .../ChooseDefaultSearchView.jsx | 7 ----- .../Step4_ChoosePlanView/ChoosePlanView.jsx | 28 +++++++++++++------ 4 files changed, 35 insertions(+), 19 deletions(-) diff --git a/app/dawn-hub/Views/OnboardingView/OnboardingConstants.js b/app/dawn-hub/Views/OnboardingView/OnboardingConstants.js index 1a74da084..71eb1e4cb 100644 --- a/app/dawn-hub/Views/OnboardingView/OnboardingConstants.js +++ b/app/dawn-hub/Views/OnboardingView/OnboardingConstants.js @@ -19,6 +19,19 @@ export const BLOCK_SETTINGS = '2'; export const CHOOSE_DEFAULT_SEARCH = '3'; export const CHOOSE_PLAN = '4'; export const SUCCESS = '5'; + +// Setup Step Constants + +// Step 1 export const SIGN_IN_SUCCESSFUL = '1'; export const CREATE_ACCOUNT_SUCCESSFUL = '2'; export const SKIP_ACCOUNT_CREATION = '3'; + +// Step 4 +export const FREE_USER_NO_TRIAL = '1'; +export const FREE_USER_PLUS_TRIAL = '2'; +export const FREE_USER_PLUS_SUBSCRIPTION = '3'; +export const FREE_USER_PREMIUM_SUBSCRIPTION = '4'; +export const PLUS_SUBSCRIBER_KEEP_SUBSCRIPTION = '5'; +export const PLUS_SUBSCRIBER_PREMIUM_SUBSCRIPTION = '6'; +export const PREMIUM_SUBSCRIBER_KEEP_SUBSCRIPTION = '7'; diff --git a/app/dawn-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx b/app/dawn-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx index 7337d0a37..4c52e42ce 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx @@ -181,9 +181,9 @@ class BlockSettingsView extends Component { - {this.renderAnswerBlock((kindsOfTrackers === 0), 'kindsOfTrackers', 0, t('ghostery_dawn_onboarding_kinds_of_trackers_all'))} - {this.renderAnswerBlock((kindsOfTrackers === 1), 'kindsOfTrackers', 1, t('ghostery_dawn_onboarding_kinds_of_trackers_ad_and_analytics'))} - {this.renderAnswerBlock((kindsOfTrackers === 2), 'kindsOfTrackers', 2, t('ghostery_dawn_onboarding_kinds_of_trackers_none'))} + {this.renderAnswerBlock((kindsOfTrackers === 1), 'kindsOfTrackers', 1, t('ghostery_dawn_onboarding_kinds_of_trackers_all'))} + {this.renderAnswerBlock((kindsOfTrackers === 2), 'kindsOfTrackers', 2, t('ghostery_dawn_onboarding_kinds_of_trackers_ad_and_analytics'))} + {this.renderAnswerBlock((kindsOfTrackers === 3), 'kindsOfTrackers', 3, t('ghostery_dawn_onboarding_kinds_of_trackers_none'))}
  • {t('ghostery_dawn_onboarding_question_anti_tracking')} diff --git a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx index 33219ce8b..09f3d8d52 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx @@ -145,13 +145,6 @@ class ChooseDefaultSearchView extends Component { console.error(error); } - // chrome.runtime.sendMessage('search@ghostery.com', payload, () => { - // // TODO handle errors if needed - // // TODO save user's search setting to redux / background if needed - // setSetupStep({ setup_step: CHOOSE_PLAN, origin: ONBOARDING }); - // history.push(`/${ONBOARDING}/${CHOOSE_PLAN}`); - // }); - setDefaultSearch(chosenSearchName); setSetupStep({ setup_step: CHOOSE_PLAN, diff --git a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx index 1c0be6fa4..881b656de 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx @@ -18,7 +18,17 @@ import PropTypes from 'prop-types'; import RadioButton from '../../../../shared-components/RadioButton'; import globals from '../../../../../src/classes/Globals'; import { BASIC, PLUS, PREMIUM } from '../../../../hub/Views/UpgradePlanView/UpgradePlanViewConstants'; -import { CHOOSE_PLAN, ONBOARDING } from '../../OnboardingView/OnboardingConstants'; +import { + CHOOSE_PLAN, + ONBOARDING, + FREE_USER_NO_TRIAL, + FREE_USER_PLUS_TRIAL, + FREE_USER_PLUS_SUBSCRIPTION, + FREE_USER_PREMIUM_SUBSCRIPTION, + PLUS_SUBSCRIBER_KEEP_SUBSCRIPTION, + PLUS_SUBSCRIBER_PREMIUM_SUBSCRIPTION, + PREMIUM_SUBSCRIBER_KEEP_SUBSCRIPTION +} from '../../OnboardingView/OnboardingConstants'; import { SEARCH_GHOSTERY } from '../Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants'; const plusCheckoutLink = `${globals.CHECKOUT_BASE_URL}/en/plus`; @@ -208,7 +218,7 @@ class ChoosePlanView extends React.Component {
    {showCTAButton && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 5, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: PLUS_SUBSCRIBER_KEEP_SUBSCRIPTION, origin: ONBOARDING })}> {t('ghostery_dawn_onboarding_keep')} )} @@ -278,7 +288,7 @@ class ChoosePlanView extends React.Component { {showCTAButton && ( - { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 6, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_upgrade')} + { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: PLUS_SUBSCRIBER_PREMIUM_SUBSCRIPTION, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_upgrade')} )} ); @@ -329,10 +339,10 @@ class ChoosePlanView extends React.Component { */} {/* May have to change the below links depending on GH-2248 */} {loggedIn && ( - { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 2, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_start_trial')} + { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_PLUS_TRIAL, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_start_trial')} )} {!loggedIn && ( -
    { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 2, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_start_trial')}
    +
    { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_PLUS_TRIAL, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_start_trial')}
    )}
    {t('ghostery_dawn_onboarding_see_all_plans')}
    @@ -366,20 +376,20 @@ class ChoosePlanView extends React.Component { {(isBasic && (
    {(selectedPlan === BASIC) && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 1, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_NO_TRIAL, origin: ONBOARDING })}> {t('next_or_start_trial')} )} {selectedPlan === PLUS && ( - { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 3, origin: ONBOARDING }); history.push('/onboarding/5'); }} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} + { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_PLUS_SUBSCRIPTION, origin: ONBOARDING }); history.push('/onboarding/5'); }} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )} {selectedPlan === PREMIUM && ( - { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 4, origin: ONBOARDING }); history.push('/onboarding/5'); }} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} + { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_PREMIUM_SUBSCRIPTION, origin: ONBOARDING }); history.push('/onboarding/5'); }} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )}
    ))} {isPremium && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: 7, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: PREMIUM_SUBSCRIBER_KEEP_SUBSCRIPTION, origin: ONBOARDING })}> {t('next')} )} From 8ec0ab76994cd40e6685c9a8d13a919e0eae09d0 Mon Sep 17 00:00:00 2001 From: Ben Date: Thu, 28 Jan 2021 13:12:31 -0500 Subject: [PATCH 10/12] One liner onClick handlers --- .../Step4_ChoosePlanView/ChoosePlanView.jsx | 18 +++++++++++------- 1 file changed, 11 insertions(+), 7 deletions(-) diff --git a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx index 881b656de..240832bc9 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx @@ -165,6 +165,12 @@ class ChoosePlanView extends React.Component { return t('ghostery_dawn_onboarding_choose_an_option'); }; + setSetupStepAndMoveToSuccessView = (setup_number) => { + const { setSetupStep, history } = this.props; + setSetupStep({ setup_step: CHOOSE_PLAN, setup_number, origin: ONBOARDING }); + history.push('/onboarding/5'); + } + plusCard = (checked, handleClick, showCTAButton = false) => { const { actions } = this.props; const { setSetupStep } = actions; @@ -227,8 +233,6 @@ class ChoosePlanView extends React.Component { }; premiumCard = (checked, handleClick, showCTAButton = false) => { - const { actions, history } = this.props; - const { setSetupStep } = actions; const cardClassNames = ClassNames('ChoosePlanView__card premium', { checked }); @@ -288,7 +292,7 @@ class ChoosePlanView extends React.Component {
    {showCTAButton && ( - { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: PLUS_SUBSCRIBER_PREMIUM_SUBSCRIPTION, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_upgrade')} + this.setSetupStepAndMoveToSuccessView(PLUS_SUBSCRIBER_PREMIUM_SUBSCRIPTION)}>{t('ghostery_dawn_onboarding_upgrade')} )} ); @@ -339,10 +343,10 @@ class ChoosePlanView extends React.Component { */} {/* May have to change the below links depending on GH-2248 */} {loggedIn && ( - { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_PLUS_TRIAL, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_start_trial')} + this.setSetupStepAndMoveToSuccessView(FREE_USER_PLUS_TRIAL)}>{t('ghostery_dawn_onboarding_start_trial')} )} {!loggedIn && ( -
    { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_PLUS_TRIAL, origin: ONBOARDING }); history.push('/onboarding/5'); }}>{t('ghostery_dawn_onboarding_start_trial')}
    +
    this.setSetupStepAndMoveToSuccessView(FREE_USER_PLUS_TRIAL)}>{t('ghostery_dawn_onboarding_start_trial')}
    )}
    {t('ghostery_dawn_onboarding_see_all_plans')}
    @@ -381,10 +385,10 @@ class ChoosePlanView extends React.Component { )} {selectedPlan === PLUS && ( - { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_PLUS_SUBSCRIPTION, origin: ONBOARDING }); history.push('/onboarding/5'); }} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} + this.setSetupStepAndMoveToSuccessView(FREE_USER_PLUS_SUBSCRIPTION)} href={plusCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )} {selectedPlan === PREMIUM && ( - { setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_PREMIUM_SUBSCRIPTION, origin: ONBOARDING }); history.push('/onboarding/5'); }} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} + this.setSetupStepAndMoveToSuccessView(FREE_USER_PREMIUM_SUBSCRIPTION)} href={premiumCheckoutLink} target="_blank" rel="noreferrer">{t('next_or_start_trial')} )}
    ))} From 623fc0c45fe428f2f8f988a3b3568dba88121870 Mon Sep 17 00:00:00 2001 From: Ben Date: Thu, 28 Jan 2021 18:11:24 -0500 Subject: [PATCH 11/12] Change setup_number to dawn_setup_number --- .../Step1_CreateAccountView.jsx | 6 +++--- .../BlockSettingsView.jsx | 3 +-- .../ChooseDefaultSearchView.jsx | 2 +- .../Step4_ChoosePlanView/ChoosePlanView.jsx | 10 +++++----- src/background.js | 2 +- src/classes/ConfData.js | 1 + src/classes/Metrics.js | 16 ++++++++++++++-- 7 files changed, 26 insertions(+), 14 deletions(-) diff --git a/app/dawn-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx b/app/dawn-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx index 67e51da0e..2d8374ef9 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx @@ -65,10 +65,10 @@ const Step1_CreateAccountView = (props) => { const [view, setView] = useState(CREATE_ACCOUNT); - const handleSkipButton = (setup_number) => { + const handleSkipButton = (dawn_setup_number) => { setSetupStep({ setup_step: LOGIN, - setup_number, + dawn_setup_number, origin: ONBOARDING, }); setToast({ @@ -82,7 +82,7 @@ const Step1_CreateAccountView = (props) => { setSetupStep({ setup_step: LOGIN, - setup_number: CREATE_ACCOUNT_SUCCESSFUL, + dawn_setup_number: CREATE_ACCOUNT_SUCCESSFUL, origin: ONBOARDING, }); diff --git a/app/dawn-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx b/app/dawn-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx index 4c52e42ce..b5a9c498d 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx @@ -117,10 +117,9 @@ class BlockSettingsView extends Component { break; } setBlockingPolicy({ blockingPolicy }); - setSetupStep({ setup_step: CHOOSE_DEFAULT_SEARCH, - setup_number: this.buildSetupNumberString(), + dawn_setup_number: this.buildSetupNumberString(), origin: ONBOARDING }); history.push('/onboarding/3'); diff --git a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx index 444928a70..5ad0aef03 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx @@ -148,7 +148,7 @@ class ChooseDefaultSearchView extends Component { setDefaultSearch(chosenSearchName); setSetupStep({ setup_step: CHOOSE_PLAN, - setup_number: mapSearchToSetupNumber[chosenSearchName], + dawn_setup_number: mapSearchToSetupNumber[chosenSearchName], origin: ONBOARDING }); history.push(`/${ONBOARDING}/${CHOOSE_PLAN}`); diff --git a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx index 240832bc9..82cf2ae44 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx @@ -165,9 +165,9 @@ class ChoosePlanView extends React.Component { return t('ghostery_dawn_onboarding_choose_an_option'); }; - setSetupStepAndMoveToSuccessView = (setup_number) => { + setSetupStepAndMoveToSuccessView = (dawn_setup_number) => { const { setSetupStep, history } = this.props; - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number, origin: ONBOARDING }); + setSetupStep({ setup_step: CHOOSE_PLAN, dawn_setup_number, origin: ONBOARDING }); history.push('/onboarding/5'); } @@ -224,7 +224,7 @@ class ChoosePlanView extends React.Component { {showCTAButton && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: PLUS_SUBSCRIBER_KEEP_SUBSCRIPTION, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, dawn_setup_number: PLUS_SUBSCRIBER_KEEP_SUBSCRIPTION, origin: ONBOARDING })}> {t('ghostery_dawn_onboarding_keep')} )} @@ -380,7 +380,7 @@ class ChoosePlanView extends React.Component { {(isBasic && (
    {(selectedPlan === BASIC) && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: FREE_USER_NO_TRIAL, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, dawn_setup_number: FREE_USER_NO_TRIAL, origin: ONBOARDING })}> {t('next_or_start_trial')} )} @@ -393,7 +393,7 @@ class ChoosePlanView extends React.Component {
    ))} {isPremium && ( - setSetupStep({ setup_step: CHOOSE_PLAN, setup_number: PREMIUM_SUBSCRIBER_KEEP_SUBSCRIPTION, origin: ONBOARDING })}> + setSetupStep({ setup_step: CHOOSE_PLAN, dawn_setup_number: PREMIUM_SUBSCRIBER_KEEP_SUBSCRIPTION, origin: ONBOARDING })}> {t('next')} )} diff --git a/src/background.js b/src/background.js index 5d7547f1b..f49416e1d 100644 --- a/src/background.js +++ b/src/background.js @@ -524,7 +524,7 @@ function handleGhosteryHub(name, message, callback) { const origin = message.origin || ''; if (origin === 'onboarding') { conf.setup_step = message.setup_step; - conf.setup_number = message.setup_number; + conf.dawn_setup_number = message.dawn_setup_number; metrics.ping('gb_onboarding'); } callback({ setup_step }); diff --git a/src/classes/ConfData.js b/src/classes/ConfData.js index 1136261e3..c12bc6bd7 100644 --- a/src/classes/ConfData.js +++ b/src/classes/ConfData.js @@ -146,6 +146,7 @@ class ConfData { _initProperty('setup_step', 7); _initProperty('setup_show_warning_override', true); _initProperty('setup_number', 0); + _initProperty('dawn_setup_number', '0'); _initProperty('setup_block', 1); _initProperty('setup_complete', false); _initProperty('tutorial_complete', false); diff --git a/src/classes/Metrics.js b/src/classes/Metrics.js index c2ada585c..2f2598f55 100644 --- a/src/classes/Metrics.js +++ b/src/classes/Metrics.js @@ -292,8 +292,8 @@ class Metrics { this._buildQueryPair('at', conf.enable_anti_tracking ? '1' : '0') + // The deepest setup page reached by user during setup this._buildQueryPair('ss', Metrics._getSetupStep(type).toString()) + - // The number of times the user has gone through setup - this._buildQueryPair('sl', conf.setup_number.toString()) + + // The number of times the user has gone through setup in the regular hub, or the answer selection on each page of the dawn-hub + this._buildQueryPair('sl', Metrics._getSetupNumber(type).toString()) + // Type of blocking selected during setup this._buildQueryPair('sb', conf.setup_block.toString()) + // Recency, days since last active daily ping @@ -414,6 +414,18 @@ class Metrics { return -1; } + /** + * Get the Setup Number + * + * @private + * + * @return {number} The number of times the user has gone through setup in the regular hub, or the answer selection on each page of the dawn-hub + */ + static _getSetupNumber(type) { + const { setup_number, dawn_setup_number } = conf; + return (type === 'gb_onboarding') ? dawn_setup_number : setup_number; + } + /** * Calculate days since the last daily active ping. * From 9ecaf06a7f845382b5a0765eddf5a9204808bf0a Mon Sep 17 00:00:00 2001 From: Ben Date: Thu, 28 Jan 2021 19:59:34 -0500 Subject: [PATCH 12/12] Add list of possible search engines, minus SEARCH_ENCRYPT and update dawn_setup_numbers --- .../ChooseDefaultSearchConstants.js | 12 ++--- .../ChooseDefaultSearchView.jsx | 45 ++++++++++++------- .../Step4_ChoosePlanView/ChoosePlanView.jsx | 3 +- 3 files changed, 36 insertions(+), 24 deletions(-) diff --git a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants.js b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants.js index db54563e1..29a6ad199 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants.js +++ b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchConstants.js @@ -15,15 +15,15 @@ export const SET_DEFAULT_SEARCH = 'SET_DEFAULT_SEARCH'; export const SEARCH_GHOSTERY = 'Ghostery'; export const SEARCH_BING = 'Bing'; export const SEARCH_YAHOO = 'Yahoo'; -export const SEARCH_STARTPAGE = 'Startpage'; -export const SEARCH_DUCKDUCK_GO = 'DuckDuck Go'; -export const SEARCH_ECOSIA = 'Ecosia'; -export const SEARCH_EKORU = 'Ekoru'; -export const SEARCH_GIBIRU = 'Gibiru'; +export const SEARCH_STARTPAGE = 'StartPage'; +export const SEARCH_DUCKDUCK_GO = 'DuckDuckGo'; +export const SEARCH_ECOSIA = 'Ecosia Search'; +export const SEARCH_EKORU = 'ekoru'; +export const SEARCH_GIBIRU = 'Gibiru.com'; export const SEARCH_GOOGLE = 'Google'; export const SEARCH_ONESEARCH = 'OneSearch'; export const SEARCH_PRIVADO = 'Privado'; export const SEARCH_QWANT = 'Qwant'; -export const SEARCH_ENCRYPT = 'Search Encrypt'; +export const SEARCH_ENCRYPT = 'TODO: Add Search Encrypt browser.search.get() string'; export const SEARCH_TAILCAT = 'Tailcat'; export const SEARCH_OTHER = t('ghostery_dawn_onboarding_other'); diff --git a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx index 5ad0aef03..d03be3975 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step3_ChooseDefaultSearchView/ChooseDefaultSearchView.jsx @@ -21,26 +21,36 @@ import { SEARCH_BING, SEARCH_YAHOO, SEARCH_STARTPAGE, + SEARCH_DUCKDUCK_GO, + SEARCH_ECOSIA, + SEARCH_EKORU, + SEARCH_GIBIRU, + SEARCH_GOOGLE, + SEARCH_ONESEARCH, + SEARCH_PRIVADO, + SEARCH_QWANT, + SEARCH_ENCRYPT, + SEARCH_TAILCAT, SEARCH_OTHER } from './ChooseDefaultSearchConstants'; import { Modal } from '../../../../shared-components'; -const mapSearchToSetupNumber = { - Ghostery: 1, - Bing: 2, - Yahoo: 3, - Startpage: 4, - 'DuckDuck Go': 6, - Ecosia: 7, - Ekoru: 8, - Gibiru: 9, - Google: 10, - OneSearch: 11, - Privado: 12, - Qwant: 13, - 'Search Encrypt': 14, - Tailcat: 15, -}; +const searchSetupNumbers = [ + { name: SEARCH_GHOSTERY, dawn_setup_number: 1 }, + { name: SEARCH_BING, dawn_setup_number: 2 }, + { name: SEARCH_YAHOO, dawn_setup_number: 3 }, + { name: SEARCH_STARTPAGE, dawn_setup_number: 4 }, + { name: SEARCH_GOOGLE, dawn_setup_number: 5 }, + { name: SEARCH_DUCKDUCK_GO, dawn_setup_number: 6 }, + { name: SEARCH_ECOSIA, dawn_setup_number: 7 }, + { name: SEARCH_EKORU, dawn_setup_number: 8 }, + { name: SEARCH_GIBIRU, dawn_setup_number: 9 }, + { name: SEARCH_ONESEARCH, dawn_setup_number: 10 }, + { name: SEARCH_PRIVADO, dawn_setup_number: 11 }, + { name: SEARCH_QWANT, dawn_setup_number: 12 }, + { name: SEARCH_ENCRYPT, dawn_setup_number: 13 }, + { name: SEARCH_TAILCAT, dawn_setup_number: 14 }, +]; class ChooseDefaultSearchView extends Component { constructor(props) { @@ -146,9 +156,10 @@ class ChooseDefaultSearchView extends Component { } setDefaultSearch(chosenSearchName); + setSetupStep({ setup_step: CHOOSE_PLAN, - dawn_setup_number: mapSearchToSetupNumber[chosenSearchName], + dawn_setup_number: searchSetupNumbers.find(elem => elem.name === chosenSearchName).dawn_setup_number, origin: ONBOARDING }); history.push(`/${ONBOARDING}/${CHOOSE_PLAN}`); diff --git a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx index 82cf2ae44..ef30f888c 100644 --- a/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx +++ b/app/dawn-hub/Views/OnboardingViews/Step4_ChoosePlanView/ChoosePlanView.jsx @@ -166,7 +166,8 @@ class ChoosePlanView extends React.Component { }; setSetupStepAndMoveToSuccessView = (dawn_setup_number) => { - const { setSetupStep, history } = this.props; + const { actions, history } = this.props; + const { setSetupStep } = actions; setSetupStep({ setup_step: CHOOSE_PLAN, dawn_setup_number, origin: ONBOARDING }); history.push('/onboarding/5'); }