feat: Reject All GDPR (#2423)

* feat: Reject All GDPR

* chore: removal of loading

projects/Mallard/src/components/Spacer/Spacer.tsx

@@ -0,0 +1,13 @@
+import React from 'react';
+import { StyleSheet, View } from 'react-native';
+
+const styles = (unit: number) =>
+	StyleSheet.create({
+		spacer: {
+			marginRight: unit,
+			marginTop: unit,
+		},
+	});
+export const Spacer = ({ unit = 8 }: { unit?: number }) => (
+	<View style={styles(unit).spacer} />
+);

projects/Mallard/src/components/Spacer/__tests__/Spacer.spec.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import TestRenderer from 'react-test-renderer';
+import { Spacer } from '../Spacer';
+
+describe('<Spacer />', () => {
+	it('should render with default props', () => {
+		const wrapper = TestRenderer.create(<Spacer />).toJSON();
+		expect(wrapper).toMatchSnapshot();
+	});
+
+	it('should render with given props', () => {
+		const wrapper = TestRenderer.create(<Spacer unit={30} />).toJSON();
+		expect(wrapper).toMatchSnapshot();
+	});
+});

projects/Mallard/src/components/Spacer/__tests__/__snapshots__/Spacer.spec.tsx.snap

@@ -0,0 +1,23 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Spacer /> should render with default props 1`] = `
+<View
+  style={
+    {
+      "marginRight": 8,
+      "marginTop": 8,
+    }
+  }
+/>
+`;
+
+exports[`<Spacer /> should render with given props 1`] = `
+<View
+  style={
+    {
+      "marginRight": 30,
+      "marginTop": 30,
+    }
+  }
+/>
+`;

projects/Mallard/src/helpers/words.ts

@@ -246,16 +246,23 @@ const externalSubscription = {
 	cancel: 'Cancel',
 };
 
+const enableAll = 'Enable all';
+const rejectAll = 'Reject all';
+const andContinue = 'and continue';
+
 export const copy = {
 	alreadySubscribed,
+	andContinue,
 	authSwitcherScreen,
 	consentOnboarding,
+	enableAll,
 	externalSubscription,
 	failedSignIn,
 	homeScreen,
 	issueListFooter,
 	manageDownloads,
 	newEditionWords,
+	rejectAll,
 	settings,
 	signIn,
 	subFound,

projects/Mallard/src/hooks/use-gdpr.tsx

@@ -43,15 +43,13 @@ export enum OnboardingStatus {
 }
 
 interface GdprSettings extends GdprCoreSettings {
-	gdprAllowGoogleLogin: GdprSwitchSetting;
-	gdprAllowAppleLogin: GdprSwitchSetting;
 	setGdprFunctionalityBucket: (setting: GdprSwitchSetting) => void;
 	setGdprPerformanceBucket: (setting: GdprSwitchSetting) => void;
 	enableAllSettings: () => void;
+	rejectAllSettings: () => void;
 	resetAllSettings: () => void;
 	hasSetGdpr: () => OnboardingStatus;
 	isCorrectConsentVersion: () => boolean;
-	loading: boolean;
 }
 
 export type GdprSwitches = {
@@ -64,15 +62,13 @@ const defaultState: GdprSettings = {
 	gdprAllowPerformance: null,
 	gdprAllowFunctionality: null,
 	gdprConsentVersion: null,
-	gdprAllowGoogleLogin: null,
-	gdprAllowAppleLogin: null,
 	setGdprFunctionalityBucket: () => {},
 	setGdprPerformanceBucket: () => {},
 	enableAllSettings: () => {},
+	rejectAllSettings: () => {},
 	resetAllSettings: () => {},
 	hasSetGdpr: () => OnboardingStatus.Unknown,
 	isCorrectConsentVersion: () => false,
-	loading: true,
 };
 
 const GDPRContext = createContext<GdprSettings>(defaultState);
@@ -87,12 +83,6 @@ export const GDPRProvider = ({ children }: { children: React.ReactNode }) => {
 	const [gdprConsentVersion, setGdprConsentVersion] = useState<
 		GdprSettings['gdprConsentVersion']
 	>(defaultState.gdprConsentVersion);
-	const [gdprAllowGoogleLogin, setGdprAllowGoogleLogin] = useState<
-		GdprSettings['gdprAllowGoogleLogin']
-	>(defaultState.gdprAllowGoogleLogin);
-	const [gdprAllowAppleLogin, setGdprAllowAppleLogin] = useState<
-		GdprSettings['gdprAllowAppleLogin']
-	>(defaultState.gdprAllowAppleLogin);
 
 	const [loading, setLoading] = useState<boolean>(true);
 
@@ -153,8 +143,6 @@ export const GDPRProvider = ({ children }: { children: React.ReactNode }) => {
 	const setGdprFunctionalityBucket = (setting: GdprSwitchSetting) => {
 		// Local state modifier
 		setGdprAllowFunctionality(setting);
-		setGdprAllowGoogleLogin(setting);
-		setGdprAllowAppleLogin(setting);
 		setGdprConsentVersion(CURRENT_CONSENT_VERSION);
 		// Persisted state modifier
 		setting === null
@@ -163,26 +151,26 @@ export const GDPRProvider = ({ children }: { children: React.ReactNode }) => {
 		gdprConsentVersionCache.set(CURRENT_CONSENT_VERSION);
 	};
 
-	const enableAllSettings = () => {
+	const allSettings = (modifier: boolean) => {
 		// Local state modifier
-		setGdprAllowPerformance(true);
-		setGdprAllowFunctionality(true);
+		setGdprAllowPerformance(modifier);
+		setGdprAllowFunctionality(modifier);
 		setGdprConsentVersion(CURRENT_CONSENT_VERSION);
-		setGdprAllowGoogleLogin(true);
-		setGdprAllowAppleLogin(true);
 		// Persisted state modifier
-		gdprAllowPerformanceCache.set(true);
-		gdprAllowFunctionalityCache.set(true);
+		gdprAllowPerformanceCache.set(modifier);
+		gdprAllowFunctionalityCache.set(modifier);
 		gdprConsentVersionCache.set(CURRENT_CONSENT_VERSION);
 	};
 
+	const enableAllSettings = () => allSettings(true);
+
+	const rejectAllSettings = () => allSettings(false);
+
 	const resetAllSettings = () => {
 		// Local state modifier
 		setGdprAllowPerformance(defaultState.gdprAllowPerformance);
 		setGdprAllowFunctionality(defaultState.gdprAllowFunctionality);
 		setGdprConsentVersion(defaultState.gdprConsentVersion);
-		setGdprAllowGoogleLogin(defaultState.gdprAllowGoogleLogin);
-		setGdprAllowAppleLogin(defaultState.gdprAllowAppleLogin);
 		// Persisted state modifier
 		gdprAllowPerformanceCache.reset();
 		gdprAllowFunctionalityCache.reset();
@@ -202,13 +190,10 @@ export const GDPRProvider = ({ children }: { children: React.ReactNode }) => {
 				setGdprFunctionalityBucket,
 				setGdprPerformanceBucket,
 				enableAllSettings,
+				rejectAllSettings,
 				resetAllSettings,
 				hasSetGdpr,
 				isCorrectConsentVersion,
-				// The following are not used anywhere as things stand and are therefore not persisted
-				gdprAllowGoogleLogin,
-				gdprAllowAppleLogin,
-				loading,
 			}}
 		>
 			{children}

projects/Mallard/src/screens/settings/gdpr-consent-screen.tsx

@@ -9,9 +9,11 @@ import type { ThreeWaySwitchValue } from 'src/components/layout/ui/switch';
 import { ThreeWaySwitch } from 'src/components/layout/ui/switch';
 import { LinkNav } from 'src/components/link';
 import { LoginHeader } from 'src/components/login/login-layout';
+import { Spacer } from 'src/components/Spacer/Spacer';
 import { UiBodyCopy } from 'src/components/styled-text';
 import { logEvent } from 'src/helpers/analytics';
 import {
+	copy,
 	PREFS_SAVED_MSG,
 	PRIVACY_SETTINGS_HEADER_TITLE,
 } from 'src/helpers/words';
@@ -41,10 +43,10 @@ const essentials: EssentialGdprSwitch = {
 
 const GdprConsent = ({
 	shouldShowDismissableHeader = false,
-	continueText,
+	withContinue = false,
 }: {
 	shouldShowDismissableHeader?: boolean;
-	continueText: string;
+	withContinue?: boolean;
 }) => {
 	const navigation =
 		useNavigation<NativeStackNavigationProp<MainStackParamList>>();
@@ -56,6 +58,7 @@ const GdprConsent = ({
 
 	const {
 		enableAllSettings,
+		rejectAllSettings,
 		resetAllSettings,
 		gdprAllowPerformance,
 		gdprAllowFunctionality,
@@ -86,10 +89,24 @@ const GdprConsent = ({
 
 	const onEnableAllAndContinue = () => {
 		enableAllSettings();
-		navigation.navigate(RouteNames.Issue);
 		showToast(PREFS_SAVED_MSG);
+		withContinue && navigation.navigate(RouteNames.Issue);
 	};
 
+	const onRejectAllAndContinue = () => {
+		rejectAllSettings();
+		showToast(PREFS_SAVED_MSG);
+		withContinue && navigation.navigate(RouteNames.Issue);
+	};
+
+	const continueText = withContinue
+		? `${copy.enableAll} ${copy.andContinue}`
+		: copy.enableAll;
+
+	const rejectText = withContinue
+		? `${copy.rejectAll} ${copy.andContinue}`
+		: copy.rejectAll;
+
 	const onDismiss = () => {
 		if (hasSetGdpr() === OnboardingStatus.Complete) {
 			navigation.navigate(RouteNames.Issue);
@@ -145,18 +162,33 @@ const GdprConsent = ({
 								</Text>
 							}
 							proxy={
-								<Button
-									appearance={ButtonAppearance.Skeleton}
-									onPress={() => {
-										onEnableAllAndContinue();
-										logEvent({
-											name: 'gdpr_enable_all',
-											value: 'gdpr_enable_all',
-										});
-									}}
-								>
-									{continueText}
-								</Button>
+								<>
+									<Button
+										appearance={ButtonAppearance.Skeleton}
+										onPress={() => {
+											onEnableAllAndContinue();
+											logEvent({
+												name: 'gdpr_enable_all',
+												value: 'gdpr_enable_all',
+											});
+										}}
+									>
+										{continueText}
+									</Button>
+									<Spacer />
+									<Button
+										appearance={ButtonAppearance.Skeleton}
+										onPress={() => {
+											onRejectAllAndContinue();
+											logEvent({
+												name: 'gdpr_reject_all',
+												value: 'gdpr_reject_all',
+											});
+										}}
+									>
+										{rejectText}
+									</Button>
+								</>
 							}
 						></TallRow>
 						<Separator></Separator>
@@ -241,7 +273,7 @@ const GdprConsentScreen = () => (
 		actionLeft={true}
 	>
 		<WithAppAppearance value={'settings'}>
-			<GdprConsent continueText={'Enable all'}></GdprConsent>
+			<GdprConsent />
 		</WithAppAppearance>
 	</HeaderScreenContainer>
 );
@@ -250,7 +282,7 @@ const GdprConsentScreenForOnboarding = () => (
 	<WithAppAppearance value={'settings'}>
 		<GdprConsent
 			shouldShowDismissableHeader={true}
-			continueText={'Enable all and continue'}
+			withContinue
 		></GdprConsent>
 	</WithAppAppearance>
 );