@0xsequence/connect 0.0.0-20250314205219

package/src/hooks/useWallets.ts

@@ -0,0 +1,227 @@
+'use client'
+
+import { SequenceAPIClient, GetLinkedWalletsArgs, LinkedWallet } from '@0xsequence/api'
+import { useAPIClient } from '@0xsequence/react-hooks'
+import { useCallback, useEffect, useRef, useState } from 'react'
+import { Connector, type UseConnectionsReturnType, useAccount, useConnect, useConnections, useDisconnect } from 'wagmi'
+
+import { SEQUENCE_UNIVERSAL_CONNECTOR_NAME } from '../components/Connect/Connect'
+import { ExtendedConnector } from '../types'
+
+import { useWaasGetLinkedWalletsSignature } from './useWaasGetLinkedWalletsSignature'
+
+interface UseLinkedWalletsOptions {
+  enabled?: boolean
+}
+
+// Create a stable storage key from args
+const createStorageKey = (args: GetLinkedWalletsArgs): string =>
+  `@0xsequence.linked_wallets-${args.parentWalletAddress}-${args.signatureChainId}`
+
+const getLinkedWallets = async (
+  apiClient: SequenceAPIClient,
+  args: GetLinkedWalletsArgs,
+  headers?: object,
+  signal?: AbortSignal
+): Promise<Array<LinkedWallet>> => {
+  const storageKey = createStorageKey(args)
+  const now = Date.now()
+
+  // Check localStorage for cached data
+  const stored = localStorage.getItem(storageKey)
+  if (stored) {
+    try {
+      const { data, timestamp } = JSON.parse(stored)
+      // Check if cache is still valid (5 minutes)
+      if (now - timestamp <= 5 * 60 * 1000) {
+        return data
+      }
+    } catch (error) {
+      console.error('Error parsing stored linked wallets:', error)
+    }
+  }
+
+  // If no valid cache, fetch new data
+  const result = await apiClient.getLinkedWallets(args, headers, signal)
+  const linkedWallets = result.linkedWallets
+
+  // Store in localStorage with timestamp
+  localStorage.setItem(
+    storageKey,
+    JSON.stringify({
+      data: linkedWallets,
+      timestamp: now
+    })
+  )
+
+  return linkedWallets
+}
+
+export interface UseLinkedWalletsResult {
+  data: LinkedWallet[] | undefined
+  isLoading: boolean
+  error: Error | null
+  refetch: () => Promise<void>
+  clearCache: () => void
+}
+
+export const useLinkedWallets = (args: GetLinkedWalletsArgs, options: UseLinkedWalletsOptions = {}): UseLinkedWalletsResult => {
+  const apiClient = useAPIClient()
+  const [data, setData] = useState<LinkedWallet[] | undefined>(undefined)
+  const [isLoading, setIsLoading] = useState(false)
+  const [error, setError] = useState<Error | null>(null)
+  const abortControllerRef = useRef<AbortController | undefined>(undefined)
+
+  const fetchData = useCallback(async () => {
+    if (!options.enabled) {
+      return
+    }
+
+    setIsLoading(true)
+    setError(null)
+
+    try {
+      // Cancel any ongoing request
+      abortControllerRef.current?.abort()
+      abortControllerRef.current = new AbortController()
+
+      const linkedWallets = await getLinkedWallets(apiClient, args, undefined, abortControllerRef.current.signal)
+
+      setData(linkedWallets)
+    } catch (error: unknown) {
+      if (error instanceof Error && error.name !== 'AbortError') {
+        setError(error)
+      } else if (error && typeof error === 'object' && 'name' in error && error.name !== 'AbortError') {
+        setError(new Error('Failed to fetch linked wallets'))
+      }
+    } finally {
+      setIsLoading(false)
+    }
+  }, [apiClient, args.parentWalletAddress, args.signatureChainId, options.enabled])
+
+  // Fetch on mount and when dependencies change
+  useEffect(() => {
+    fetchData()
+    return () => {
+      abortControllerRef.current?.abort()
+    }
+  }, [fetchData])
+
+  const clearCache = useCallback(() => {
+    localStorage.removeItem(createStorageKey(args))
+  }, [args])
+
+  const refetch = async () => {
+    clearCache()
+    await fetchData()
+  }
+
+  return {
+    data,
+    isLoading,
+    error,
+    refetch,
+    clearCache
+  }
+}
+
+export interface ConnectedWallet {
+  id: string
+  name: string
+  address: string
+  isActive: boolean
+  isEmbedded: boolean
+}
+
+export const useWallets = () => {
+  const { address } = useAccount()
+  const connections = useConnections()
+  const { connectAsync } = useConnect()
+  const { disconnectAsync } = useDisconnect()
+
+  const waasConnection = connections.find(c => (c.connector as ExtendedConnector)?.type === 'sequence-waas')
+
+  const {
+    message: linkedWalletsMessage,
+    signature: linkedWalletsSignature,
+    address: linkedWalletsWaasAddress,
+    chainId: linkedWalletsSigChainId
+  } = useWaasGetLinkedWalletsSignature(waasConnection)
+
+  // Only fetch if we have valid data
+  const hasValidData = !!(linkedWalletsWaasAddress && linkedWalletsMessage && linkedWalletsSignature)
+
+  const {
+    data: linkedWallets,
+    refetch: refetchLinkedWallets,
+    clearCache: clearLinkedWalletsCache
+  } = useLinkedWallets(
+    {
+      parentWalletAddress: linkedWalletsWaasAddress || '',
+      parentWalletMessage: linkedWalletsMessage || '',
+      parentWalletSignature: linkedWalletsSignature || '',
+      signatureChainId: `${linkedWalletsSigChainId}`
+    },
+    {
+      enabled: hasValidData
+    }
+  )
+
+  const wallets: ConnectedWallet[] = connections.map((connection: UseConnectionsReturnType[number]) => ({
+    id: connection.connector.id,
+    name: getConnectorName(connection.connector),
+    address: connection.accounts[0],
+    isActive: connection.accounts[0] === address,
+    isEmbedded: connection.connector.id.includes('waas')
+  }))
+
+  const setActiveWallet = async (walletAddress: string) => {
+    const connection = connections.find((c: UseConnectionsReturnType[number]) => c.accounts[0] === walletAddress)
+    if (!connection) {
+      return
+    }
+
+    try {
+      await connectAsync({ connector: connection.connector })
+    } catch (error) {
+      console.error('Failed to set active wallet:', error)
+    }
+  }
+
+  const disconnectWallet = async (walletAddress: string) => {
+    const connection = connections.find((c: UseConnectionsReturnType[number]) => c.accounts[0] === walletAddress)
+    if (!connection) {
+      return
+    }
+
+    // invalidate linked wallets if we're disconnecting waas wallet
+    if (connection.connector.id.includes('waas')) {
+      clearLinkedWalletsCache()
+    }
+
+    try {
+      await disconnectAsync({ connector: connection.connector })
+    } catch (error) {
+      console.error('Failed to disconnect wallet:', error)
+    }
+  }
+
+  return {
+    wallets,
+    linkedWallets,
+    setActiveWallet,
+    disconnectWallet,
+    refetchLinkedWallets
+  }
+}
+
+const getConnectorName = (connector: Connector) => {
+  const connectorName = connector.name
+  const connectorWalletName = (connector._wallet as any)?.name
+
+  if (connectorName === SEQUENCE_UNIVERSAL_CONNECTOR_NAME) {
+    return 'Sequence Universal'
+  }
+
+  return connectorWalletName ?? connectorName
+}

package/src/index.css

@@ -0,0 +1,5 @@
+@import 'tailwindcss';
+@import '@0xsequence/design-system/preset';
+
+@source '../../wallet/src';
+@source '../../checkout/src';

package/src/index.ts

@@ -0,0 +1,108 @@
+export { SequenceConnect } from './components/SequenceConnect'
+
+// Provider
+export { SequenceConnectProvider } from './components/SequenceConnectProvider'
+export { SequenceConnectPreviewProvider } from './components/SequenceConnectPreviewProvider'
+
+// Types
+export type {
+  Wallet,
+  WalletField,
+  WalletProperties,
+  WalletType,
+  DisplayedAsset,
+  ExtendedConnector,
+  EthAuthSettings,
+  ModalPosition,
+  ConnectConfig,
+  StorageItem
+} from './types'
+
+// Config
+export { createConfig, type CreateConfigOptions } from './config/createConfig'
+export {
+  getDefaultConnectors,
+  getDefaultWaasConnectors,
+  getDefaultUniversalConnectors,
+  type DefaultConnectorOptions,
+  type DefaultWaasConnectorOptions,
+  type DefaultUniversalConnectorOptions
+} from './config/defaultConnectors'
+export { getDefaultChains } from './config/defaultChains'
+export { getDefaultTransports } from './config/defaultTransports'
+
+// Constants
+export {
+  LocalStorageKey,
+  DEFAULT_SESSION_EXPIRATION,
+  TRANSACTION_CONFIRMATIONS_DEFAULT,
+  NATIVE_TOKEN_ADDRESS_0X,
+  QUERY_KEYS,
+  WEB_SDK_VERSION
+} from './constants'
+
+// Utils
+export { getConnectWallets } from './utils/getConnectWallets'
+export { isEmailValid, compareAddress, formatDisplay, capitalize, truncateAtMiddle, formatAddress } from './utils/helpers'
+export { getNativeTokenInfoByChainId, createNativeTokenBalance } from './utils/tokens'
+export { getModalPositionCss } from './utils/styling'
+export { getNetwork, getNetworkColor, getNetworkBackgroundColor } from './utils/networks'
+export { walletClientToSigner, publicClientToProvider } from './utils/adapters'
+export { signEthAuthProof, validateEthProof } from './utils/ethAuth'
+export { sendTransactions, waitForTransactionReceipt } from './utils/transactions'
+
+// Contexts
+export { useConnectConfigContext, ConnectConfigContextProvider } from './contexts/ConnectConfig'
+export { useAnalyticsContext, AnalyticsContextProvider } from './contexts/Analytics'
+export { useConnectModalContext, ConnectModalContextProvider } from './contexts/ConnectModal'
+export { useThemeContext, ThemeContextProvider } from './contexts/Theme'
+export { useWalletConfigContext, WalletConfigContextProvider } from './contexts/WalletConfig'
+
+// Connectors
+export { apple, type AppleOptions } from './connectors/apple'
+export { appleWaas, type AppleWaasOptions } from './connectors/apple/appleWaas'
+export { coinbaseWallet } from './connectors/coinbaseWallet'
+export { discord, type DiscordOptions } from './connectors/discord'
+export { email, type EmailOptions } from './connectors/email'
+export { emailWaas, type EmailWaasOptions } from './connectors/email/emailWaas'
+export { facebook, type FacebookOptions } from './connectors/facebook'
+export { google, type GoogleOptions } from './connectors/google'
+export { googleWaas, type GoogleWaasOptions } from './connectors/google/googleWaas'
+export { mock } from './connectors/mock'
+export { sequence, type SequenceOptions } from './connectors/sequence'
+export { twitch, type TwitchOptions } from './connectors/twitch'
+export { walletConnect } from './connectors/walletConnect'
+export {
+  sequenceWallet,
+  sequenceWaasWallet,
+  type BaseSequenceConnectorOptions,
+  type BaseSequenceWaasConnectorOptions
+} from './connectors/wagmiConnectors'
+
+// Hooks
+export { useOpenConnectModal } from './hooks/useOpenConnectModal'
+export { useTheme } from './hooks/useTheme'
+export { useWalletSettings } from './hooks/useWalletSettings'
+export { useWaasFeeOptions } from './hooks/useWaasFeeOptions'
+export { useCheckWaasFeeOptions } from './hooks/useCheckWaasFeeOptions'
+export { useWaasSignInEmail } from './hooks/useWaasSignInEmail'
+export { useSignInEmail } from './hooks/useSignInEmail'
+export { useProjectAccessKey } from './hooks/useProjectAccessKey'
+export { useStorage, useStorageItem } from './hooks/useStorage'
+export { useChain } from './hooks/useChain'
+export { useWallets } from './hooks/useWallets'
+export type { ConnectedWallet } from './hooks/useWallets'
+export type { LinkedWallet } from '@0xsequence/api'
+
+// Components
+export { NetworkBadge } from './components/NetworkBadge'
+export { CollectibleTileImage } from './components/CollectibleTileImage'
+export { CryptoOption } from './components/CryptoOption'
+export { SelectedIndicator } from './components/SelectedIndicator'
+export { ShadowRoot } from './components/ShadowRoot'
+
+// Indexer
+export { ContractVerificationStatus } from '@0xsequence/indexer'
+
+// XXX
+export { DEBUG } from './env'