Skip to content

/ ghostery-extension

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Ghostery Dawn Miscellaneous Bug fixes #664

Merged
merged 7 commits into from Jan 22, 2021
+219 −116
Merged

Ghostery Dawn Miscellaneous Bug fixes #664

Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
6e4040b
Bold numbers in step progress bar
benstrumeyer Jan 22, 2021
7beccd5
Align BlockSettingsView checkbox per vinny, add click handler to chec…
benstrumeyer Jan 22, 2021
46b3d42
Restore already have account and create an account, also get rid of c…
benstrumeyer Jan 22, 2021
2a32674
Close tab when clicking CTA button on Success View
benstrumeyer Jan 22, 2021
b857a1b
Fix terms and agreements label position on Create Account Form
benstrumeyer Jan 22, 2021
3f5fd2b
Update snapshots
benstrumeyer Jan 22, 2021
0ae3d86
Clear toasts when clicking skip button
benstrumeyer Jan 22, 2021
File filter
Filter file types
Jump to
Jump to file
Failed to load files.

Always

Just for now

6 ...Views/OnboardingViews/Step0_WelcomeView/__tests__/__snapshots__/WelcomeView.test.jsx.snap
View file
Open in desktop
@@ -7,12 +7,12 @@ exports[`app/ghostery-browser-hub/Views/OnboardingViews/Step0_WelcomeView/Welcom
<div
className="WelcomeView__title"
>
ghostery_browser_hub_onboarding_welcome
ghostery_dawn_onboarding_welcome
</div>
<div
className="WelcomeView__subtitle"
>
ghostery_browser_hub_onboarding_lets_begin
ghostery_dawn_onboarding_lets_begin
</div>
<img
className="WelcomeView__rocketShip"
@@ -25,7 +25,7 @@ exports[`app/ghostery-browser-hub/Views/OnboardingViews/Step0_WelcomeView/Welcom
onClick={[Function]}
>
<span>
ghostery_browser_hub_onboarding_lets_do_this
ghostery_dawn_onboarding_lets_do_this
</span>
</a>
</div>
5 ...ery-browser-hub/Views/OnboardingViews/Step1_CreateAccountForm/Step1_CreateAccountForm.jsx
View file
Open in desktop
@@ -188,8 +188,8 @@ export const Step1_CreateAccountForm = (props) => {
)}
</div>
</div>
<div className="row align-center-middle">
<div className="columns small-10 medium-8">
<div className="row">
<div className="columns small-12 medium-10">
<div className="Step1_CreateAccountForm__checkboxContainer BrowserCreateAccountForm--marginBottom flex-container">
<ToggleCheckbox
name="globals"
@@ -204,7 +204,6 @@ export const Step1_CreateAccountForm = (props) => {
/>
</div>
</div>
<div className="columns small-10 medium-2" />
</div>
<div className="Step1_CreateAccountForm__ctaButtonContainer">
<button type="submit" className="Step1_CreateAccountForm__ctaButton">{t('create_account')}</button>
3 ...ry-browser-hub/Views/OnboardingViews/Step1_CreateAccountForm/Step1_CreateAccountForm.scss
View file
Open in desktop
@@ -53,8 +53,9 @@
}
.Step1_CreateAccountForm__legalConsentCheckedLabel {
font-size: 14px;
margin-top: 13px;
@include breakpoint(small down) {
width: 258px;
width: 290px;
}

&.error {
32 ...ews/Step1_CreateAccountForm/__tests__/__snapshots__/Step1_CreateAccountForm.test.jsx.snap
View file
Open in desktop
@@ -140,35 +140,10 @@ exports[`app/hub/Views/Step1_CreateAccountForm component Snapshot tests with rea
</div>
</div>
<div
className="row align-center-middle"
className="row"
>
<div
className="columns small-10 medium-8"
>
<div
className="Step1_CreateAccountForm__checkboxContainer Step1_CreateAccountForm--marginBottom flex-container"
>
<div />
<span
className="Step1_CreateAccountForm__promoString"
dangerouslySetInnerHTML={
Object {
"__html": "ghostery_browser_hub_onboarding_send_me Ghostery ghostery_browser_hub_onboarding_updates_and_promotions",
}
}
onClick={[Function]}
/>
</div>
</div>
<div
className="columns small-10 medium-2"
/>
</div>
<div
className="row align-center-middle"
>
<div
className="columns small-10 medium-8"
className="columns small-12 medium-10"
>
<div
className="Step1_CreateAccountForm__checkboxContainer BrowserCreateAccountForm--marginBottom flex-container"
@@ -185,9 +160,6 @@ exports[`app/hub/Views/Step1_CreateAccountForm component Snapshot tests with rea
/>
</div>
</div>
<div
className="columns small-10 medium-2"
/>
</div>
<div
className="Step1_CreateAccountForm__ctaButtonContainer"
20 ...ery-browser-hub/Views/OnboardingViews/Step1_CreateAccountView/Step1_CreateAccountView.jsx
View file
Open in desktop
@@ -36,7 +36,7 @@ const faqList = [
];

const renderFAQListItem = (icon, label, description) => (
<div className="Step1_CreateAccountView__faqItemContainer row">
<div key={label} className="Step1_CreateAccountView__faqItemContainer row">
<div className="Step1_CreateAccountView__faqIconContainer columns small-12 medium-10 large-2">
<img className="Step1_CreateAccountView__faqIcon" src={`/app/images/hub/browser-create-account-view/${icon}`} />
</div>
@@ -54,16 +54,24 @@ const renderFAQListItem = (icon, label, description) => (
*/
const Step1_CreateAccountView = (props) => {
const { user, actions } = props;
const { setSetupStep } = actions;
const { setSetupStep, setToast } = actions;
const email = user && user.email;

const [view, setView] = useState(CREATE_ACCOUNT);

const handleSkipButton = () => {
setSetupStep({ setup_step: LOGIN, origin: ONBOARDING });
setToast({
toastMessage: '',
toastClass: ''
});
};

const renderSkipLink = () => (
<div className="row align-center-middle">
<div className="columns small-10 medium-6" />
<div className="columns small-10 medium-6">
<NavLink className="Step1_CreateAccountView__skip" to="/onboarding/2" onClick={() => setSetupStep({ setup_step: LOGIN, origin: ONBOARDING })}>
<NavLink className="Step1_CreateAccountView__skip" to="/onboarding/2" onClick={() => handleSkipButton()}>
<span>{t('ghostery_dawn_onboarding_skip')}</span>
</NavLink>
</div>
@@ -75,7 +83,7 @@ const Step1_CreateAccountView = (props) => {
<div className="Step1_CreateAccountView__title">{t('ghostery_dawn_onboarding_you_are_signed_in_as')}</div>
<div className="Step1_CreateAccountView__email">{email}</div>
<div className="Step1_CreateAccountView__ctaButtonContainer">
<NavLink className="Step1_CreateAccountView__ctaButton" to="/onboarding/2" onClick={() => setSetupStep({ setup_step: LOGIN, origin: ONBOARDING })}>
<NavLink className="Step1_CreateAccountView__ctaButton" to="/onboarding/2" onClick={() => handleSkipButton()}>
<span>{t('next')}</span>
</NavLink>
</div>
@@ -91,10 +99,10 @@ const Step1_CreateAccountView = (props) => {
<div className="Step1_CreateAccountView__subtitle">{ t('ghostery_dawn_onboarding_sync_settings') }</div>
<div className="row align-center-middle">
{view === CREATE_ACCOUNT && (
<div className="Step1_CreateAccountView__alreadyHaveAccount columns small-12" onClick={() => setView(SIGN_IN)}>{t('ghostery_browser_hub_onboarding_already_have_account')}</div>
<div className="Step1_CreateAccountView__alreadyHaveAccount columns small-12" onClick={() => setView(SIGN_IN)}>{t('ghostery_dawn_onboarding_already_have_account')}</div>
)}
{view === SIGN_IN && (
<div className="Step1_CreateAccountView__alreadyHaveAccount columns small-12" onClick={() => setView(CREATE_ACCOUNT)}>{t('ghostery_browser_hub_onboarding_create_an_account')}</div>
<div className="Step1_CreateAccountView__alreadyHaveAccount columns small-12" onClick={() => setView(CREATE_ACCOUNT)}>{t('ghostery_dawn_onboarding_create_an_account')}</div>
)}
</div>
{view === CREATE_ACCOUNT ? (
84 ...ews/Step1_CreateAccountView/__tests__/__snapshots__/Step1_CreateAccountView.test.jsx.snap
View file
Open in desktop
@@ -7,25 +7,22 @@ exports[`app/hub/Views/Step1_CreateAccountView component Snapshot tests with rea
<div
className="Step1_CreateAccountView__title"
>
ghostery_browser_hub_onboarding_create_a_ghostery_account
ghostery_dawn_onboarding_create_a_ghostery_account
</div>
<div
className="Step1_CreateAccountView__subtitle"
>
ghostery_browser_hub_onboarding_sync_settings
ghostery_dawn_onboarding_sync_settings
</div>
<div
className="row align-center-middle"
>
<div
className="Step1_CreateAccountView__alreadyHaveAccount columns small-12 medium-6"
className="Step1_CreateAccountView__alreadyHaveAccount columns small-12"
onClick={[Function]}
>
ghostery_browser_hub_onboarding_already_have_account
ghostery_dawn_onboarding_already_have_account
</div>
<div
className="Step1_CreateAccountView__alreadyHaveAccount columns small-12 medium-6"
/>
</div>
<div />
<div
@@ -44,27 +41,78 @@ exports[`app/hub/Views/Step1_CreateAccountView component Snapshot tests with rea
onClick={[Function]}
>
<span>
ghostery_browser_hub_onboarding_skip
ghostery_dawn_onboarding_skip
</span>
</a>
</div>
</div>
<div
className="Step1_CreateAccountView__learnMoreContainer"
onClick={[Function]}
className="Step1_CreateAccountView__FAQContainer"
>
<div
className="Step1_CreateAccountView__learnMore"
className="Step1_CreateAccountView__faqItemContainer row"
>
ghostery_browser_hub_onboarding_we_take_your_privacy_very_seriously
<div
className="Step1_CreateAccountView__faqIconContainer columns small-12 medium-10 large-2"
>
<img
className="Step1_CreateAccountView__faqIcon"
src="/app/images/hub/browser-create-account-view/ghosty-shield.svg"
/>
</div>
<div
className="Step1_CreateAccountView__faqItemTextContainer columns small-12 medium-10 large-10"
>
<div
className="Step1_CreateAccountView__faqItemLabel"
>
ghostery_dawn_onboarding_private_by_design
</div>
<div
className="Step1_CreateAccountView__faqItemDescription"
>
ghostery_dawn_onboarding_private_by_design_description
</div>
</div>
</div>
<div
className="Step1_CreateAccountView__faqItemContainer row"
>
<div
className="Step1_CreateAccountView__faqIconContainer columns small-12 medium-10 large-2"
>
<img
className="Step1_CreateAccountView__faqIcon"
src="/app/images/hub/browser-create-account-view/ghosty-box.svg"
/>
</div>
<div
className="Step1_CreateAccountView__faqItemTextContainer columns small-12 medium-10 large-10"
>
<div
className="Step1_CreateAccountView__faqItemLabel"
>
ghostery_dawn_onboarding_can_i_remove_my_account
</div>
<div
className="Step1_CreateAccountView__faqItemDescription"
>
ghostery_dawn_onboarding_can_i_remove_my_account_description
</div>
</div>
</div>
</div>
<div
className="Step1_CreateAccountView__arrow down"
onClick={[Function]}
/>
<div
className="Step1_CreateAccountView__FAQContainer"
/>
className="row"
>
<a
className="Step1_CreateAccountView__privacyPolicyLink columns small-12 medium-10 medium-offset-1 large-8 large-offset-3"
href="https://ghosterystage.com/about-ghostery/ghostery-plans-and-products-privacy-policy/"
rel="noreferrer"
target="_blank"
>
ghostery_dawn_onboarding_visit_our_privacy_policy
</a>
</div>
</div>
`;
2 app/ghostery-browser-hub/Views/OnboardingViews/Step1_CreateAccountView/index.js
View file
Open in desktop
@@ -14,9 +14,11 @@
import { buildReduxHOC } from '../../../../shared-hub/utils';
import Step1_CreateAccountView from './Step1_CreateAccountView';
import { setSetupStep } from '../../../../shared-hub/actions/SetupLifecycleActions';
import setToast from '../../../../shared-hub/actions/ToastActions';

const actionCreators = {
setSetupStep,
setToast
};

export default buildReduxHOC(['account'], actionCreators, Step1_CreateAccountView);
2 app/ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.jsx
View file
Open in desktop
@@ -137,7 +137,7 @@ class BlockSettingsView extends Component {
checked={recommendedChoices}
onChange={() => this.toggleRecommendedChoices(!recommendedChoices)}
/>
<div>{t('ghostery_dawn_onboarding_recommended_choices')}</div>
<div className="BlockSettingsView_checkboxLabel" onClick={() => this.toggleRecommendedChoices(!recommendedChoices)}>{t('ghostery_dawn_onboarding_recommended_choices')}</div>
</div>
<ol>
<li className="BlockSettingsView_question">{t('ghostery_dawn_onboarding_question_block_ads')}</li>
6 ...ghostery-browser-hub/Views/OnboardingViews/Step2_BlockSettingsView/BlockSettingsView.scss
View file
Open in desktop
@@ -128,7 +128,11 @@
width: 20px;
height: 20px;
padding: 0;
margin-right: 14px;
margin-left: -14px;
}

.BlockSettingsView_checkboxLabel {
cursor: pointer;
}

.BlockSettingsView__infoIcon {
ProTip! Use n and p to navigate between commits in a pull request.