@0xsequence/connect 0.0.0-20250314205219

package/src/constants/transactions.ts

@@ -0,0 +1 @@
+export const TRANSACTION_CONFIRMATIONS_DEFAULT = 4

package/src/constants/version.ts

@@ -0,0 +1 @@
+export const WEB_SDK_VERSION = '0.0.0-20250314205219'

package/src/constants/walletLinking.ts

@@ -0,0 +1,2 @@
+// Chain doesn't matter for linking, we can just hardcode a common one
+export const CHAIN_ID_FOR_SIGNATURE = 137

package/src/contexts/Analytics.ts

@@ -0,0 +1,14 @@
+'use client'
+
+import { SequenceClient } from '@0xsequence/provider'
+import React from 'react'
+
+import { createGenericContext } from './genericContext'
+
+type AnalyticsContext = {
+  setAnalytics: React.Dispatch<React.SetStateAction<SequenceClient['analytics']>>
+  analytics: SequenceClient['analytics']
+}
+
+const [useAnalyticsContext, AnalyticsContextProvider] = createGenericContext<AnalyticsContext>()
+export { useAnalyticsContext, AnalyticsContextProvider }

package/src/contexts/ConnectConfig.ts

@@ -0,0 +1,7 @@
+'use client'
+
+import { ConnectConfig } from '../types'
+
+import { createGenericContext } from './genericContext'
+
+export const [useConnectConfigContext, ConnectConfigContextProvider] = createGenericContext<ConnectConfig>()

package/src/contexts/ConnectModal.ts

@@ -0,0 +1,13 @@
+'use client'
+
+import React from 'react'
+
+import { createGenericContext } from './genericContext'
+
+type ConnectModalContext = {
+  setOpenConnectModal: React.Dispatch<React.SetStateAction<boolean>>
+  openConnectModalState: boolean
+}
+
+const [useConnectModalContext, ConnectModalContextProvider] = createGenericContext<ConnectModalContext>()
+export { useConnectModalContext, ConnectModalContextProvider }

package/src/contexts/Theme.ts

@@ -0,0 +1,17 @@
+'use client'
+
+import { Theme } from '@0xsequence/design-system'
+import React from 'react'
+
+import { ModalPosition } from '../index'
+
+import { createGenericContext } from './genericContext'
+
+type ThemeContext = {
+  setTheme: React.Dispatch<React.SetStateAction<Theme>>
+  theme: Theme
+  position: ModalPosition
+  setPosition: React.Dispatch<React.SetStateAction<ModalPosition>>
+}
+
+export const [useThemeContext, ThemeContextProvider] = createGenericContext<ThemeContext>()

package/src/contexts/WalletConfig.ts

@@ -0,0 +1,13 @@
+'use client'
+
+import { DisplayedAsset } from '../types'
+
+import { createGenericContext } from './genericContext'
+
+type WalletConfigContext = {
+  setDisplayedAssets: React.Dispatch<React.SetStateAction<DisplayedAsset[]>>
+  displayedAssets: DisplayedAsset[]
+  readOnlyNetworks?: number[]
+}
+
+export const [useWalletConfigContext, WalletConfigContextProvider] = createGenericContext<WalletConfigContext>()

package/src/contexts/genericContext.ts

@@ -0,0 +1,19 @@
+import { useContext, createContext } from 'react'
+
+// https://medium.com/@rivoltafilippo/typing-react-context-to-avoid-an-undefined-default-value-2c7c5a7d5947
+
+export const createGenericContext = <T>() => {
+  // Create a context with a generic parameter or undefined
+  const genericContext = createContext<T | undefined>(undefined)
+
+  // Check if the value provided to the context is defined or throw an error
+  const useGenericContext = () => {
+    const contextIsDefined = useContext(genericContext)
+    if (!contextIsDefined) {
+      throw new Error('useGenericContext must be used within a Provider')
+    }
+    return contextIsDefined
+  }
+
+  return [useGenericContext, genericContext.Provider] as const
+}

package/src/env.ts

@@ -0,0 +1,2 @@
+// @ts-ignore
+export const DEBUG = !!globalThis.__SEQUENCE_KIT_DEBUG__

package/src/hooks/useChain.ts

@@ -0,0 +1,9 @@
+import { useChainId, useChains } from 'wagmi'
+
+// Returns chain config for current chain or chain by id
+export const useChain = (chainId?: number) => {
+  const chains = useChains()
+  const currentChainId = useChainId()
+
+  return chains.find(chain => (chainId ? chain.id === chainId : chain.id === currentChainId))
+}

package/src/hooks/useCheckWaasFeeOptions.ts

@@ -0,0 +1,34 @@
+'use client'
+
+import { FeeOption, Transaction } from '@0xsequence/waas'
+import { useConnections } from 'wagmi'
+
+export function useCheckWaasFeeOptions(): (params: { transactions: Transaction[]; chainId: number }) => Promise<{
+  feeQuote: string | undefined
+  feeOptions: FeeOption[] | undefined
+  isSponsored: boolean
+}> {
+  const connections = useConnections()
+  const waasConnector = connections.find(c => c.connector.id.includes('waas'))?.connector
+
+  return async ({ transactions, chainId }) => {
+    if (!waasConnector) {
+      return {
+        feeQuote: undefined,
+        feeOptions: undefined,
+        isSponsored: true
+      }
+    }
+
+    const waasProvider = (waasConnector as any).sequenceWaasProvider
+    if (!waasProvider) {
+      return {
+        feeQuote: undefined,
+        feeOptions: undefined,
+        isSponsored: true
+      }
+    }
+
+    return waasProvider.checkTransactionFeeOptions({ transactions, chainId })
+  }
+}

package/src/hooks/useOpenConnectModal.ts

@@ -0,0 +1,7 @@
+import { useConnectModalContext } from '../contexts/ConnectModal'
+
+export const useOpenConnectModal = () => {
+  const { setOpenConnectModal, openConnectModalState } = useConnectModalContext()
+
+  return { setOpenConnectModal, openConnectModalState }
+}

package/src/hooks/useProjectAccessKey.ts

@@ -0,0 +1,7 @@
+import { useConnectConfigContext } from '../contexts/ConnectConfig'
+
+export const useProjectAccessKey = () => {
+  const { projectAccessKey } = useConnectConfigContext()
+
+  return projectAccessKey
+}

package/src/hooks/useSignInEmail.ts

@@ -0,0 +1,28 @@
+'use client'
+
+import { useEffect, useState } from 'react'
+import { useConfig, useAccount } from 'wagmi'
+
+import { LocalStorageKey } from '../constants/localStorage'
+
+export const useSignInEmail = () => {
+  const { storage } = useConfig()
+  const { isConnected } = useAccount()
+  const [email, setEmail] = useState<null | string>(null)
+
+  const storeEmail = async () => {
+    const storedEmail = await storage?.getItem(LocalStorageKey.WaasSignInEmail)
+
+    setEmail(storedEmail as string)
+  }
+
+  useEffect(() => {
+    if (isConnected) {
+      storeEmail()
+    } else {
+      setEmail(null)
+    }
+  }, [isConnected])
+
+  return email
+}

package/src/hooks/useStorage.ts

@@ -0,0 +1,27 @@
+import { UseQueryResult, useQuery } from '@tanstack/react-query'
+import { useConfig, Storage } from 'wagmi'
+
+import { StorageItem } from '../types'
+
+export const useStorage = (): Storage<StorageItem> | null => {
+  const config = useConfig()
+
+  if (!config.storage) {
+    return null
+  }
+
+  return config.storage as Storage<StorageItem>
+}
+
+export const useStorageItem = <K extends keyof StorageItem>(key: K): UseQueryResult<StorageItem[K]> => {
+  const storage = useStorage()
+
+  return useQuery({
+    queryKey: ['storage', key],
+    queryFn: async () => {
+      return storage?.getItem(key)
+    },
+    retry: true,
+    enabled: !!storage
+  })
+}

package/src/hooks/useTheme.ts

@@ -0,0 +1,12 @@
+import { useThemeContext } from '../contexts/Theme'
+
+export const useTheme = () => {
+  const { setTheme, theme, position, setPosition } = useThemeContext()
+
+  return {
+    setTheme,
+    theme,
+    position,
+    setPosition
+  }
+}

package/src/hooks/useWaasConfirmationHandler.ts

@@ -0,0 +1,68 @@
+import { commons } from '@0xsequence/core'
+import { useState, useEffect } from 'react'
+
+import { Deferred } from '../utils/deferred'
+
+let _pendingConfirmation: Deferred<{ id: string; confirmed: boolean }> | undefined
+
+export type WaasRequestConfirmation = {
+  id: string
+  type: 'signTransaction' | 'signMessage'
+  message?: string
+  txs?: commons.transaction.Transaction[]
+  chainId?: number
+}
+
+export function useWaasConfirmationHandler(
+  waasConnector?: any
+): [WaasRequestConfirmation | undefined, (id: string) => void, (id: string) => void] {
+  const [pendingRequestConfirmation, setPendingRequestConfirmation] = useState<WaasRequestConfirmation | undefined>()
+
+  function confirmPendingRequest(id: string) {
+    _pendingConfirmation?.resolve({ id, confirmed: true })
+    setPendingRequestConfirmation(undefined)
+    _pendingConfirmation = undefined
+  }
+
+  function rejectPendingRequest(id: string) {
+    _pendingConfirmation?.resolve({ id, confirmed: false })
+    setPendingRequestConfirmation(undefined)
+    _pendingConfirmation = undefined
+  }
+
+  useEffect(() => {
+    async function setup() {
+      if (!waasConnector) {
+        return
+      }
+
+      const waasProvider = waasConnector.sequenceWaasProvider
+
+      if (!waasProvider) {
+        return
+      }
+
+      waasProvider.requestConfirmationHandler = {
+        confirmSignTransactionRequest(
+          id: string,
+          txs: commons.transaction.Transaction[],
+          chainId: number
+        ): Promise<{ id: string; confirmed: boolean }> {
+          const pending = new Deferred<{ id: string; confirmed: boolean }>()
+          setPendingRequestConfirmation({ id, type: 'signTransaction', txs: Array.isArray(txs) ? txs : [txs], chainId })
+          _pendingConfirmation = pending
+          return pending.promise
+        },
+        confirmSignMessageRequest(id: string, message: string, chainId: number): Promise<{ id: string; confirmed: boolean }> {
+          const pending = new Deferred<{ id: string; confirmed: boolean }>()
+          setPendingRequestConfirmation({ id, type: 'signMessage', message, chainId })
+          _pendingConfirmation = pending
+          return pending.promise
+        }
+      }
+    }
+    setup()
+  })
+
+  return [pendingRequestConfirmation, confirmPendingRequest, rejectPendingRequest]
+}

package/src/hooks/useWaasEmailAuth.ts

@@ -0,0 +1,123 @@
+import { SequenceWaaS, SignInResponse } from '@0xsequence/waas'
+import { useState } from 'react'
+
+// import { EmailWaasOptions } from '../connectors/email/emailWaas'
+import { randomName } from '../connectors/wagmiConnectors'
+import { ExtendedConnector } from '../types'
+
+interface SuccessResultV1 {
+  version: 1
+  idToken: string
+}
+
+interface SuccessResultV2 {
+  version: 2
+  signInResponse: SignInResponse
+}
+
+export function useEmailAuth({
+  connector,
+  onSuccess
+}: {
+  connector?: ExtendedConnector
+  onSuccess: (result: SuccessResultV1 | SuccessResultV2) => void
+}) {
+  if (!connector) {
+    return {
+      inProgress: false,
+      loading: false,
+      error: undefined,
+      initiateAuth: async (_email: string) => {},
+      sendChallengeAnswer: async (_answer: string) => {},
+      resetError: () => {}
+    }
+  }
+
+  const [_email, setEmail] = useState('')
+  const [error, setError] = useState<Error | undefined>()
+  const [loading, setLoading] = useState(false)
+  const [instance, _setInstance] = useState('')
+  const [respondWithCode, setRespondWithCode] = useState<((code: string) => Promise<void>) | null>()
+
+  const getSequenceWaas = () => {
+    if (!connector) {
+      throw new Error('Connector is not defined')
+    }
+
+    const sequenceWaas: SequenceWaaS | undefined = (connector as any).sequenceWaas
+
+    if (!sequenceWaas) {
+      throw new Error('Connector does not support SequenceWaaS')
+    }
+
+    return sequenceWaas
+  }
+
+  const initiateAuth = async (email: string) => {
+    // const params = (connector as any).params as EmailWaasOptions
+    const waas = getSequenceWaas()
+
+    setLoading(true)
+    setError(undefined)
+
+    waas.onEmailAuthCodeRequired(async respondWithCode => {
+      setRespondWithCode(() => respondWithCode)
+    })
+
+    waas
+      .signIn({ email }, randomName())
+      .then(signInResponse => {
+        onSuccess({ version: 2, signInResponse })
+
+        if (signInResponse.email) {
+          setEmail(signInResponse.email)
+        }
+      })
+      .catch(err => {
+        setError(err)
+      })
+
+    setLoading(false)
+  }
+
+  const sendChallengeAnswer = async (answer: string) => {
+    // const params = (connector as any).params as EmailWaasOptions
+    // const waas = getSequenceWaas()
+
+    setLoading(true)
+    setError(undefined)
+
+    // version 2
+    if (!respondWithCode) {
+      throw new Error('Email v2 auth, respondWithCode is not defined')
+    }
+
+    try {
+      await respondWithCode(answer)
+    } catch (err: any) {
+      setError(err)
+    } finally {
+      setLoading(false)
+    }
+  }
+
+  const cancel = () => {
+    setLoading(false)
+    setRespondWithCode(null)
+    setError(undefined)
+  }
+
+  const resetError = () => {
+    setError(undefined)
+  }
+
+  return {
+    inProgress: loading || !!instance,
+    loading,
+    error,
+    initiateAuth,
+    sendChallengeAnswer,
+    cancel,
+    resetError
+  }
+}

package/src/hooks/useWaasEmailConflict.ts

@@ -0,0 +1,75 @@
+import { IdentityType, EmailConflictInfo, SequenceWaaS } from '@0xsequence/waas'
+import { useEffect, useRef, useState } from 'react'
+import { useConnect } from 'wagmi'
+
+export type FormattedEmailConflictInfo = {
+  email: string
+  type: string
+}
+
+const accountTypeText = (info: EmailConflictInfo | null) => {
+  if (!info) {
+    return 'Unknown account type'
+  }
+
+  if (info.type === IdentityType.PlayFab) {
+    return 'PlayFab login'
+  }
+
+  if (info.type === IdentityType.Email) {
+    return 'Email login'
+  }
+
+  if (info.type === IdentityType.OIDC) {
+    switch (info.issuer) {
+      case 'https://accounts.google.com':
+        return 'Google login'
+      case 'https://appleid.apple.com':
+        return 'Apple login'
+      default:
+        return 'Unknown account type'
+    }
+  }
+
+  return info.type
+}
+
+export const useEmailConflict = () => {
+  const { connectors } = useConnect()
+  const forceCreateFuncRef = useRef<((forceCreate: boolean) => Promise<void>) | null>(null)
+  const [isOpen, toggleModal] = useState(false)
+  const [emailConflictInfo, setEmailConflictInfo] = useState<EmailConflictInfo | null>(null)
+
+  const waasConnectors = connectors.filter(connector => !!(connector as any).sequenceWaas)
+  const waasInstances = waasConnectors.map(connector => (connector as any).sequenceWaas as SequenceWaaS)
+
+  useEffect(() => {
+    if (waasInstances.length > 0) {
+      // Set up listeners for all waas instances
+      const disposers = waasInstances.map(waas =>
+        waas.onEmailConflict(async (info, forceCreate) => {
+          forceCreateFuncRef.current = forceCreate
+          setEmailConflictInfo(info)
+          toggleModal(true)
+        })
+      )
+
+      // Return cleanup function that disposes all listeners
+      return () => {
+        disposers.forEach(disposer => disposer())
+      }
+    }
+  }, [])
+
+  return {
+    toggleEmailConflictModal: toggleModal,
+    isEmailConflictOpen: isOpen,
+    emailConflictInfo: {
+      email: emailConflictInfo?.email ?? 'Unknown',
+      type: accountTypeText(emailConflictInfo)
+    } as FormattedEmailConflictInfo,
+    forceCreate: async () => {
+      return forceCreateFuncRef.current?.(true)
+    }
+  }
+}