wip on integrating with connect

Author: pcarranzav

apps/connect/src/routes/authenticate.tsx

@@ -154,6 +154,7 @@ function AuthenticateComponent() {
           {
             headers: {
               'privy-id-token': identityToken,
+              'account-address': accountAddress,
               'Content-Type': 'application/json',
             },
           },
@@ -274,6 +275,7 @@ function AuthenticateComponent() {
       {
         headers: {
           'privy-id-token': identityToken,
+          'account-address': accountAddress,
           'Content-Type': 'application/json',
         },
         method: 'POST',
@@ -357,6 +359,7 @@ function AuthenticateComponent() {
       const response = await fetch(`${import.meta.env.VITE_HYPERGRAPH_SYNC_SERVER_ORIGIN}/connect/app-identity`, {
         headers: {
           'privy-id-token': identityToken,
+          'account-address': accountAddress,
           'Content-Type': 'application/json',
         },
         method: 'POST',

apps/connect/src/routes/login.lazy.tsx

@@ -1,9 +1,11 @@
 import { Button } from '@/components/ui/button';
-import { Connect, type Identity } from '@graphprotocol/hypergraph';
-import { useIdentityToken, usePrivy, useWallets } from '@privy-io/react-auth';
+import { Connect, type Identity, StoreConnect } from '@graphprotocol/hypergraph';
+import { GEOGENESIS, GEO_TESTNET } from '@graphprotocol/hypergraph/connect/smart-account';
+import { type ConnectedWallet, useIdentityToken, usePrivy, useWallets } from '@privy-io/react-auth';
 import { createLazyFileRoute, useRouter } from '@tanstack/react-router';
+import { useSelector } from 'node_modules/@xstate/store/dist/declarations/src/react';
 import { useCallback, useEffect, useState } from 'react';
-import { createWalletClient, custom, getAddress } from 'viem';
+import { type WalletClient, createWalletClient, custom } from 'viem';
 import { mainnet } from 'viem/chains';
 
 const syncServerUri = import.meta.env.VITE_HYPERGRAPH_SYNC_SERVER_ORIGIN;
@@ -21,18 +23,35 @@ function Login() {
   const { identityToken } = useIdentityToken();
 
   const hypergraphLogin = useCallback(
-    async (signer: Identity.Signer) => {
-      if (!signer || !identityToken) {
+    async (walletClient: WalletClient, embeddedWallet: ConnectedWallet) => {
+      if (!identityToken) {
         return;
       }
+      const signer: Identity.Signer = {
+        getAddress: async () => {
+          const [address] = await walletClient.getAddresses();
+          return address;
+        },
+        signMessage: async (message: string) => {
+          if (embeddedWallet.walletClientType === 'privy') {
+            const { signature } = await signMessage({ message });
+            return signature;
+          }
+          const [address] = await walletClient.getAddresses();
+          return await walletClient.signMessage({ account: address, message });
+        },
+      };
+
       const address = await signer.getAddress();
       if (!address) {
         return;
       }
-      const accountAddress = getAddress(address);
-      await Connect.login(signer, accountAddress, syncServerUri, storage, identityToken);
+      const chain = import.meta.env.VITE_HYPERGRAPH_CHAIN === 'geogenesis' ? GEOGENESIS : GEO_TESTNET;
+      const rpcUrl = import.meta.env.VITE_HYPERGRAPH_RPC_URL;
+
+      await Connect.login({ walletClient, signer, syncServerUri, storage, identityToken, rpcUrl, chain });
     },
-    [identityToken],
+    [identityToken, signMessage],
   );
 
   useEffect(() => {
@@ -52,22 +71,7 @@ function Login() {
             transport: custom(privyProvider),
           });
 
-          const signer: Identity.Signer = {
-            getAddress: async () => {
-              const [address] = await walletClient.getAddresses();
-              return address;
-            },
-            signMessage: async (message: string) => {
-              if (embeddedWallet.walletClientType === 'privy') {
-                const { signature } = await signMessage({ message });
-                return signature;
-              }
-              const [address] = await walletClient.getAddresses();
-              return await walletClient.signMessage({ account: address, message });
-            },
-          };
-
-          await hypergraphLogin(signer);
+          await hypergraphLogin(walletClient, embeddedWallet);
           navigate({ to: '/' });
         } catch (error) {
           alert('Failed to login');

packages/hypergraph/src/identity/abis.ts packages/hypergraph/src/connect/abis.tspackages/hypergraph/src/identity/abis.ts renamed to packages/hypergraph/src/connect/abis.ts

@@ -1,3 +1,8 @@
+import mainVotingAbi from './abis/MainVotingPlugin.json' with { type: 'json' };
+import personalSpaceAdminAbi from './abis/PersonalSpaceAdminPlugin.json' with { type: 'json' };
+
+export { mainVotingAbi, personalSpaceAdminAbi };
+
 // Simplified ABI for the Safe Module Manager with the functions we need
 export const safeModuleManagerAbi = [
   {
@@ -155,8 +160,3 @@ export const daoFactoryAbi = [
     type: 'function',
   },
 ] as const;
-
-import mainVotingAbi from './abis/MainVotingPlugin.json' with { type: 'json' };
-import personalSpaceAdminAbi from './abis/PersonalSpaceAdminPlugin.json' with { type: 'json' };
-
-export { mainVotingAbi, personalSpaceAdminAbi };

…/src/identity/abis/MainVotingPlugin.json …h/src/connect/abis/MainVotingPlugin.jsonpackages/hypergraph/src/identity/abis/MainVotingPlugin.json renamed to packages/hypergraph/src/connect/abis/MainVotingPlugin.json packages/hypergraph/src/identity/abis/MainVotingPlugin.json renamed to packages/hypergraph/src/connect/abis/MainVotingPlugin.json

@@ -67,7 +67,6 @@ const signatureMessage = (nonce: Uint8Array): string => {
 
 export const encryptIdentity = async (
   signer: Signer,
-  accountAddress: string,
   keys: IdentityKeys,
 ): Promise<{ ciphertext: string; nonce: string }> => {
   const nonce = randomBytes(32);
@@ -76,7 +75,7 @@ export const encryptIdentity = async (
 
   // Check that the signature is valid
   const valid = await verifyMessage({
-    address: accountAddress as Hex,
+    address: (await signer.getAddress()) as Hex,
     message,
     signature,
   });
@@ -97,18 +96,13 @@ export const encryptIdentity = async (
   return { ciphertext, nonce: bytesToHex(nonce) };
 };
 
-export const decryptIdentity = async (
-  signer: Signer,
-  accountAddress: string,
-  ciphertext: string,
-  nonce: string,
-): Promise<IdentityKeys> => {
+export const decryptIdentity = async (signer: Signer, ciphertext: string, nonce: string): Promise<IdentityKeys> => {
   const message = signatureMessage(hexToBytes(nonce));
   const signature = (await signer.signMessage(message)) as Hex;
 
   // Check that the signature is valid
   const valid = await verifyMessage({
-    address: accountAddress as Hex,
+    address: (await signer.getAddress()) as Hex,
     message,
     signature,
   });
@@ -152,7 +146,7 @@ export const encryptAppIdentity = async (
 
   // Check that the signature is valid
   const valid = await verifyMessage({
-    address: accountAddress as Hex,
+    address: (await signer.getAddress()) as Hex,
     message,
     signature,
   });
@@ -163,6 +157,7 @@ export const encryptAppIdentity = async (
   // We use a simple plaintext encoding:
   // Hex keys separated by newlines
   const keysTxt = [
+    accountAddress,
     keys.encryptionPublicKey,
     keys.encryptionPrivateKey,
     keys.signaturePublicKey,
@@ -214,6 +209,7 @@ export const decryptAppIdentity = async (
   }
   const keysTxt = new TextDecoder().decode(keysMsg);
   const [
+    accountAddress,
     encryptionPublicKey,
     encryptionPrivateKey,
     signaturePublicKey,
@@ -222,6 +218,7 @@ export const decryptAppIdentity = async (
     appIdentityAddressPrivateKey,
   ] = keysTxt.split('\n');
   return {
+    accountAddress,
     encryptionPublicKey,
     encryptionPrivateKey,
     signaturePublicKey,

…ntity/abis/PersonalSpaceAdminPlugin.json …nnect/abis/PersonalSpaceAdminPlugin.jsonpackages/hypergraph/src/identity/abis/PersonalSpaceAdminPlugin.json renamed to packages/hypergraph/src/connect/abis/PersonalSpaceAdminPlugin.json packages/hypergraph/src/identity/abis/PersonalSpaceAdminPlugin.json renamed to packages/hypergraph/src/connect/abis/PersonalSpaceAdminPlugin.json

@@ -7,4 +7,5 @@ export * from './login.js';
 export * from './parse-auth-params.js';
 export * from './parse-callback-params.js';
 export * from './prove-ownership.js';
+export * from './smart-account.js';
 export * from './types.js';

packages/hypergraph/src/connect/identity-encryption.ts

@@ -1,11 +1,12 @@
 import * as Schema from 'effect/Schema';
-import type { Address } from 'viem';
+import type { Address, Chain, Hex, WalletClient } from 'viem';
 import * as Messages from '../messages/index.js';
 import { store } from '../store-connect.js';
-import { storeAccountAddress, storeKeys } from './auth-storage.js';
+import { loadAccountAddress, storeAccountAddress, storeKeys } from './auth-storage.js';
 import { createIdentityKeys } from './create-identity-keys.js';
 import { decryptIdentity, encryptIdentity } from './identity-encryption.js';
 import { proveIdentityOwnership } from './prove-ownership.js';
+import { getSmartAccountWalletClient } from './smart-account.js';
 import type { IdentityKeys, Signer, Storage } from './types.js';
 
 export async function identityExists(accountAddress: string, syncServerUri: string) {
@@ -23,11 +24,11 @@ export async function signup(
   identityToken: string,
 ) {
   const keys = createIdentityKeys();
-  const { ciphertext, nonce } = await encryptIdentity(signer, accountAddress, keys);
+  const { ciphertext, nonce } = await encryptIdentity(signer, keys);
   const { accountProof, keyProof } = await proveIdentityOwnership(signer, accountAddress, keys);
 
   const req: Messages.RequestConnectCreateIdentity = {
-    keyBox: { accountAddress, ciphertext, nonce },
+    keyBox: { signer: await signer.getAddress(), accountAddress, ciphertext, nonce },
     accountProof,
     keyProof,
     signaturePublicKey: keys.signaturePublicKey,
@@ -49,7 +50,6 @@ export async function signup(
   if (!decoded.success) {
     throw new Error('Error creating identity');
   }
-  storeAccountAddress(storage, accountAddress);
   storeKeys(storage, accountAddress, keys);
 
   return {
@@ -69,6 +69,7 @@ export async function restoreKeys(
     method: 'POST',
     headers: {
       'privy-id-token': identityToken,
+      'account-address': accountAddress,
       'Content-Type': 'application/json',
     },
   });
@@ -77,7 +78,7 @@ export async function restoreKeys(
     const decoded = Schema.decodeUnknownSync(Messages.ResponseIdentityEncrypted)(await res.json());
     const { keyBox } = decoded;
     const { ciphertext, nonce } = keyBox;
-    const keys = await decryptIdentity(signer, accountAddress, ciphertext, nonce);
+    const keys = await decryptIdentity(signer, ciphertext, nonce);
     storeKeys(storage, accountAddress, keys);
     return {
       accountAddress,
@@ -87,13 +88,37 @@ export async function restoreKeys(
   throw new Error(`Error fetching identity ${res.status}`);
 }
 
-export async function login(
-  signer: Signer,
-  accountAddress: Address,
-  syncServerUri: string,
-  storage: Storage,
-  identityToken: string,
-) {
+export async function login({
+  walletClient,
+  signer,
+  syncServerUri,
+  storage,
+  identityToken,
+  rpcUrl,
+  chain,
+}: {
+  walletClient: WalletClient;
+  signer: Signer;
+  syncServerUri: string;
+  storage: Storage;
+  identityToken: string;
+  rpcUrl: string;
+  chain: Chain;
+}) {
+  const accountAddressFromStorage = (loadAccountAddress(storage) as Hex) ?? undefined;
+  const smartAccountWalletClient = await getSmartAccountWalletClient({
+    owner: walletClient,
+    address: accountAddressFromStorage,
+    rpcUrl,
+    chain,
+  });
+  if (!smartAccountWalletClient.account) {
+    throw new Error('Smart account wallet client not found');
+  }
+  const accountAddress = smartAccountWalletClient.account.address;
+  if (accountAddressFromStorage === undefined) {
+    storeAccountAddress(storage, accountAddress);
+  }
   // const keys = loadKeys(storage, accountAddress);
   let authData: {
     accountAddress: Address;