fix: Disable app check + fix creating convos user

Author: thierryskoda

App.tsx

@@ -6,6 +6,7 @@ import { useLogoutOnJwtRefreshError } from "@/features/authentication/use-logout
 import { useInitializeMultiInboxClient } from "@/features/multi-inbox/multi-inbox.client";
 import { useSetupStreamingSubscriptions } from "@/features/streams/streams";
 import { $globalStyles } from "@/theme/styles";
+import { useThemeProvider } from "@/theme/use-app-theme";
 import { configure as configureCoinbase } from "@coinbase/wallet-mobile-sdk";
 import { BottomSheetModalProvider } from "@design-system/BottomSheet/BottomSheetModalProvider";
 import { useReactQueryDevTools } from "@dev-plugins/react-query";
@@ -14,8 +15,6 @@ import { PrivyProvider } from "@privy-io/expo";
 import { SmartWalletsProvider } from "@privy-io/expo/smart-wallets";
 import { queryClient } from "@queries/queryClient";
 import { QueryClientProvider } from "@tanstack/react-query";
-import { useThemeProvider } from "@/theme/use-app-theme";
-import { setupAppAttest } from "@utils/appCheck";
 import { useCoinbaseWalletListener } from "@utils/coinbaseWallet";
 import * as Clipboard from "expo-clipboard";
 import "expo-dev-client";
@@ -72,7 +71,8 @@ export function App() {
     useThemeProvider();
 
   useEffect(() => {
-    setupAppAttest();
+    // Disabled for now until we go live and it works with bun
+    // setupAppAttest();
   }, []);
 
   useCoinbaseWalletListener(true, coinbaseUrl);

SlimApp.tsx

@@ -50,6 +50,6 @@ export type IConfig = {
   universalLinks: string[];
   privy: IPrivyConfig;
   evm: IEvmConfig;
-  appCheckDebugToken?: string;
+  appCheckDebugToken: string | undefined;
   reactQueryEncryptionKey: string;
 };

config/config.types.ts

@@ -1,5 +1,4 @@
 import { IConfig } from "@/config/config.types";
-import { Platform } from "react-native";
 import { shared } from "./shared";
 
 export const developmentConfig: IConfig = {
@@ -12,10 +11,6 @@ export const developmentConfig: IConfig = {
   universalLinks: ["dev.converse.xyz/", "dev.getconverse.app/"].flatMap(
     (domain) => [`https://${domain}`, `http://${domain}`, domain]
   ),
-  appCheckDebugToken:
-    Platform.OS === "android"
-      ? process.env.EXPO_PUBLIC_FIREBASE_APP_CHECK_DEBUG_TOKEN_ANDROID
-      : process.env.EXPO_PUBLIC_FIREBASE_APP_CHECK_DEBUG_TOKEN_IOS,
   evm: {
     rpcEndpoint: process.env.EXPO_PUBLIC_EVM_RPC_ENDPOINT,
     transactionChainId: "0x14a34", // Base Sepolia

config/development.ts

@@ -1,8 +1,7 @@
 import { isDev, isPreview } from "@/utils/getEnv";
 import { developmentConfig } from "./development";
-import { productionConfig } from "./production";
 import { previewConfig } from "./preview";
-import { z } from "zod";
+import { productionConfig } from "./production";
 
 // todo: use zod for env and stop typing in multiple places
 // crash on first build step rather than at runtime
@@ -20,6 +19,20 @@ import { z } from "zod";
 // // // Validate config at startup
 // // configSchema.parse(Config);
 
+/**
+ * Helpful when debugging locally using other environments
+ */
+const API_URL = process.env.EXPO_PUBLIC_CONVOS_API_URI;
+const EXPO_ENV = process.env.EXPO_ENV;
+
+if (API_URL.includes("localhost")) {
+  if (EXPO_ENV && EXPO_ENV !== "development") {
+    throw new Error(
+      "Using localhost API URL in non-dev environment. Did you forget to pull env vars?"
+    );
+  }
+}
+
 export const getConfig = () => {
   if (isDev) return developmentConfig;
   if (isPreview) return previewConfig;

config/index.ts

@@ -58,4 +58,8 @@ export const shared = {
   thirdwebClientId: process.env.EXPO_PUBLIC_THIRDWEB_CLIENT_ID,
   reactQueryEncryptionKey:
     process.env.EXPO_PUBLIC_SECURE_REACT_QUERY_ENCRYPTION_KEY,
+  appCheckDebugToken:
+    Platform.OS === "android"
+      ? process.env.EXPO_PUBLIC_FIREBASE_APP_CHECK_DEBUG_TOKEN_ANDROID
+      : process.env.EXPO_PUBLIC_FIREBASE_APP_CHECK_DEBUG_TOKEN_IOS,
 } as const satisfies Partial<IConfig>;

config/shared.ts

@@ -13,6 +13,7 @@ import { ITouchableOpacityProps } from "../TouchableOpacity";
 import { VStack } from "../VStack";
 import { HeaderAction } from "./HeaderAction";
 import { useHeaderHeight } from "@/design-system/Header/Header.utils";
+import { debugBorder } from "@/utils/debug-style";
 
 export type HeaderProps = {
   titleStyle?: StyleProp<TextStyle>;

design-system/Header/Header.tsx

@@ -7,6 +7,7 @@ import { Icon } from "../Icon/Icon";
 import { Pressable } from "../Pressable";
 import { ITextProps, Text } from "../Text";
 import { ITouchableOpacityProps, TouchableOpacity } from "../TouchableOpacity";
+import { debugBorder } from "@/utils/debug-style";
 
 type HeaderActionProps = {
   backgroundColor?: string;
@@ -75,7 +76,6 @@ const $actionTextContainer: ThemedStyle<ViewStyle> = ({ spacing }) => ({
   flexGrow: 0,
   alignItems: "center",
   justifyContent: "center",
-  height: "100%",
   paddingHorizontal: spacing.md,
   zIndex: 2,
 });

design-system/Header/HeaderAction.tsx

@@ -5,7 +5,7 @@ import { config } from "@/config";
 import { captureError } from "@/utils/capture-error";
 import { GenericError } from "@/utils/error";
 import { firebase } from "@react-native-firebase/app-check";
-import { logger } from "./logger";
+import { logger } from "../../utils/logger";
 
 const appCheck = firebase.appCheck();
 
@@ -35,6 +35,7 @@ export const tryGetAppCheckToken = async ({
     return undefined;
   }
 };
+
 export async function setupAppAttest() {
   logger.debug("[setupAppAttest] Starting app attestation setup");
 
@@ -43,15 +44,17 @@ export async function setupAppAttest() {
     "[setupAppAttest] Created new React Native Firebase App Check provider"
   );
 
+  // Configure provider based on environment and platform
   rnfbProvider.configure({
     android: {
-      provider: __DEV__ ? "debug" : "playIntegrity",
+      provider: __DEV__ ? ("debug" as const) : ("playIntegrity" as const),
       debugToken: config.appCheckDebugToken,
     },
     apple: {
-      provider: __DEV__ ? "debug" : "appAttestWithDeviceCheckFallback",
-      // Will be intentionally undefined in non-dev environments
-      debugToken: config.appCheckDebugToken,
+      provider: __DEV__
+        ? ("debug" as const)
+        : ("appAttestWithDeviceCheckFallback" as const),
+      debugToken: config.appCheckDebugToken, // Undefined in non-dev environments
     },
   });
   logger.debug(

utils/appCheck.ts features/authentication/app-check.ts

@@ -1,4 +1,4 @@
-import { tryGetAppCheckToken } from "../../utils/appCheck";
+import { tryGetAppCheckToken } from "./app-check";
 import { MultiInboxClient } from "@/features/multi-inbox/multi-inbox.client";
 import {
   getSafeCurrentSender,
@@ -20,11 +20,8 @@ export const CONVOS_AUTH_TOKEN_HEADER_KEY = "X-Convos-AuthToken";
 
 export type XmtpApiHeaders = {
   [XMTP_INSTALLATION_ID_HEADER_KEY]: string;
-
   [XMTP_INBOX_ID_HEADER_KEY]: string;
-
   [FIREBASE_APP_CHECK_HEADER_KEY]: string;
-
   [XMTP_SIGNATURE_HEADER_KEY]: string;
 };
 
@@ -38,7 +35,6 @@ export type XmtpApiHeaders = {
  * Privy passkeys. See authentication.readme.md for more details.
  */
 import { logger } from "@/utils/logger";
-
 export async function getConvosAuthenticationHeaders(): Promise<XmtpApiHeaders> {
   logger.debug(
     "[getConvosAuthenticationHeaders] Starting to get authentication headers"
@@ -49,28 +45,31 @@ export async function getConvosAuthenticationHeaders(): Promise<XmtpApiHeaders>
     `[getConvosAuthenticationHeaders] Current ethereum address: ${currentEthereumAddress}`
   );
 
+  const { multiInboxClientRestorationState } = useMultiInboxStore.getState();
   const areInboxesRestored =
-    useMultiInboxStore.getState().multiInboxClientRestorationState ===
+    multiInboxClientRestorationState ===
     MultiInboxClientRestorationStates.restored;
+
   logger.debug(
-    `[getConvosAuthenticationHeaders] Are inboxes restored: ${
-      useMultiInboxStore.getState().multiInboxClientRestorationState
-    }`
+    `[getConvosAuthenticationHeaders] Are inboxes restored: ${multiInboxClientRestorationState}`
   );
-  const appCheckToken = await tryGetAppCheckToken();
+
+  // Disabled for now until we go live and it works with bun
+  const appCheckToken = "123";
+  // const appCheckToken = await tryGetAppCheckToken();
+  // if (!appCheckToken) {
+  //   logger.error(
+  //     "[getConvosAuthenticationHeaders] No App Check Token Available"
+  //   );
+  //   throw new AuthenticationError(
+  //     "No App Check Token Available. This indicates that we believe the app is not running on an authentic build of our application on a device that has not been tampered with."
+  //   );
+  // }
+
   const inboxClient = MultiInboxClient.instance.getInboxClientForAddress({
     ethereumAddress: currentEthereumAddress,
   });
 
-  if (!appCheckToken) {
-    logger.error(
-      "[getConvosAuthenticationHeaders] No App Check Token Available"
-    );
-    throw new AuthenticationError(
-      "No App Check Token Available. This indicates that we believe the app is not running on an authentic build of our application on a device that has not been tampered with."
-    );
-  }
-
   if (!areInboxesRestored) {
     logger.error("[getConvosAuthenticationHeaders] Inboxes not restored");
     throw new AuthenticationError(
@@ -90,6 +89,7 @@ export async function getConvosAuthenticationHeaders(): Promise<XmtpApiHeaders>
   logger.debug(
     "[getConvosAuthenticationHeaders] Signing app check token with installation key"
   );
+
   const rawAppCheckTokenSignature = await inboxClient.signWithInstallationKey(
     appCheckToken
   );
@@ -98,11 +98,12 @@ export async function getConvosAuthenticationHeaders(): Promise<XmtpApiHeaders>
   logger.debug(
     "[getConvosAuthenticationHeaders] Successfully created authentication headers"
   );
+
   return {
     [XMTP_INSTALLATION_ID_HEADER_KEY]: inboxClient.installationId,
     [XMTP_INBOX_ID_HEADER_KEY]: inboxClient.inboxId,
-    [FIREBASE_APP_CHECK_HEADER_KEY]: appCheckToken,
     [XMTP_SIGNATURE_HEADER_KEY]: appCheckTokenSignatureHexString,
+    [FIREBASE_APP_CHECK_HEADER_KEY]: appCheckToken, // Disabled for now until we go live and it works with bun
   };
 }
 

features/authentication/authentication.headers.ts

@@ -3,6 +3,7 @@ import {
   createInboxWithSigner,
   createSmartWalletSigner,
 } from "@/features/onboarding/utils/passkey";
+import { authLogger } from "@/utils/logger";
 import { useEmbeddedEthereumWallet } from "@privy-io/expo";
 import { useSignupWithPasskey as usePrivySignupWithPasskey } from "@privy-io/expo/passkey";
 import { useSmartWallets } from "@privy-io/expo/smart-wallets";
@@ -14,38 +15,41 @@ export function useSignupWithPasskey() {
   const { signupWithPasskey: privySignupWithPasskey } =
     usePrivySignupWithPasskey();
   const [isSigningUp, setIsSigningUp] = useState(false);
-
   const clientRef = useRef(smartWalletClient);
 
   useEffect(() => {
     clientRef.current = smartWalletClient;
   }, [smartWalletClient]);
 
+  // Helper function to wait for smart wallet client initialization
   async function waitForSmartWalletClient(maxAttempts = 10) {
     for (let i = 0; i < maxAttempts; i++) {
       if (clientRef.current) {
         return clientRef.current;
       }
       await new Promise((resolve) => setTimeout(resolve, 1000));
     }
-
     throw new Error("Timeout waiting for smart wallet client");
   }
 
   const signup = async () => {
     try {
       setIsSigningUp(true);
 
-      await privySignupWithPasskey({
-        relyingParty: RELYING_PARTY,
-      });
+      // Step 1: Passkey signup
+      authLogger.debug(`[Passkey Signup] Starting passkey registration`);
+      await privySignupWithPasskey({ relyingParty: RELYING_PARTY });
 
+      // Step 2: Wallet creation
+      authLogger.debug(`[Wallet Setup] Creating embedded and smart wallets`);
       await createEmbeddedWallet();
-
       const smartWalletclient = await waitForSmartWalletClient();
-
       const signer = createSmartWalletSigner(smartWalletclient);
 
+      // Step 3: Inbox creation
+      authLogger.debug(
+        `[Inbox Setup] Creating inbox for address: ${smartWalletclient.account.address}`
+      );
       const { inboxId } = await createInboxWithSigner(signer);
 
       return {
@@ -59,5 +63,5 @@ export function useSignupWithPasskey() {
     }
   };
 
-  return { signup, isSigningUp: isSigningUp };
+  return { signup, isSigningUp };
 }