feat: Show eoa address when auth is privy

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@breadcoop/ui",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "A component library for implementing Bread Coop branding in JS/TS projects",
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",

src/components/connected-user/privy-provider.tsx

@@ -16,52 +16,67 @@ export function ConnectedUserProviderPrivy({
   chainId,
   children,
 }: IConnectedUserProviderPrivyProps) {
-  const { ready, authenticated } = usePrivy();
+  const { ready, authenticated, user: privyUser } = usePrivy();
   const { wallets } = useWallets();
   const configuredChains = useChains();
 
+  const accountAddress = privyUser?.wallet?.address;
+
+  const connectedWallet = useMemo(
+		() =>
+			accountAddress
+				? wallets.find(
+						(w) =>
+							w.address.toLowerCase() ===
+							accountAddress.toLowerCase(),
+					)
+				: undefined,
+		[wallets, accountAddress],
+  );
+
   const defaultChain = useMemo(
     () => configuredChains.find(c => c.id === chainId) ?? configuredChains[0],
     [configuredChains, chainId]
   );
 
-  const embeddedWallet = useMemo(() => {
-    return wallets.find(
-      (wallet) =>
-        wallet.walletClientType === "privy" ||
-        wallet.walletClientType === "embedded_wallet" ||
-        wallet.walletClientType?.includes("embedded")
-    );
-  }, [wallets]);
-
   const user = useMemo<TConnectedUserState>(() => {
-    if (!ready) return { status: "LOADING" };
+		if (!ready) return { status: "LOADING" };
 
-    if (!authenticated || !embeddedWallet?.address) {
-      return { status: "NOT_CONNECTED" };
-    }
+		if (!authenticated || !accountAddress) {
+			return { status: "NOT_CONNECTED" };
+		}
 
-    const address = embeddedWallet.address as Hex;
-    const walletChainId = embeddedWallet.chainId;
-    const parsedChainId = walletChainId ? parseInt(walletChainId.split(":")[1]) : undefined;
+		const address = accountAddress as Hex;
+		const walletChainId = connectedWallet?.chainId;
+		const parsedChainId = walletChainId
+			? parseInt(walletChainId.split(":")[1])
+			: undefined;
 
-    const _status: TUserConnected["status"] =
-      parsedChainId === chainId ? "CONNECTED" : "UNSUPPORTED_CHAIN";
+		const _status: TUserConnected["status"] =
+			parsedChainId === chainId ? "CONNECTED" : "UNSUPPORTED_CHAIN";
 
-    const chain =
-      configuredChains.find(c => c.id === parsedChainId) ?? defaultChain;
+		const chain =
+			configuredChains.find((c) => c.id === parsedChainId) ??
+			defaultChain;
 
-    return {
-      status: _status,
-      address,
-      chain,
-    };
-  }, [ready, authenticated, embeddedWallet, chainId, configuredChains, defaultChain]);
+		return {
+			status: _status,
+			address,
+			chain,
+		};
+  }, [
+		ready,
+		authenticated,
+		accountAddress,
+		connectedWallet,
+		chainId,
+		configuredChains,
+		defaultChain,
+  ]);
 
-  // Embedded wallets are never Safe wallets
   const isSafe = useMemo(() => {
-    return embeddedWallet?.walletClientType === "safe" || false;
-  }, [embeddedWallet]);
+		return connectedWallet?.walletClientType === "safe" || false;
+  }, [connectedWallet]);
 
   const value = useMemo(() => ({ user, isSafe }), [user, isSafe]);
 

src/components/navbar/account-section.tsx

@@ -1,10 +1,10 @@
 "use client";
 
 import { useAccount, useEnsName } from "wagmi";
-import { usePrivy, useWallets } from "@privy-io/react-auth";
+import { usePrivy } from "@privy-io/react-auth";
 import { App } from "../../interface/app";
 import { LoginButton } from "../auth";
-import { useConnectedUser } from "../connected-user";
+import { TUserConnected, useConnectedUser } from "../connected-user";
 import AccountMenu from "./account-menu";
 import { SignInIcon } from "@phosphor-icons/react/dist/ssr";
 import { NavAccountDetailsProps } from "./account-widget";
@@ -32,20 +32,14 @@ const AccountSection = ({ app, widgetItems, actionItems }: AccountSectionProps)
 
 	// Privy hooks
 	const { ready: privyReady } = usePrivy();
-	const { wallets } = useWallets();
 
 	// Determine which address and ENS to use
 	const { address, ensNameResult } = useMemo(() => {
 		if (authProvider === "privy") {
-			const activeWallet = wallets.find(
-				(wallet) =>
-					wallet.walletClientType === "privy" ||
-					wallet.walletClientType === "embedded_wallet" ||
-					wallet.walletClientType?.includes("embedded"),
-			);
+			const connectedUser = user as TUserConnected;
 
 			return {
-				address: activeWallet?.address as Address | undefined,
+				address: connectedUser?.address as Address | undefined,
 				ensNameResult: {
 					data: undefined,
 					isLoading: !privyReady,
@@ -59,7 +53,7 @@ const AccountSection = ({ app, widgetItems, actionItems }: AccountSectionProps)
 			address: wagmiAddress,
 			ensNameResult: wagmiEnsName,
 		};
-	}, [authProvider, wallets, privyReady, wagmiAddress, wagmiEnsName]);
+	}, [authProvider, user, privyReady, wagmiAddress, wagmiEnsName]);
 
 	if (user.status === "CONNECTED" && address) {
 		return (