@zerodev/wallet-react 0.0.1-alpha.14 → 0.0.1-alpha.16

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zerodev/wallet-react",
-  "version": "0.0.1-alpha.14",
+  "version": "0.0.1-alpha.16",
   "description": "React hooks for ZeroDev Wallet SDK",
   "sideEffects": false,
   "main": "./dist/_cjs/index.js",
@@ -30,7 +30,7 @@
     "wagmi": "^3.0.0",
     "zustand": "^5.0.3",
     "ox": "^0.3.0",
-    "@zerodev/wallet-core": "0.0.1-alpha.13"
+    "@zerodev/wallet-core": "0.0.1-alpha.15"
   },
   "devDependencies": {
     "@types/react": "^19",

package/src/actions.test.ts

@@ -569,7 +569,7 @@ describe('React Actions', () => {
       })
     })
 
-    it('completes full OAuth success flow', async () => {
+    it('completes full OAuth success flow with sessionId', async () => {
       const wallet = createMockWallet()
       wallet.getSession.mockResolvedValue({ id: 'oauth-session' })
       wallet.toAccount.mockResolvedValue({ address: '0xoauth' })
@@ -578,11 +578,14 @@ describe('React Actions', () => {
       const config = createMockConfig(connector)
 
       mockOpenOAuthPopup.mockReturnValue({ closed: false } as Window)
-      // Simulate the success callback being called immediately
+      // Simulate the success callback being called with sessionId
       mockListenForOAuthMessage.mockImplementation(
-        (_win: Window, _origin: string, onSuccess: () => void) => {
-          // Call onSuccess asynchronously to simulate real behavior
-          setTimeout(() => onSuccess(), 0)
+        (
+          _win: Window,
+          _origin: string,
+          onSuccess: (sessionId: string) => void,
+        ) => {
+          setTimeout(() => onSuccess('test-session-id'), 0)
           return () => {}
         },
       )
@@ -592,6 +595,7 @@ describe('React Actions', () => {
       expect(wallet.auth).toHaveBeenCalledWith({
         type: 'oauth',
         provider: 'google',
+        sessionId: 'test-session-id',
       })
       expect(store.getState().setEoaAccount).toHaveBeenCalledWith({
         address: '0xoauth',
@@ -611,8 +615,12 @@ describe('React Actions', () => {
 
       mockOpenOAuthPopup.mockReturnValue({ closed: false } as Window)
       mockListenForOAuthMessage.mockImplementation(
-        (_win: Window, _origin: string, onSuccess: () => void) => {
-          setTimeout(() => onSuccess(), 0)
+        (
+          _win: Window,
+          _origin: string,
+          onSuccess: (sessionId: string) => void,
+        ) => {
+          setTimeout(() => onSuccess('session-id'), 0)
           return () => {}
         },
       )
@@ -633,7 +641,7 @@ describe('React Actions', () => {
         (
           _win: Window,
           _origin: string,
-          _onSuccess: () => void,
+          _onSuccess: (sessionId: string) => void,
           onError: (error: Error) => void,
         ) => {
           setTimeout(() => onError(new Error('Window closed')), 0)

package/src/actions.ts

@@ -158,13 +158,13 @@ export async function authenticateOAuth(
     const cleanup = listenForOAuthMessage(
       authWindow,
       window.location.origin,
-      async () => {
+      async (sessionId) => {
         try {
           // Complete OAuth authentication with wallet-core
-          // The backend has stored the OAuth session in a cookie
           await wallet.auth({
             type: 'oauth',
             provider: parameters.provider,
+            sessionId,
           })
 
           const [session, eoaAccount] = await Promise.all([

package/src/connector.ts

@@ -16,6 +16,7 @@ import { getAAUrl } from './utils/aaUtils.js'
 // OAuth URL parameter used to detect callback
 const OAUTH_SUCCESS_PARAM = 'oauth_success'
 const OAUTH_PROVIDER_PARAM = 'oauth_provider'
+const OAUTH_SESSION_ID_PARAM = 'session_id'
 
 /**
  * Detect OAuth callback from URL params and handle it.
@@ -43,9 +44,10 @@ async function detectAndHandleOAuthCallback(
   console.log('OAuth callback detected, completing authentication...')
   const provider = (params.get(OAUTH_PROVIDER_PARAM) ||
     'google') as OAuthProvider
+  const sessionId = params.get(OAUTH_SESSION_ID_PARAM) || ''
 
   try {
-    await wallet.auth({ type: 'oauth', provider })
+    await wallet.auth({ type: 'oauth', provider, sessionId })
 
     const [session, eoaAccount] = await Promise.all([
       wallet.getSession(),
@@ -58,6 +60,7 @@ async function detectAndHandleOAuthCallback(
     // Clean up URL params
     params.delete(OAUTH_SUCCESS_PARAM)
     params.delete(OAUTH_PROVIDER_PARAM)
+    params.delete(OAUTH_SESSION_ID_PARAM)
     const newUrl = params.toString()
       ? `${window.location.pathname}?${params.toString()}`
       : window.location.pathname

package/src/oauth.test.ts

@@ -188,15 +188,35 @@ describe('OAuth utilities', () => {
       vi.useRealTimers()
     })
 
-    it('calls onSuccess when oauth_success message received', () => {
+    it('calls onSuccess with sessionId when oauth_success message received', () => {
       const cleanup = listenForOAuthMessage(
         mockWindow as Window,
         'https://app.example.com',
-        onSuccessMock as () => void,
+        onSuccessMock as (sessionId: string) => void,
+        onErrorMock as (error: Error) => void,
+      )
+
+      // Simulate receiving a message with sessionId
+      const event = new MessageEvent('message', {
+        data: { type: 'oauth_success', sessionId: 'test-session-123' },
+        origin: 'https://app.example.com',
+      })
+      window.dispatchEvent(event)
+
+      expect(onSuccessMock).toHaveBeenCalledOnce()
+      expect(onSuccessMock).toHaveBeenCalledWith('test-session-123')
+      expect(onErrorMock).not.toHaveBeenCalled()
+      cleanup()
+    })
+
+    it('calls onSuccess with empty string when sessionId is missing', () => {
+      const cleanup = listenForOAuthMessage(
+        mockWindow as Window,
+        'https://app.example.com',
+        onSuccessMock as (sessionId: string) => void,
         onErrorMock as (error: Error) => void,
       )
 
-      // Simulate receiving a message
       const event = new MessageEvent('message', {
         data: { type: 'oauth_success' },
         origin: 'https://app.example.com',
@@ -204,6 +224,7 @@ describe('OAuth utilities', () => {
       window.dispatchEvent(event)
 
       expect(onSuccessMock).toHaveBeenCalledOnce()
+      expect(onSuccessMock).toHaveBeenCalledWith('')
       expect(onErrorMock).not.toHaveBeenCalled()
       cleanup()
     })
@@ -212,7 +233,7 @@ describe('OAuth utilities', () => {
       const cleanup = listenForOAuthMessage(
         mockWindow as Window,
         'https://app.example.com',
-        onSuccessMock as () => void,
+        onSuccessMock as (sessionId: string) => void,
         onErrorMock as (error: Error) => void,
       )
 
@@ -232,7 +253,7 @@ describe('OAuth utilities', () => {
       const cleanup = listenForOAuthMessage(
         mockWindow as Window,
         'https://app.example.com',
-        onSuccessMock as () => void,
+        onSuccessMock as (sessionId: string) => void,
         onErrorMock as (error: Error) => void,
       )
 
@@ -251,7 +272,7 @@ describe('OAuth utilities', () => {
       const cleanup = listenForOAuthMessage(
         mockWindow as Window,
         'https://app.example.com',
-        onSuccessMock as () => void,
+        onSuccessMock as (sessionId: string) => void,
         onErrorMock as (error: Error) => void,
       )
 
@@ -268,7 +289,7 @@ describe('OAuth utilities', () => {
       const cleanup = listenForOAuthMessage(
         mockWindow as Window,
         'https://app.example.com',
-        onSuccessMock as () => void,
+        onSuccessMock as (sessionId: string) => void,
         onErrorMock as (error: Error) => void,
       )
 
@@ -288,7 +309,7 @@ describe('OAuth utilities', () => {
       const cleanup = listenForOAuthMessage(
         mockWindow as Window,
         'https://app.example.com',
-        onSuccessMock as () => void,
+        onSuccessMock as (sessionId: string) => void,
         onErrorMock as (error: Error) => void,
       )
 
@@ -323,7 +344,7 @@ describe('OAuth utilities', () => {
       const cleanup = listenForOAuthMessage(
         mockWindow as Window,
         'https://app.example.com',
-        onSuccessMock as () => void,
+        onSuccessMock as (sessionId: string) => void,
         onErrorMock as (error: Error) => void,
       )
 
@@ -345,7 +366,7 @@ describe('OAuth utilities', () => {
       const cleanup = listenForOAuthMessage(
         mockWindow as Window,
         'https://app.example.com',
-        onSuccessMock as () => void,
+        onSuccessMock as (sessionId: string) => void,
         onErrorMock as (error: Error) => void,
       )
 
@@ -391,7 +412,20 @@ describe('OAuth utilities', () => {
       window.close = originalClose
     })
 
-    it('returns true and posts success message on oauth_success=true', () => {
+    it('returns true and posts success message with sessionId on oauth_success=true', () => {
+      window.location.search = '?oauth_success=true&session_id=abc123'
+
+      const result = handleOAuthCallback()
+
+      expect(result).toBe(true)
+      expect(window.opener?.postMessage).toHaveBeenCalledWith(
+        { type: 'oauth_success', sessionId: 'abc123' },
+        'https://app.example.com',
+      )
+      expect(window.close).toHaveBeenCalled()
+    })
+
+    it('posts success message without sessionId when session_id param is missing', () => {
       window.location.search = '?oauth_success=true'
 
       const result = handleOAuthCallback()

package/src/oauth.ts

@@ -62,6 +62,7 @@ export function buildBackendOAuthUrl(params: BackendOAuthFlowParams): string {
 
 export type OAuthMessageData = {
   type: 'oauth_success' | 'oauth_error'
+  sessionId?: string
   error?: string
 }
 
@@ -72,7 +73,7 @@ export type OAuthMessageData = {
 export function listenForOAuthMessage(
   authWindow: Window,
   expectedOrigin: string,
-  onSuccess: () => void,
+  onSuccess: (sessionId: string) => void,
   onError: (error: Error) => void,
 ): () => void {
   let cleaned = false
@@ -84,7 +85,7 @@ export function listenForOAuthMessage(
 
     if (event.data.type === 'oauth_success') {
       cleanup()
-      onSuccess()
+      onSuccess(event.data.sessionId || '')
     } else if (event.data.type === 'oauth_error') {
       cleanup()
       onError(new Error(event.data.error || 'OAuth authentication failed'))
@@ -119,13 +120,13 @@ export function handleOAuthCallback(successParam = 'oauth_success'): boolean {
   const urlParams = new URLSearchParams(window.location.search)
   const isSuccess = urlParams.get(successParam) === 'true'
   const error = urlParams.get('error')
+  const sessionId = urlParams.get('session_id') ?? undefined
 
   if (window.opener) {
     if (isSuccess) {
-      window.opener.postMessage(
-        { type: 'oauth_success' } satisfies OAuthMessageData,
-        window.location.origin,
-      )
+      const message: OAuthMessageData = { type: 'oauth_success' }
+      if (sessionId) message.sessionId = sessionId
+      window.opener.postMessage(message, window.location.origin)
       window.close()
       return true
     }

package/src/provider.ts

@@ -187,7 +187,9 @@ export function createProvider({
 
           if (!account) throw new Error('Not authenticated')
 
-          return await account.signMessage({ message })
+          return await account.signMessage({
+            message: { raw: message as `0x${string}` },
+          })
         }
 
         case 'eth_signTypedData_v4': {