feat: add app tracking transparency to webviews

app.config.js

@@ -47,6 +47,13 @@ export default () => {
                         sounds: [],
                     },
                 ],
+                [
+                    'expo-tracking-transparency',
+                    {
+                        userTrackingPermission:
+                            'This identifier will be used for providing services, personalization of services, statistical purposes and for legal obligations.',
+                    },
+                ],
             ],
             experiments: {
                 typedRoutes: true,

components/WhitelistedWebview.tsx

@@ -1,4 +1,5 @@
 import { useNavigation } from '@react-navigation/native';
+import { useTrackingPermissions } from 'expo-tracking-transparency';
 import { useEffect, useRef } from 'react';
 import { BackHandler, Linking, Platform } from 'react-native';
 import WebView, { WebViewProps } from 'react-native-webview';
@@ -20,6 +21,7 @@ const injectedJavascript = `(function() {
 })();`;
 
 function WhitelistedWebview({ whitelistedUrls, ...props }: WhitelistedWebviewProps) {
+    const [status, requestPermission] = useTrackingPermissions();
     const webviewRef = useRef<WebView | null>(null);
     const navigation = useNavigation();
 
@@ -48,10 +50,18 @@ function WhitelistedWebview({ whitelistedUrls, ...props }: WhitelistedWebviewPro
         }
     }, [navigation]);
 
+    useEffect(() => {
+        (async () => {
+            await requestPermission();
+        })();
+    }, [requestPermission]);
+
     return (
         <WebView
             {...props}
             ref={webviewRef}
+            sharedCookiesEnabled={status?.granted}
+            thirdPartyCookiesEnabled={status?.granted}
             injectedJavaScript={injectedJavascript}
             onNavigationStateChange={(newNavState) => {
                 let foundMatch = whitelistedUrls.find((regex) => regex.test(newNavState.url));

package.json

@@ -53,7 +53,8 @@
     "expo-notifications": "~0.28.9",
     "expo-device": "~6.0.2",
     "react-native-webview": "13.8.6",
-    "expo-updates": "~0.25.21"
+    "expo-updates": "~0.25.21",
+    "expo-tracking-transparency": "~4.0.2"
   },
   "devDependencies": {
     "@babel/core": "^7.20.0",