diff --git a/e2e/flows/onboarding/signup.yml b/e2e/flows/onboarding/signup.yml index 68714ce7efe..b9955ac828d 100644 --- a/e2e/flows/onboarding/signup.yml +++ b/e2e/flows/onboarding/signup.yml @@ -21,5 +21,5 @@ appId: ${MAESTRO_APP_ID} when: platform: Android commands: - - tapOn: "checkbox of consent, Check this element to consent with the Terms of Service" + - tapOn: "Accept terms and privacy policy, Check this element to accept Artsy's terms and privacy policy" - tapOn: "Next.*" diff --git a/src/app/Scenes/Onboarding/Auth2/hooks/useCountryCode.tsx b/src/app/Scenes/Onboarding/Auth2/hooks/useCountryCode.tsx new file mode 100644 index 00000000000..e25c2e51eff --- /dev/null +++ b/src/app/Scenes/Onboarding/Auth2/hooks/useCountryCode.tsx @@ -0,0 +1,77 @@ +import { useCountryCodeQuery } from "__generated__/useCountryCodeQuery.graphql" +import { useClientQuery } from "app/utils/useClientQuery" +import { useEffect, useState } from "react" +import { getIpAddress } from "react-native-device-info" +import { graphql } from "react-relay" + +const USE_COUNTRY_CODE_QUERY = graphql` + query useCountryCodeQuery($ip: String!) { + requestLocation(ip: $ip) { + countryCode + } + } +` + +export const useCountryCode = () => { + const [ip, setIp] = useState("0.0.0.0") + + useEffect(() => { + getIpAddress().then((ip) => { + setIp(ip) + }) + }, []) + + const { data, loading, error } = useClientQuery({ + query: USE_COUNTRY_CODE_QUERY, + variables: { + ip, + }, + cacheConfig: { + networkCacheConfig: { + force: false, + }, + }, + }) + + const countryCode = data?.requestLocation?.countryCode + + const isAutomaticallySubscribed = !!(countryCode && !GDPR_COUNTRY_CODES.includes(countryCode)) + + return { + countryCode, + error, + isAutomaticallySubscribed, + loading, + } +} + +export const GDPR_COUNTRY_CODES = [ + "AT", + "BE", + "BG", + "CY", + "CZ", + "DE", + "DK", + "EE", + "ES", + "FI", + "FR", + "GB", + "GR", + "HR", + "HU", + "IE", + "IT", + "LT", + "LU", + "LV", + "MT", + "NL", + "PL", + "PT", + "RO", + "SE", + "SI", + "SK", +] diff --git a/src/app/Scenes/Onboarding/Auth2/scenes/SignUpNameStep.tsx b/src/app/Scenes/Onboarding/Auth2/scenes/SignUpNameStep.tsx index 8927a7e6fa8..8b31f2e1a83 100644 --- a/src/app/Scenes/Onboarding/Auth2/scenes/SignUpNameStep.tsx +++ b/src/app/Scenes/Onboarding/Auth2/scenes/SignUpNameStep.tsx @@ -4,6 +4,7 @@ import { useAuthNavigation, useAuthScreen, } from "app/Scenes/Onboarding/Auth2/hooks/useAuthNavigation" +import { useCountryCode } from "app/Scenes/Onboarding/Auth2/hooks/useCountryCode" import { useInputAutofocus } from "app/Scenes/Onboarding/Auth2/hooks/useInputAutofocus" import { OnboardingNavigationStack } from "app/Scenes/Onboarding/Onboarding" import { EmailSubscriptionCheckbox } from "app/Scenes/Onboarding/OnboardingCreateAccount/EmailSubscriptionCheckbox" @@ -23,13 +24,18 @@ interface SignUpNameStepFormValues { export const SignUpNameStep: React.FC = () => { const screen = useAuthScreen() + const { loading, isAutomaticallySubscribed } = useCountryCode() + + if (loading) { + return null + } return ( initialValues={{ name: "", acceptedTerms: false, - agreedToReceiveEmails: false, + agreedToReceiveEmails: isAutomaticallySubscribed, }} validationSchema={Yup.object().shape({ name: Yup.string().trim().required("Full name field is required"), @@ -84,6 +90,7 @@ const SignUpNameStepForm: React.FC = () => { const navigation = useAuthNavigation() const parentNavigation = useNavigation>() + const { isAutomaticallySubscribed } = useCountryCode() const { color } = useTheme() const nameRef = useRef(null) @@ -106,6 +113,7 @@ const SignUpNameStepForm: React.FC = () => { Welcome to Artsy { error={highlightTerms} navigation={parentNavigation} /> - setFieldValue("agreedToReceiveEmails", !values.agreedToReceiveEmails)} - checked={values.agreedToReceiveEmails} - /> + {!isAutomaticallySubscribed ? ( + setFieldValue("agreedToReceiveEmails", !values.agreedToReceiveEmails)} + checked={values.agreedToReceiveEmails} + /> + ) : ( + + )}