fix: enhance auth client with mobile-specific headers (#4064)

apps/mobile/src/lib/auth.ts

@@ -2,11 +2,16 @@ import { expoClient } from "@better-auth/expo/client"
 import { baseAuthPlugins } from "@follow/shared/auth"
 import { isNewUserQueryKey } from "@follow/store/user/constants"
 import { whoamiQueryKey } from "@follow/store/user/hooks"
+import { createMobileAPIHeaders } from "@follow/utils/headers"
 import { useQuery } from "@tanstack/react-query"
 import { createAuthClient } from "better-auth/react"
+import { nativeApplicationVersion } from "expo-application"
 import * as SecureStore from "expo-secure-store"
 import { Platform } from "react-native"
+import DeviceInfo from "react-native-device-info"
 
+import { getClientId, getSessionId } from "./client-session"
+import { getUserAgent } from "./native/user-agent"
 import { getEnvProfile, proxyEnv } from "./proxy-env"
 import { queryClient } from "./query-client"
 
@@ -39,8 +44,30 @@ const plugins = [
 
 export const authClient = createAuthClient({
   baseURL: `${proxyEnv.API_URL}/better-auth`,
+  fetchOptions: {
+    // Learn more: https://better-fetch.vercel.app/docs/hooks
+    onRequest: async (ctx) => {
+      const headers = createMobileAPIHeaders({
+        version: nativeApplicationVersion || "",
+        rnPlatform: {
+          OS: Platform.OS,
+          isPad: Platform.OS === "ios" && Platform.isPad,
+        },
+        installerPackageName: await DeviceInfo.getInstallerPackageName(),
+      })
+
+      Object.entries(headers).forEach(([key, value]) => {
+        ctx.headers.set(key, value)
+      })
+      ctx.headers.set("User-Agent", await getUserAgent())
+      return ctx
+    },
+    headers: {
+      "X-Client-Id": getClientId(),
+      "X-Session-Id": getSessionId(),
+    },
+  },
   plugins,
-  // TODO: add x-app-platform, x-app-version headers
 })
 
 // @keep-sorted