diff --git a/components/Onboarding/init-xmtp-client.ts b/components/Onboarding/init-xmtp-client.ts
index b3dd2b60e..78bdc4265 100644
--- a/components/Onboarding/init-xmtp-client.ts
+++ b/components/Onboarding/init-xmtp-client.ts
@@ -1,4 +1,3 @@
-import { Signer } from "ethers";
 import { Alert } from "react-native";
 
 // import { invalidateProfileSocialsQuery } from "../../data/helpers/profiles/profilesUpdate";
@@ -13,8 +12,13 @@ import { awaitableAlert } from "../../utils/alert";
 import logger from "../../utils/logger";
 import { logoutAccount, waitForLogoutTasksDone } from "../../utils/logout";
 import { sentryTrackMessage } from "../../utils/sentry";
-import { createXmtpClientFromSigner } from "../../utils/xmtpRN/signIn";
+import {
+  createXmtpClientFromSigner,
+  createXmtpClientFromViemAccount,
+} from "../../utils/xmtpRN/signIn";
 import { getXmtpClient } from "../../utils/xmtpRN/sync";
+import { Signer } from "ethers";
+import { LocalAccount } from "viem/accounts";
 
 export async function initXmtpClient(args: {
   signer: Signer;
@@ -49,6 +53,39 @@ export async function initXmtpClient(args: {
   }
 }
 
+export async function initXmtpClientFromViemAccount(args: {
+  account: LocalAccount;
+  address: string;
+  privyAccountId?: string;
+  isEphemeral?: boolean;
+  pkPath?: string;
+}) {
+  const { account, address, ...restArgs } = args;
+
+  if (!account || !address) {
+    throw new Error("No signer or address");
+  }
+
+  try {
+    await createXmtpClientFromViemAccount(account, async () => {
+      await awaitableAlert(
+        translate("current_installation_revoked"),
+        translate("current_installation_revoked_description")
+      );
+      throw new Error("Current installation revoked");
+    });
+
+    await connectWithAddress({
+      address,
+      ...restArgs,
+    });
+  } catch (e) {
+    await logoutAccount(address, false, true, () => {});
+    logger.error(e);
+    throw e;
+  }
+}
+
 type IBaseArgs = {
   address: string;
 };
diff --git a/features/conversation/conversation.nav.tsx b/features/conversation/conversation.nav.tsx
index ee9bbda63..345c9773c 100644
--- a/features/conversation/conversation.nav.tsx
+++ b/features/conversation/conversation.nav.tsx
@@ -24,7 +24,7 @@ export function ConversationNav() {
       options={{
         title: "",
         headerBackTitle: "",
-        headerBackVisible: false,
+        // headerBackVisible: false,
       }}
       name="Conversation"
       component={ConversationScreen}
diff --git a/features/embedded-wallets/turnkey-embedded-wallet.ts b/features/embedded-wallets/turnkey-embedded-wallet.ts
index abc5599ed..3aa2a424f 100644
--- a/features/embedded-wallets/turnkey-embedded-wallet.ts
+++ b/features/embedded-wallets/turnkey-embedded-wallet.ts
@@ -1,4 +1,4 @@
-import { onPasskeyCreate } from "@/utils/passkeys/createPasskey";
+import { onPasskeyCreate } from "@/utils/passkeys/create-passkey";
 import { IEmbeddedWallet } from "./embedded-wallet.interface";
 import { Client } from "@xmtp/react-native-sdk";
 import { LocalAccount } from "viem/accounts";
diff --git a/features/onboarding/passkey/passkeyAuthStore.tsx b/features/onboarding/passkey/passkeyAuthStore.tsx
index 1e36ebb1e..60b26adf5 100644
--- a/features/onboarding/passkey/passkeyAuthStore.tsx
+++ b/features/onboarding/passkey/passkeyAuthStore.tsx
@@ -1,12 +1,24 @@
 import { createContext, memo, useContext, useRef } from "react";
 import { createStore, useStore } from "zustand";
+import { LocalAccount } from "viem/accounts";
+import { TurnkeyStoreInfo } from "@/utils/passkeys/passkeys.interfaces";
 
 type IPasskeyAuthStoreProps = {
-  loading: boolean;
+  loading?: boolean;
+  error?: string;
+  statusString?: string;
+  account?: LocalAccount;
+  turnkeyInfo?: TurnkeyStoreInfo;
+  previousPasskeyName?: string;
 };
 
 type IPasskeyAuthStoreState = IPasskeyAuthStoreProps & {
   setLoading: (loading: boolean) => void;
+  setError: (error: string | undefined) => void;
+  setStatusString: (statusString: string | undefined) => void;
+  setAccount: (account: LocalAccount | undefined) => void;
+  setTurnkeyInfo: (turnkeyInfo: TurnkeyStoreInfo | undefined) => void;
+  setPreviousPasskeyName: (previousPasskeyName: string | undefined) => void;
   reset: () => void;
 };
 
@@ -34,11 +46,23 @@ export const PasskeyAuthStoreProvider = memo(
 const createPasskeyAuthStore = (initProps: IPasskeyAuthStoreProps) => {
   const DEFAULT_PROPS: IPasskeyAuthStoreProps = {
     loading: false,
+    error: undefined,
+    statusString: undefined,
+    account: undefined,
+    turnkeyInfo: undefined,
+    previousPasskeyName: undefined,
   };
   return createStore<IPasskeyAuthStoreState>()((set) => ({
     ...DEFAULT_PROPS,
     ...initProps,
-    setLoading: (loading) => set({ loading }),
+    setLoading: (loading) =>
+      loading ? set({ loading, error: undefined }) : set({ loading: false }),
+    setError: (error) => set({ error, statusString: undefined }),
+    setStatusString: (statusString) => set({ statusString }),
+    setAccount: (account) => set({ account }),
+    setTurnkeyInfo: (turnkeyInfo) => set({ turnkeyInfo }),
+    setPreviousPasskeyName: (previousPasskeyName) =>
+      set({ previousPasskeyName }),
     reset: () => set(DEFAULT_PROPS),
   }));
 };
diff --git a/i18n/translations/en.ts b/i18n/translations/en.ts
index f3d4b7637..7456a840b 100644
--- a/i18n/translations/en.ts
+++ b/i18n/translations/en.ts
@@ -54,6 +54,7 @@ export const en = {
   },
   passkey: {
     title: "Create Passkey",
+    add_account_title: "Add account by passkey",
     subtitle: "Create a passkey to connect to Converse",
     createButton: "Create Passkey",
   },
diff --git a/navigation/OnboardingNavigator.tsx b/navigation/OnboardingNavigator.tsx
index b60a952b7..6fa68109a 100644
--- a/navigation/OnboardingNavigator.tsx
+++ b/navigation/OnboardingNavigator.tsx
@@ -5,7 +5,7 @@ import { useColorScheme } from "react-native";
 import { authScreensSharedScreenOptions } from "../screens/Navigation/Navigation";
 import { stackGroupScreenOptions } from "../screens/Navigation/navHelpers";
 import { OnboardingConnectWalletScreen } from "../screens/Onboarding/OnboardingConnectWalletScreen";
-import { OnboardingEphemeraScreen } from "../screens/Onboarding/OnboardingEphemeraScreen";
+import { OnboardingEphemeralScreen } from "../screens/Onboarding/OnboardingEphemeralScreen";
 import { OnboardingGetStartedScreen } from "../screens/Onboarding/OnboardingGetStartedScreen";
 import { OnboardingNotificationsScreen } from "../screens/Onboarding/OnboardingNotificationsScreen";
 import { OnboardingPrivateKeyScreen } from "../screens/Onboarding/OnboardingPrivateKeyScreen";
@@ -76,7 +76,7 @@ export const OnboardingNavigator = memo(function OnboardingNavigator() {
         />
         <OnboardingNativeStack.Screen
           name="OnboardingEphemeral"
-          component={OnboardingEphemeraScreen}
+          component={OnboardingEphemeralScreen}
         />
       </OnboardingNativeStack.Group>
     </OnboardingNativeStack.Navigator>
diff --git a/screens/Navigation/Navigation.tsx b/screens/Navigation/Navigation.tsx
index 7bc357cc2..dc5b6d55b 100644
--- a/screens/Navigation/Navigation.tsx
+++ b/screens/Navigation/Navigation.tsx
@@ -10,13 +10,13 @@ import { useRouter } from "../../navigation/useNavigation";
 import Accounts from "../Accounts/Accounts";
 import { IdleScreen } from "../IdleScreen";
 import { NewAccountConnectWalletScreen } from "../NewAccount/NewAccountConnectWalletScreen";
-import { NewAccountEphemeraScreen } from "../NewAccount/NewAccountEphemeraScreen";
+import { NewAccountEphemeralScreen } from "../NewAccount/NewAccountEphemeralScreen";
 import { NewAccountPrivateKeyScreen } from "../NewAccount/NewAccountPrivateKeyScreen";
 import { NewAccountPrivyScreen } from "../NewAccount/NewAccountPrivyScreen";
 import { NewAccountScreen } from "../NewAccount/NewAccountScreen";
 import { NewAccountUserProfileScreen } from "../NewAccount/NewAccountUserProfileScreen";
 import { OnboardingConnectWalletScreen } from "../Onboarding/OnboardingConnectWalletScreen";
-import { OnboardingEphemeraScreen } from "../Onboarding/OnboardingEphemeraScreen";
+import { OnboardingEphemeralScreen } from "../Onboarding/OnboardingEphemeralScreen";
 import { OnboardingGetStartedScreen } from "../Onboarding/OnboardingGetStartedScreen";
 import { OnboardingNotificationsScreen } from "../Onboarding/OnboardingNotificationsScreen";
 import { OnboardingPrivateKeyScreen } from "../Onboarding/OnboardingPrivateKeyScreen";
@@ -47,6 +47,7 @@ import WebviewPreviewNav, {
 } from "./WebviewPreviewNav";
 import { translate } from "@/i18n";
 import { OnboardingPasskeyScreen } from "../Onboarding/OnboardingPasskeyScreen";
+import { NewAccountPasskeyScreen } from "../NewAccount/NewAccountPasskeyScreen";
 
 export type NavigationParamList = {
   Idle: undefined;
@@ -72,7 +73,7 @@ export type NavigationParamList = {
   NewAccountPrivy: undefined;
   NewAccountPrivateKey: undefined;
   NewAccountEphemera: undefined;
-
+  NewAccountPasskey: undefined;
   // Main
   Accounts: undefined;
   Blocked: undefined;
@@ -99,7 +100,7 @@ export type NavigationParamList = {
 export const authScreensSharedScreenOptions: NativeStackNavigationOptions = {
   headerTitle: "",
   headerBackTitle: translate("back"),
-  headerBackVisible: false,
+  // headerBackVisible: false,
   headerShadowVisible: false,
 };
 
@@ -237,7 +238,7 @@ export function SignedOutNavigation() {
           />
           <NativeStack.Screen
             name="OnboardingEphemeral"
-            component={OnboardingEphemeraScreen}
+            component={OnboardingEphemeralScreen}
           />
         </NativeStack.Group>
       </NativeStack.Group>
@@ -291,7 +292,11 @@ const NewAccountNavigator = memo(function NewAccountNavigator() {
         />
         <NewAccountStack.Screen
           name="NewAccountEphemera"
-          component={NewAccountEphemeraScreen}
+          component={NewAccountEphemeralScreen}
+        />
+        <NewAccountStack.Screen
+          name="NewAccountPasskey"
+          component={NewAccountPasskeyScreen}
         />
       </NewAccountStack.Group>
     </NewAccountStack.Navigator>
diff --git a/screens/NewAccount/NewAccountEphemeraScreen.tsx b/screens/NewAccount/NewAccountEphemeralScreen.tsx
similarity index 98%
rename from screens/NewAccount/NewAccountEphemeraScreen.tsx
rename to screens/NewAccount/NewAccountEphemeralScreen.tsx
index c8b43308c..284a8942f 100644
--- a/screens/NewAccount/NewAccountEphemeraScreen.tsx
+++ b/screens/NewAccount/NewAccountEphemeralScreen.tsx
@@ -18,7 +18,7 @@ import { sentryTrackError } from "../../utils/sentry";
 import { NavigationParamList } from "../Navigation/Navigation";
 import { isMissingConverseProfile } from "../Onboarding/Onboarding.utils";
 
-export function NewAccountEphemeraScreen(
+export function NewAccountEphemeralScreen(
   props: NativeStackScreenProps<NavigationParamList, "NewAccountEphemera">
 ) {
   const router = useRouter();
diff --git a/screens/NewAccount/NewAccountPasskeyScreen.tsx b/screens/NewAccount/NewAccountPasskeyScreen.tsx
new file mode 100644
index 000000000..118aef1dd
--- /dev/null
+++ b/screens/NewAccount/NewAccountPasskeyScreen.tsx
@@ -0,0 +1,324 @@
+import React, { memo, useCallback, useRef } from "react";
+
+import { NewAccountScreenComp } from "@components/NewAccount/NewAccountScreenComp";
+import { NewAccountPictoTitleSubtitle } from "@components/NewAccount/NewAccountTitleSubtitlePicto";
+import {
+  PasskeyAuthStoreProvider,
+  usePasskeyAuthStoreContext,
+} from "@features/onboarding/passkey/passkeyAuthStore";
+import { translate } from "@i18n";
+import { useRouter } from "../../navigation/useNavigation";
+import { isMissingConverseProfile } from "../Onboarding/Onboarding.utils";
+import { addWalletToPasskey } from "@/utils/passkeys/add-wallet-to-passkey";
+import { initXmtpClientFromViemAccount } from "@/components/Onboarding/init-xmtp-client";
+import { Button } from "@/design-system/Button/Button";
+import { TextField } from "@/design-system/TextField/TextField";
+import { Text } from "@/design-system/Text";
+import { onPasskeyCreate } from "@/utils/passkeys/create-passkey";
+import { loadAccountFromPasskey } from "@/utils/passkeys/load-client-from-passkey";
+
+export const NewAccountPasskeyScreen = memo(function () {
+  return (
+    <PasskeyAuthStoreProvider>
+      <Content />
+    </PasskeyAuthStoreProvider>
+  );
+});
+
+const Content = memo(function Content() {
+  const router = useRouter();
+
+  const loading = usePasskeyAuthStoreContext((state) => state.loading);
+
+  const error = usePasskeyAuthStoreContext((state) => state.error);
+
+  const statusString = usePasskeyAuthStoreContext(
+    (state) => state.statusString
+  );
+
+  const account = usePasskeyAuthStoreContext((state) => state.account);
+
+  const turnkeyInfo = usePasskeyAuthStoreContext((state) => state.turnkeyInfo);
+
+  const previousPasskeyName = usePasskeyAuthStoreContext(
+    (state) => state.previousPasskeyName
+  );
+
+  const setLoading = usePasskeyAuthStoreContext((state) => state.setLoading);
+
+  const setError = usePasskeyAuthStoreContext((state) => state.setError);
+
+  const setStatusString = usePasskeyAuthStoreContext(
+    (state) => state.setStatusString
+  );
+
+  const setAccount = usePasskeyAuthStoreContext((state) => state.setAccount);
+
+  const setTurnkeyInfo = usePasskeyAuthStoreContext(
+    (state) => state.setTurnkeyInfo
+  );
+
+  const setPreviousPasskeyName = usePasskeyAuthStoreContext(
+    (state) => state.setPreviousPasskeyName
+  );
+
+  const inputTextRef = useRef<string>("");
+
+  const handleCreatePasskey = useCallback(async () => {
+    try {
+      setLoading(true);
+      const account = await onPasskeyCreate({
+        passkeyName: inputTextRef.current ?? "",
+        setStatusString,
+        setPreviousPasskeyName,
+        setTurnkeyInfo,
+      });
+      if (!account) {
+        setError("No account created from Passkey");
+        return;
+      }
+      setAccount(account);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Unknown error");
+    } finally {
+      setLoading(false);
+    }
+  }, [
+    setAccount,
+    setError,
+    setLoading,
+    setPreviousPasskeyName,
+    setStatusString,
+    setTurnkeyInfo,
+  ]);
+
+  const handleLoginWithPasskey = useCallback(async () => {
+    try {
+      setLoading(true);
+      const { account } = await loadAccountFromPasskey({
+        setStatusString,
+        setPreviousPasskeyName,
+        setTurnkeyInfo,
+      });
+      if (!account) {
+        setError("No account loaded from Passkey");
+        return;
+      }
+      setAccount(account);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Unknown error");
+    } finally {
+      setLoading(false);
+    }
+  }, [
+    setAccount,
+    setError,
+    setLoading,
+    setPreviousPasskeyName,
+    setStatusString,
+    setTurnkeyInfo,
+  ]);
+
+  const handleAddWalletToPasskey = useCallback(async () => {
+    try {
+      setLoading(true);
+      if (!turnkeyInfo) {
+        setStatusString("No turnkey info, you must create a passkey first");
+        return;
+      }
+      await addWalletToPasskey({
+        subOrgId: turnkeyInfo.subOrganizationId,
+        setStatusString,
+      });
+      setStatusString("Wallet added to passkey");
+    } catch (e) {
+      setError(
+        e instanceof Error ? e.message : "Error adding wallet to passkey"
+      );
+    } finally {
+      setLoading(false);
+    }
+  }, [turnkeyInfo, setError, setLoading, setStatusString]);
+
+  const createXmtpClientFromAccount = useCallback(async () => {
+    try {
+      setLoading(true);
+      if (!account) {
+        setStatusString("Need to set an account first");
+        return;
+      }
+      await initXmtpClientFromViemAccount({
+        account,
+        address: account.address,
+      });
+      setStatusString("Xmtp client created");
+      if (isMissingConverseProfile()) {
+        router.navigate("NewAccountUserProfile");
+      } else {
+        router.navigate("Chats");
+      }
+    } catch (err) {
+      console.log("error creating Xmtp client", err);
+      setStatusString("");
+      setError(
+        "Error creating Xmtp client : " +
+          (err instanceof Error ? err.message : "") +
+          (typeof err === "string" ? err : "")
+      );
+    } finally {
+      setLoading(false);
+    }
+  }, [account, router, setError, setLoading, setStatusString]);
+
+  const onboardWithPasskey = useCallback(async () => {
+    try {
+      setLoading(true);
+      const account = await onPasskeyCreate({
+        passkeyName: inputTextRef.current ?? "",
+        setStatusString,
+        setPreviousPasskeyName,
+        setTurnkeyInfo,
+      });
+      await initXmtpClientFromViemAccount({
+        account,
+        address: account.address,
+      });
+      if (isMissingConverseProfile()) {
+        router.navigate("NewAccountUserProfile");
+      } else {
+        router.navigate("Chats");
+      }
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Unknown error");
+    } finally {
+      setLoading(false);
+    }
+  }, [
+    setLoading,
+    setStatusString,
+    setPreviousPasskeyName,
+    setTurnkeyInfo,
+    router,
+    setError,
+  ]);
+
+  const addWalletToExistingPasskey = useCallback(async () => {
+    try {
+      const { turnkeyInfo } = await loadAccountFromPasskey({
+        setStatusString,
+        setPreviousPasskeyName,
+        setTurnkeyInfo,
+      });
+      setStatusString("Got turnkey info");
+
+      if (!turnkeyInfo) {
+        throw new Error("No turnkey info, you must create a passkey first");
+      }
+
+      const { account } = await addWalletToPasskey({
+        subOrgId: turnkeyInfo.subOrganizationId,
+        setStatusString,
+      });
+      setStatusString("Got address and account" + account.address);
+
+      await initXmtpClientFromViemAccount({
+        account,
+        address: account.address,
+      });
+      if (isMissingConverseProfile()) {
+        router.navigate("NewAccountUserProfile");
+      } else {
+        router.navigate("Chats");
+      }
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Unknown error");
+    } finally {
+      setLoading(false);
+    }
+  }, [
+    setStatusString,
+    setPreviousPasskeyName,
+    setTurnkeyInfo,
+    router,
+    setError,
+    setLoading,
+  ]);
+
+  return (
+    <NewAccountScreenComp>
+      <NewAccountPictoTitleSubtitle.Container>
+        <NewAccountPictoTitleSubtitle.Title>
+          {translate("passkey.add_account_title")}
+        </NewAccountPictoTitleSubtitle.Title>
+      </NewAccountPictoTitleSubtitle.Container>
+      {statusString && (
+        <Text style={{ marginBottom: 10 }} preset="body">
+          {statusString}
+        </Text>
+      )}
+      {previousPasskeyName && (
+        <Text preset="bodyBold">
+          Previous passkey name:
+          <Text preset="body">{previousPasskeyName}</Text>
+        </Text>
+      )}
+      {turnkeyInfo && (
+        <Text preset="bodyBold">
+          Turnkey info:
+          <Text preset="body">{JSON.stringify(turnkeyInfo)}</Text>
+        </Text>
+      )}
+      {error && (
+        <Text preset="body" color="caution">
+          {error}
+        </Text>
+      )}
+      {account && (
+        <Text preset="bodyBold">
+          Account created:
+          <Text preset="body">{account.address}</Text>
+        </Text>
+      )}
+      <TextField
+        placeholder="Enter your passkey"
+        onChangeText={(text) => {
+          inputTextRef.current = text;
+        }}
+      />
+      <Button
+        text={"Onboard with passkey"}
+        onPress={onboardWithPasskey}
+        loading={loading}
+      />
+      <Button
+        text={"Add new wallet to existing passkey"}
+        onPress={addWalletToExistingPasskey}
+        loading={loading}
+      />
+      <Button
+        text={translate("passkey.createButton")}
+        onPress={handleCreatePasskey}
+        loading={loading}
+        variant="secondary"
+      />
+      <Button
+        text={"Login with passkey"}
+        onPress={handleLoginWithPasskey}
+        loading={loading}
+        variant="secondary"
+      />
+      <Button
+        text={"Add new wallet to passkey"}
+        onPress={handleAddWalletToPasskey}
+        loading={loading}
+        variant="secondary"
+      />
+      <Button
+        text={"Create Xmtp client from account"}
+        onPress={createXmtpClientFromAccount}
+        loading={loading}
+        variant="secondary"
+      />
+    </NewAccountScreenComp>
+  );
+});
diff --git a/screens/NewAccount/NewAccountScreen.tsx b/screens/NewAccount/NewAccountScreen.tsx
index 04e76355c..4336b00c8 100644
--- a/screens/NewAccount/NewAccountScreen.tsx
+++ b/screens/NewAccount/NewAccountScreen.tsx
@@ -8,6 +8,7 @@ import { NewAccountPictoTitleSubtitle } from "../../components/NewAccount/NewAcc
 import {
   InstalledWalletsTableView,
   getConnectViaWalletTableViewEphemeralItem,
+  getConnectViaWalletTableViewPasskeyItem,
   getConnectViaWalletTableViewPhoneItem,
   getConnectViaWalletTableViewPrivateKeyItem,
 } from "../../components/Onboarding/ConnectViaWallet/ConnectViaWalletTableViewItems";
@@ -43,6 +44,11 @@ export const NewAccountScreen = memo(function NewAccountScreen() {
       <TableView
         title={translate("walletSelector.converseAccount.title")}
         items={[
+          getConnectViaWalletTableViewPasskeyItem({
+            action: () => {
+              router.navigate("NewAccountPasskey");
+            },
+          }),
           getConnectViaWalletTableViewPhoneItem({
             action: () => {
               router.navigate("NewAccountPrivy");
diff --git a/screens/Onboarding/OnboardingEphemeraScreen.tsx b/screens/Onboarding/OnboardingEphemeralScreen.tsx
similarity index 98%
rename from screens/Onboarding/OnboardingEphemeraScreen.tsx
rename to screens/Onboarding/OnboardingEphemeralScreen.tsx
index 3815d26bd..1d48b9297 100644
--- a/screens/Onboarding/OnboardingEphemeraScreen.tsx
+++ b/screens/Onboarding/OnboardingEphemeralScreen.tsx
@@ -22,7 +22,7 @@ import { useRouter } from "../../navigation/useNavigation";
 import { sentryTrackError } from "../../utils/sentry";
 import { NavigationParamList } from "../Navigation/Navigation";
 
-export function OnboardingEphemeraScreen(
+export function OnboardingEphemeralScreen(
   props: NativeStackScreenProps<NavigationParamList, "OnboardingEphemeral">
 ) {
   const router = useRouter();
diff --git a/screens/Onboarding/OnboardingPasskeyScreen.tsx b/screens/Onboarding/OnboardingPasskeyScreen.tsx
index 25a257577..9f1fcd176 100644
--- a/screens/Onboarding/OnboardingPasskeyScreen.tsx
+++ b/screens/Onboarding/OnboardingPasskeyScreen.tsx
@@ -1,97 +1,214 @@
-import React, { memo, useCallback, useRef, useState } from "react";
+import React, { memo, useCallback, useRef } from "react";
 
-import { OnboardingPictoTitleSubtitle } from "../../components/Onboarding/OnboardingPictoTitleSubtitle";
-import { OnboardingScreenComp } from "../../components/Onboarding/OnboardingScreenComp";
-import { translate } from "../../i18n";
-import { PasskeyAuthStoreProvider } from "@/features/onboarding/passkey/passkeyAuthStore";
+import { OnboardingPictoTitleSubtitle } from "@components/Onboarding/OnboardingPictoTitleSubtitle";
+import { OnboardingScreenComp } from "@components/Onboarding/OnboardingScreenComp";
+import { translate } from "@i18n";
 import {
-  getWhoami,
-  onPasskeyCreate,
-  onPasskeySignature,
-} from "@/utils/passkeys/createPasskey";
+  PasskeyAuthStoreProvider,
+  usePasskeyAuthStoreContext,
+} from "@/features/onboarding/passkey/passkeyAuthStore";
+import { onPasskeyCreate } from "@/utils/passkeys/create-passkey";
 import { Button } from "@/design-system/Button/Button";
 import { Text } from "@/design-system/Text";
-import { LocalAccount } from "viem/accounts";
-import { viemSignerToXmtpSigner } from "@/utils/xmtpRN/signer";
-import { Client } from "@xmtp/react-native-sdk";
-import {
-  copyDatabasesToTemporaryDirectory,
-  createTemporaryDirectory,
-} from "@/utils/fileSystem";
-import { getDbEncryptionKey } from "@/utils/keychain/helpers";
-import { getInboxId } from "@/utils/xmtpRN/signIn";
-import { getDbDirectory } from "@/data/db";
 import { TextField } from "@/design-system/TextField/TextField";
+import { initXmtpClientFromViemAccount } from "@/components/Onboarding/init-xmtp-client";
+import { addWalletToPasskey } from "@/utils/passkeys/add-wallet-to-passkey";
+import { loadAccountFromPasskey } from "@/utils/passkeys/load-client-from-passkey";
+import {
+  isMissingConverseProfile,
+  needToShowNotificationsPermissions,
+} from "./Onboarding.utils";
+import { useRouter } from "@/navigation/useNavigation";
+import { setAuthStatus } from "@/data/store/authStore";
 
 export const OnboardingPasskeyScreen = memo(function Screen() {
   return (
-    <PasskeyAuthStoreProvider loading={false}>
+    <PasskeyAuthStoreProvider>
       <Content />
     </PasskeyAuthStoreProvider>
   );
 });
 
 const Content = memo(function Content() {
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState<string | null>(null);
-  const [account, setAccount] = useState<LocalAccount | null>(null);
+  const router = useRouter();
+
+  const loading = usePasskeyAuthStoreContext((state) => state.loading);
+
+  const error = usePasskeyAuthStoreContext((state) => state.error);
+
+  const statusString = usePasskeyAuthStoreContext(
+    (state) => state.statusString
+  );
+
+  const account = usePasskeyAuthStoreContext((state) => state.account);
+
+  const turnkeyInfo = usePasskeyAuthStoreContext((state) => state.turnkeyInfo);
+
+  const previousPasskeyName = usePasskeyAuthStoreContext(
+    (state) => state.previousPasskeyName
+  );
+
+  const setLoading = usePasskeyAuthStoreContext((state) => state.setLoading);
+
+  const setError = usePasskeyAuthStoreContext((state) => state.setError);
+
+  const setStatusString = usePasskeyAuthStoreContext(
+    (state) => state.setStatusString
+  );
+
+  const setAccount = usePasskeyAuthStoreContext((state) => state.setAccount);
+
+  const setTurnkeyInfo = usePasskeyAuthStoreContext(
+    (state) => state.setTurnkeyInfo
+  );
+
+  const setPreviousPasskeyName = usePasskeyAuthStoreContext(
+    (state) => state.setPreviousPasskeyName
+  );
+
   const inputTextRef = useRef<string>("");
 
   const handleCreatePasskey = useCallback(async () => {
     try {
       setLoading(true);
-      const account = await onPasskeyCreate(inputTextRef.current ?? "");
+      const account = await onPasskeyCreate({
+        passkeyName: inputTextRef.current ?? "",
+        setStatusString,
+        setPreviousPasskeyName,
+        setTurnkeyInfo,
+      });
       if (!account) {
+        setError("No account created from Passkey");
         return;
       }
-      const tempDirectory = await createTemporaryDirectory();
-      const dbEncryptionKey = await getDbEncryptionKey();
-      const options = {
-        env: "dev",
-        enableV3: true,
-        dbDirectory: tempDirectory,
-        dbEncryptionKey,
-      } as const;
-      const inboxId = await getInboxId(account.address);
-
-      await copyDatabasesToTemporaryDirectory(tempDirectory, inboxId);
-      const xmptClient = await Client.create(
-        viemSignerToXmtpSigner(account),
-        options
-      );
-      const dm = await xmptClient.conversations.newConversation(
-        "0x04B1E6971559f4AB1453392220d4f8173F41D7d9"
-      );
-      console.log("dm", dm);
-      dm.send("Hello from passkey embedded wallet");
+      setAccount(account);
     } catch (e) {
       setError(e instanceof Error ? e.message : "Unknown error");
     } finally {
       setLoading(false);
     }
-  }, []);
+  }, [
+    setAccount,
+    setError,
+    setLoading,
+    setPreviousPasskeyName,
+    setStatusString,
+    setTurnkeyInfo,
+  ]);
 
   const handleLoginWithPasskey = useCallback(async () => {
-    const account = await onPasskeySignature();
-    if (!account) {
-      return;
+    try {
+      setLoading(true);
+      const { account } = await loadAccountFromPasskey({
+        setStatusString,
+        setPreviousPasskeyName,
+        setTurnkeyInfo,
+      });
+      if (!account) {
+        setError("No account loaded from Passkey");
+        throw new Error("No account loaded from Passkey");
+      }
+      setAccount(account);
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Unknown error");
+    } finally {
+      setLoading(false);
     }
-    const dbDirectory = await getDbDirectory();
-    const dbEncryptionKey = await getDbEncryptionKey();
-    const options = {
-      env: "dev",
-      enableV3: true,
-      dbDirectory,
-      dbEncryptionKey,
-    } as const;
-
-    const xmptClient = await Client.build(account.address, options);
-    const dm = await xmptClient.conversations.newConversation(
-      "0x04B1E6971559f4AB1453392220d4f8173F41D7d9"
-    );
-    console.log("dm", dm);
-    dm.send("Hello from persisted passkey embedded wallet");
-  }, []);
+  }, [
+    setAccount,
+    setError,
+    setLoading,
+    setPreviousPasskeyName,
+    setStatusString,
+    setTurnkeyInfo,
+  ]);
+
+  const handleAddWalletToPasskey = useCallback(async () => {
+    try {
+      setLoading(true);
+      if (!turnkeyInfo) {
+        setStatusString("No turnkey info, you must create a passkey first");
+        return;
+      }
+      await addWalletToPasskey({
+        subOrgId: turnkeyInfo.subOrganizationId,
+        setStatusString,
+      });
+      setStatusString("Wallet added to passkey");
+    } catch (e) {
+      setError(
+        e instanceof Error ? e.message : "Error adding wallet to passkey"
+      );
+    } finally {
+      setLoading(false);
+    }
+  }, [turnkeyInfo, setError, setLoading, setStatusString]);
+
+  const createXmtpClientFromAccount = useCallback(async () => {
+    try {
+      setLoading(true);
+      if (!account) {
+        setStatusString("Need to set an account first");
+        return;
+      }
+      await initXmtpClientFromViemAccount({
+        account,
+        address: account.address,
+      });
+      if (isMissingConverseProfile()) {
+        router.navigate("OnboardingUserProfile");
+      } else if (needToShowNotificationsPermissions()) {
+        router.navigate("OnboardingNotifications");
+      } else {
+        setAuthStatus("signedIn");
+      }
+      setStatusString("Xmtp client created");
+    } catch (err) {
+      console.log("error creating Xmtp client", err);
+      setStatusString("");
+      setError(
+        "Error creating Xmtp client : " +
+          (err instanceof Error ? err.message : "") +
+          (typeof err === "string" ? err : "")
+      );
+    } finally {
+      setLoading(false);
+    }
+  }, [account, router, setError, setLoading, setStatusString]);
+
+  const onboardWithPasskey = useCallback(async () => {
+    try {
+      setLoading(true);
+      const account = await onPasskeyCreate({
+        passkeyName: inputTextRef.current ?? "",
+        setStatusString,
+        setPreviousPasskeyName,
+        setTurnkeyInfo,
+      });
+      await initXmtpClientFromViemAccount({
+        account,
+        address: account.address,
+      });
+      if (isMissingConverseProfile()) {
+        router.navigate("OnboardingUserProfile");
+      } else if (needToShowNotificationsPermissions()) {
+        router.navigate("OnboardingNotifications");
+      } else {
+        setAuthStatus("signedIn");
+      }
+    } catch (e) {
+      setError(e instanceof Error ? e.message : "Unknown error");
+    } finally {
+      setLoading(false);
+    }
+  }, [
+    setLoading,
+    setStatusString,
+    setPreviousPasskeyName,
+    setTurnkeyInfo,
+    router,
+    setError,
+  ]);
 
   return (
     <OnboardingScreenComp preset="scroll">
@@ -100,29 +217,69 @@ const Content = memo(function Content() {
           {translate("passkey.title")}
         </OnboardingPictoTitleSubtitle.Title>
       </OnboardingPictoTitleSubtitle.Container>
+      {statusString && (
+        <Text style={{ marginBottom: 10 }} preset="body">
+          {statusString}
+        </Text>
+      )}
+      {previousPasskeyName && (
+        <Text preset="bodyBold">
+          Previous passkey name:
+          <Text preset="body">{previousPasskeyName}</Text>
+        </Text>
+      )}
+      {turnkeyInfo && (
+        <Text preset="bodyBold">
+          Turnkey info:
+          <Text preset="body">{JSON.stringify(turnkeyInfo)}</Text>
+        </Text>
+      )}
       {error && (
         <Text preset="body" color="caution">
           {error}
         </Text>
       )}
-      {account && <Text preset="body">Account created: {account.address}</Text>}
+      {account && (
+        <Text preset="bodyBold">
+          Account created:
+          <Text preset="body">{account.address}</Text>
+        </Text>
+      )}
       <TextField
         placeholder="Enter your passkey"
         onChangeText={(text) => {
           inputTextRef.current = text;
         }}
       />
+      <Button
+        text={"Onboard with passkey"}
+        onPress={onboardWithPasskey}
+        loading={loading}
+      />
       <Button
         text={translate("passkey.createButton")}
         onPress={handleCreatePasskey}
         loading={loading}
+        variant="secondary"
       />
       <Button
         text={"Login with passkey"}
         onPress={handleLoginWithPasskey}
         loading={loading}
+        variant="secondary"
+      />
+      <Button
+        text={"Add new wallet to passkey"}
+        onPress={handleAddWalletToPasskey}
+        loading={loading}
+        variant="secondary"
+      />
+      <Button
+        text={"Create Xmtp client from account"}
+        onPress={createXmtpClientFromAccount}
+        loading={loading}
+        variant="secondary"
       />
-      <Button text={"Check whoami"} onPress={getWhoami} loading={loading} />
     </OnboardingScreenComp>
   );
 });
diff --git a/utils/passkeys/add-wallet-to-passkey.ts b/utils/passkeys/add-wallet-to-passkey.ts
new file mode 100644
index 000000000..0f62190b1
--- /dev/null
+++ b/utils/passkeys/add-wallet-to-passkey.ts
@@ -0,0 +1,50 @@
+import { PasskeyStamper } from "@turnkey/react-native-passkey-stamper";
+import { RPID } from "./passkeys.constants";
+import { TurnkeyClient } from "@turnkey/http";
+import { getTurnkeyClient, setTurnkeyClient } from "./turnkey-clients";
+import { createTurnkeyAccount } from "./create-turnkey-account";
+import { v4 as uuidv4 } from "uuid";
+
+type AddWalletToPasskeyParams = {
+  subOrgId: string;
+  setStatusString: (statusString: string) => void;
+};
+
+export const addWalletToPasskey = async ({
+  subOrgId,
+  setStatusString,
+}: AddWalletToPasskeyParams) => {
+  setStatusString("Adding wallet to passkey. Creating Passkey Stamper...");
+  let client = getTurnkeyClient(subOrgId);
+  if (!client) {
+    const stamper = new PasskeyStamper({
+      rpId: RPID,
+    });
+    client = new TurnkeyClient({ baseUrl: "https://api.turnkey.com" }, stamper);
+    setTurnkeyClient(subOrgId, client);
+  }
+
+  const res = await client.createWallet({
+    type: "ACTIVITY_TYPE_CREATE_WALLET",
+    timestampMs: Date.now().toString(),
+    organizationId: subOrgId,
+    parameters: {
+      walletName: "Wallet " + uuidv4(),
+      accounts: [
+        {
+          curve: "CURVE_SECP256K1",
+          pathFormat: "PATH_FORMAT_BIP32",
+          path: "m/44'/60'/0'/0/0",
+          addressFormat: "ADDRESS_FORMAT_ETHEREUM",
+        },
+      ],
+    },
+  });
+  setStatusString("Successfully added wallet to passkey");
+  const address = res.activity.result.createWalletResult?.addresses[0];
+  if (!address) {
+    throw new Error("No address found");
+  }
+  const account = await createTurnkeyAccount(address, subOrgId);
+  return { address, account };
+};
diff --git a/utils/passkeys/create-passkey.ts b/utils/passkeys/create-passkey.ts
new file mode 100644
index 000000000..edbd594d2
--- /dev/null
+++ b/utils/passkeys/create-passkey.ts
@@ -0,0 +1,96 @@
+import {
+  createPasskey,
+  isSupported,
+} from "@turnkey/react-native-passkey-stamper";
+import { Buffer } from "buffer";
+import { RPID } from "./passkeys.constants";
+import { TurnkeyStoreInfo } from "./passkeys.interfaces";
+import { createTurnkeyAccount } from "./create-turnkey-account";
+import { savePasskeyInfo } from "./persist-passkeys";
+import { createSubOrganization } from "./create-suborganization";
+
+type PasskeyCreateParams = {
+  passkeyName: string;
+  setStatusString: (statusString: string) => void;
+  setPreviousPasskeyName: (passkeyName: string) => void;
+  setTurnkeyInfo: (turnkeyInfo: TurnkeyStoreInfo) => void;
+};
+
+export async function onPasskeyCreate({
+  passkeyName,
+  setStatusString,
+  setPreviousPasskeyName,
+  setTurnkeyInfo,
+}: PasskeyCreateParams) {
+  try {
+    setStatusString("Creating passkey...");
+
+    const { authenticatorParams, userId } =
+      await createUserPasskey(passkeyName);
+
+    setPreviousPasskeyName(passkeyName);
+    setStatusString("Passkey creation successful. Creating sub-org...");
+
+    const { walletId, subOrganizationId, address } =
+      await createSubOrganization(authenticatorParams);
+    savePasskeyInfo({
+      userId,
+      walletId,
+      subOrganizationId,
+      address,
+      passkeyName,
+    });
+    if (!address) {
+      throw new Error("No address found");
+    }
+
+    setTurnkeyInfo({
+      walletId,
+      subOrganizationId,
+      address,
+    });
+    setStatusString("Sub-org created! Creating turnkey account...");
+
+    const turnkeyAccount = await createTurnkeyAccount(
+      address,
+      subOrganizationId!
+    );
+    setStatusString(`Turnkey account created! Address is ${address}`);
+    return turnkeyAccount;
+  } catch (e) {
+    console.error("error during passkey creation", e);
+    throw e;
+  }
+}
+
+const createUserPasskey = async (passkeyName: string) => {
+  if (!isSupported()) {
+    alert("Passkeys are not supported on this device");
+  }
+
+  const humanReadableDate = new Date().toISOString();
+  // ID isn't visible by users, but needs to be random enough and valid base64 (for Android)
+  const userId = Buffer.from(String(Date.now())).toString("base64");
+  const authenticatorParams = await createPasskey({
+    // This doesn't matter much, it will be the name of the authenticator persisted on the Turnkey side.
+    // Won't be visible by default.
+    authenticatorName: "End-User Passkey",
+    rp: {
+      id: RPID,
+      name: "Passkey App",
+    },
+    user: {
+      id: userId,
+      // ...but name and display names are
+      // We insert a human-readable date time for ease of use
+      name: passkeyName + " " + humanReadableDate,
+      displayName: passkeyName + " " + humanReadableDate,
+    },
+    authenticatorSelection: {
+      residentKey: "required",
+      requireResidentKey: true,
+      userVerification: "preferred",
+    },
+  });
+  return { authenticatorParams, userId };
+};
diff --git a/utils/passkeys/create-suborganization.ts b/utils/passkeys/create-suborganization.ts
new file mode 100644
index 000000000..f60dc891f
--- /dev/null
+++ b/utils/passkeys/create-suborganization.ts
@@ -0,0 +1,9 @@
+import { createPasskey } from "@turnkey/react-native-passkey-stamper";
+import { createTurnkeySubOrganization } from "../api";
+
+export async function createSubOrganization(
+  authenticatorParams: Awaited<ReturnType<typeof createPasskey>>
+) {
+  const res = await createTurnkeySubOrganization(authenticatorParams);
+  return res;
+}
diff --git a/utils/passkeys/create-turnkey-account.ts b/utils/passkeys/create-turnkey-account.ts
new file mode 100644
index 000000000..cfc4e4a98
--- /dev/null
+++ b/utils/passkeys/create-turnkey-account.ts
@@ -0,0 +1,42 @@
+import { PasskeyStamper } from "@turnkey/react-native-passkey-stamper";
+import { RPID } from "./passkeys.constants";
+import { TurnkeyClient } from "@turnkey/http";
+import { createAccount } from "@turnkey/viem";
+import { getTurnkeyClient, setTurnkeyClient } from "./turnkey-clients";
+
+/**
+ * Creates a Viem account from Turnkey given sub-organization ID and address.
+ * @param address - The Ethereum address to create the account for.
+ * @param subOrganizationId - The sub-organization ID to create the account for.
+ * @returns The created Turnkey account.
+ */
+export const createTurnkeyAccount = async (
+  address: string,
+  subOrganizationId: string
+) => {
+  try {
+    let client = getTurnkeyClient(subOrganizationId);
+    if (!client) {
+      const stamper = new PasskeyStamper({
+        rpId: RPID,
+      });
+      client = new TurnkeyClient(
+        { baseUrl: "https://api.turnkey.com" },
+        stamper
+      );
+      setTurnkeyClient(subOrganizationId, client);
+    }
+
+    const account = await createAccount({
+      client,
+      organizationId: subOrganizationId,
+      signWith: address,
+      ethereumAddress: address,
+    });
+
+    return account;
+  } catch (e) {
+    console.error("error during turnkey account creation", e);
+    throw e;
+  }
+};
diff --git a/utils/passkeys/createPasskey.ts b/utils/passkeys/createPasskey.ts
deleted file mode 100644
index 2368181ad..000000000
--- a/utils/passkeys/createPasskey.ts
+++ /dev/null
@@ -1,144 +0,0 @@
-import {
-  PasskeyStamper,
-  createPasskey,
-  isSupported,
-} from "@turnkey/react-native-passkey-stamper";
-import { TurnkeyClient } from "@turnkey/http";
-import { Buffer } from "buffer";
-import { createAccount } from "@turnkey/viem";
-import { createTurnkeySubOrganization } from "../api";
-
-const RPID = "dev.converse.xyz";
-
-export async function onPasskeyCreate(passkeyName: string) {
-  if (!isSupported()) {
-    alert("Passkeys are not supported on this device");
-  }
-
-  try {
-    const authenticatorParams = await createUserPasskey(passkeyName);
-    console.log("passkey registration succeeded: ", authenticatorParams);
-    const { walletId, subOrganizationId, address } =
-      await createSubOrganization(authenticatorParams);
-    alert(`Sub-org created! Your address: ${address}`);
-    if (!address) {
-      throw new Error("No address found");
-    }
-
-    const turnkeyAccount = await createTurnkeyAccount(
-      address,
-      subOrganizationId!
-    );
-    console.log({
-      address,
-      subOrganizationId,
-    });
-    return turnkeyAccount;
-  } catch (e) {
-    console.error("error during passkey creation", e);
-  }
-}
-
-const createUserPasskey = async (passkeyName: string) => {
-  // ID isn't visible by users, but needs to be random enough and valid base64 (for Android)
-  const userId = Buffer.from(String(Date.now())).toString("base64");
-  const authenticatorParams = await createPasskey({
-    // This doesn't matter much, it will be the name of the authenticator persisted on the Turnkey side.
-    // Won't be visible by default.
-    authenticatorName: "End-User Passkey",
-    rp: {
-      id: RPID,
-      name: "Passkey App",
-    },
-    user: {
-      id: userId,
-      // ...but name and display names are
-      // We insert a human-readable date time for ease of use
-      name: passkeyName,
-      displayName: passkeyName,
-    },
-    authenticatorSelection: {
-      residentKey: "required",
-      requireResidentKey: true,
-      userVerification: "preferred",
-    },
-  });
-  return authenticatorParams;
-};
-
-export async function getWhoami() {
-  const stamper = await new PasskeyStamper({
-    rpId: RPID,
-  });
-  const client = new TurnkeyClient(
-    { baseUrl: "https://api.turnkey.com" },
-    stamper
-  );
-  if (!client) {
-    throw new Error("No client found");
-  }
-  const getWhoamiResult = await client.getWhoami({
-    organizationId: "ORG_ID",
-  });
-  const wallets = await client.getWallets({
-    organizationId: getWhoamiResult.organizationId,
-  });
-  console.log("wallets", wallets);
-  alert(
-    `Successfully logged into sub-organization ${getWhoamiResult.organizationId} with wallet ${getWhoamiResult.userId}`
-  );
-}
-
-export async function onPasskeySignature() {
-  try {
-    const stamper = await new PasskeyStamper({
-      rpId: RPID,
-    });
-    const client = new TurnkeyClient(
-      { baseUrl: "https://api.turnkey.com" },
-      stamper
-    );
-    if (!client) {
-      throw new Error("No client found");
-    }
-    const subOrg = "TODO";
-    const address = "TODO";
-    const wallet = await createTurnkeyAccount(address, subOrg);
-    console.log("wallet", wallet);
-    return wallet;
-  } catch (e) {
-    console.error("error during passkey signature", e);
-  }
-}
-
-async function createSubOrganization(
-  authenticatorParams: Awaited<ReturnType<typeof createPasskey>>
-) {
-  const res = await createTurnkeySubOrganization(authenticatorParams);
-  return res;
-}
-
-const createTurnkeyAccount = async (
-  address: string,
-  subOrganizationId: string
-) => {
-  try {
-    const stamper = await new PasskeyStamper({
-      rpId: RPID,
-    });
-    const client = new TurnkeyClient(
-      { baseUrl: "https://api.turnkey.com" },
-      stamper
-    );
-    const account = await createAccount({
-      client,
-      organizationId: subOrganizationId,
-      signWith: address,
-      ethereumAddress: address,
-    });
-    return account;
-  } catch (e) {
-    console.error("error during turnkey account creation", e);
-    throw e;
-  }
-};
diff --git a/utils/passkeys/load-client-from-passkey.ts b/utils/passkeys/load-client-from-passkey.ts
new file mode 100644
index 000000000..89c87e568
--- /dev/null
+++ b/utils/passkeys/load-client-from-passkey.ts
@@ -0,0 +1,48 @@
+import { Passkey } from "react-native-passkey";
+import { RPID } from "./passkeys.constants";
+import { loadPasskeyInfo } from "./persist-passkeys";
+import { createTurnkeyAccount } from "./create-turnkey-account";
+import { TurnkeyStoreInfo } from "./passkeys.interfaces";
+
+type LoadAccountFromPasskeyParams = {
+  setStatusString: (statusString: string) => void;
+  setPreviousPasskeyName: (passkeyName: string) => void;
+  setTurnkeyInfo: (turnkeyInfo: TurnkeyStoreInfo) => void;
+};
+
+export const loadAccountFromPasskey = async ({
+  setStatusString,
+  setPreviousPasskeyName,
+  setTurnkeyInfo,
+}: LoadAccountFromPasskeyParams) => {
+  try {
+    setStatusString("Loading passkey...");
+
+    const passkey = await Passkey.get({
+      rpId: RPID,
+      challenge: "TODO",
+      userVerification: "preferred",
+    });
+
+    const passkeyInfo = loadPasskeyInfo(passkey.response.userHandle);
+    if (!passkeyInfo) {
+      throw new Error("No passkey info found");
+    }
+    setStatusString("Creating account...");
+    setPreviousPasskeyName(passkeyInfo.passkeyName);
+    setTurnkeyInfo({
+      subOrganizationId: passkeyInfo.subOrganizationId,
+      walletId: passkeyInfo.walletId,
+      address: passkeyInfo.address,
+    });
+    const account = await createTurnkeyAccount(
+      passkeyInfo.address,
+      passkeyInfo.subOrganizationId
+    );
+    setStatusString("Account created");
+    return { account, turnkeyInfo: passkeyInfo };
+  } catch (e) {
+    console.error("error during passkey load", e);
+    throw e;
+  }
+};
diff --git a/utils/passkeys/passkeys.constants.ts b/utils/passkeys/passkeys.constants.ts
new file mode 100644
index 000000000..8641627b9
--- /dev/null
+++ b/utils/passkeys/passkeys.constants.ts
@@ -0,0 +1,2 @@
+export const RPID = "dev.converse.xyz";
+export const PASSKEY_INFO_KEY_STORAGE_PREFIX = "passkeyInfo-";
diff --git a/utils/passkeys/passkeys.interfaces.ts b/utils/passkeys/passkeys.interfaces.ts
new file mode 100644
index 000000000..609061f6d
--- /dev/null
+++ b/utils/passkeys/passkeys.interfaces.ts
@@ -0,0 +1,28 @@
+import { LocalAccount } from "viem/accounts";
+
+export type TurnkeyStoreInfo = {
+  subOrganizationId: string;
+  walletId: string;
+  address: string;
+};
+
+export type PasskeyState = {
+  loading: boolean;
+  error: string | null;
+  statusString: string | null;
+  account: LocalAccount | null;
+  turnkeyInfo: TurnkeyStoreInfo | null;
+  previousPasskeyName: string | null;
+};
+
+export type PasskeySetStateCallback = React.Dispatch<
+  React.SetStateAction<PasskeyState>
+>;
+
+export type PersistedPasskeyInfo = {
+  userId: string;
+  walletId: string;
+  subOrganizationId: string;
+  address: string;
+  passkeyName: string;
+};
diff --git a/utils/passkeys/persist-passkeys.ts b/utils/passkeys/persist-passkeys.ts
new file mode 100644
index 000000000..b2ab3ab63
--- /dev/null
+++ b/utils/passkeys/persist-passkeys.ts
@@ -0,0 +1,19 @@
+import mmkv from "../mmkv";
+import { PASSKEY_INFO_KEY_STORAGE_PREFIX } from "./passkeys.constants";
+import { PersistedPasskeyInfo } from "./passkeys.interfaces";
+
+const getPasskeyInfoKey = (userId: string) => {
+  return `${PASSKEY_INFO_KEY_STORAGE_PREFIX}-${userId}`;
+};
+
+export const savePasskeyInfo = (passkeyInfo: PersistedPasskeyInfo) => {
+  const passkeyInfoString = JSON.stringify(passkeyInfo);
+  mmkv.set(getPasskeyInfoKey(passkeyInfo.userId), passkeyInfoString);
+};
+
+export const loadPasskeyInfo = (userId: string) => {
+  const passkeyInfoString = mmkv.getString(getPasskeyInfoKey(userId));
+  return passkeyInfoString
+    ? (JSON.parse(passkeyInfoString) as PersistedPasskeyInfo)
+    : null;
+};
diff --git a/utils/passkeys/turnkey-clients.ts b/utils/passkeys/turnkey-clients.ts
new file mode 100644
index 000000000..9ba14a31d
--- /dev/null
+++ b/utils/passkeys/turnkey-clients.ts
@@ -0,0 +1,14 @@
+import { TurnkeyClient } from "@turnkey/http";
+
+export const turnkeyClientMap: Record<string, TurnkeyClient> = {};
+
+export const getTurnkeyClient = (subOrgId: string) => {
+  return turnkeyClientMap[subOrgId];
+};
+
+export const setTurnkeyClient = (
+  subOrgId: string,
+  turnkeyClient: TurnkeyClient
+) => {
+  turnkeyClientMap[subOrgId] = turnkeyClient;
+};
diff --git a/utils/xmtpRN/signIn.ts b/utils/xmtpRN/signIn.ts
index efe275928..b30441ee4 100644
--- a/utils/xmtpRN/signIn.ts
+++ b/utils/xmtpRN/signIn.ts
@@ -9,7 +9,9 @@ import logger from "@utils/logger";
 import { Client } from "@xmtp/react-native-sdk";
 import { Signer } from "ethers";
 import { isClientInstallationValid } from "./client";
-import { ethersSignerToXmtpSigner } from "./signer";
+import { ethersSignerToXmtpSigner, viemAccountToXmtpSigner } from "./signer";
+import { LocalAccount } from "viem/accounts";
+
 import config from "../../config";
 
 const env = config.xmtpEnv as "dev" | "production" | "local";
@@ -66,3 +68,53 @@ export const createXmtpClientFromSigner = async (
   );
   logger.debug("Dropped client databases");
 };
+
+export const createXmtpClientFromViemAccount = async (
+  account: LocalAccount,
+  onInstallationRevoked: () => Promise<void>,
+  preAuthenticateToInboxCallback?: () => Promise<void>
+) => {
+  const tempDirectory = await createTemporaryDirectory();
+  const dbEncryptionKey = await getDbEncryptionKey();
+
+  const options = {
+    env,
+    enableV3: true,
+    dbDirectory: tempDirectory,
+    dbEncryptionKey,
+  };
+  const inboxId = await getInboxId(await account.address);
+
+  await copyDatabasesToTemporaryDirectory(tempDirectory, inboxId);
+
+  logger.debug("Instantiating client from signer");
+
+  const client = await Client.create(viemAccountToXmtpSigner(account), {
+    ...options,
+    preAuthenticateToInboxCallback,
+  });
+
+  if (client.inboxId !== inboxId) {
+    throw new Error("Inbox ids don't match");
+  }
+
+  // In case we're logging with an existing libxmtp database, make sure
+  // the installation has not already been revoked
+  const installationValid = await isClientInstallationValid(client);
+  if (!installationValid) {
+    await client.dropLocalDatabaseConnection();
+    await deleteLibXmtpDatabaseForInboxId(inboxId);
+    onInstallationRevoked();
+    return;
+  }
+
+  logger.debug("Instantiated client from signer");
+  // This Client is only be used to extract the key, we can disconnect
+  // it to prevent locks happening during Onboarding
+  await client.dropLocalDatabaseConnection();
+  await moveTemporaryDatabasesToDatabaseDirectory(
+    tempDirectory,
+    client.inboxId
+  );
+  logger.debug("Dropped client databases");
+};
diff --git a/utils/xmtpRN/signer.ts b/utils/xmtpRN/signer.ts
index 3afe2d98a..0c4229ae9 100644
--- a/utils/xmtpRN/signer.ts
+++ b/utils/xmtpRN/signer.ts
@@ -14,12 +14,12 @@ export const ethersSignerToXmtpSigner = (
   signMessage: (message: string) => signer.signMessage(message),
 });
 
-export const viemSignerToXmtpSigner = (
-  signer: LocalAccount<any>
+export const viemAccountToXmtpSigner = (
+  account: LocalAccount<any>
 ): XmtpSigner => ({
-  getAddress: () => Promise.resolve(signer.address),
+  getAddress: () => Promise.resolve(account.address),
   getChainId: () => ethereum.id, // We don't really care about the chain id because we support https://eips.ethereum.org/EIPS/eip-6492
   getBlockNumber: () => undefined,
   walletType: () => "SCW",
-  signMessage: (message: string) => signer.signMessage({ message }),
+  signMessage: (message: string) => account.signMessage({ message }),
 });