diff --git a/README.md b/README.md index f2669f9e..a87f0aef 100644 --- a/README.md +++ b/README.md @@ -41,27 +41,44 @@ import { mainnet, polygon, Chain } from 'wagmi/chains' const queryClient = new QueryClient() function App() { + const projectAccessKey = '' + const chains = getDefaultChains(/* optional array of chain ids to filter */) - const projectAccessKey = 'xyz' + const transports = {} + + chains.forEach(chain => { + transports[chain.id] = http() + }) + // Universal wallet configuration const connectors = getDefaultConnectors({ - walletConnectProjectId: 'wallet-connect-id', + projectAccessKey, + walletConnectProjectId: '', defaultChainId: 137, - appName: 'demo app', - projectAccessKey + appName: 'Demo Dapp' }) - const transports = {} + /* + // ...or for Embedded wallet configuration + const connectors = getDefaultWaasConnectors({ + projectAccessKey, + walletConnectProjectId: '', + defaultChainId: 137, + appName: 'Demo Dapp', - chains.forEach(chain => { - transports[chain.id] = http() + waasConfigKey: '', + googleClientId, + appleClientId, + appleRedirectUrl, + emailAuthVersion // (default 2), 1 for legacy }) + */ const config = createConfig({ + chains, transports, - connectors, - chains + connectors }) return ( diff --git a/examples/components/package.json b/examples/components/package.json index d9805bc5..83eba7d9 100644 --- a/examples/components/package.json +++ b/examples/components/package.json @@ -9,7 +9,7 @@ }, "peerDependencies": { "@0xsequence/design-system": ">= 1.7.3", - "@0xsequence/network": ">= 1.9.37", + "@0xsequence/network": ">= 1.10.7", "wagmi": "*" }, "private": true diff --git a/examples/next/package.json b/examples/next/package.json index 983ded0a..5d0d39c8 100644 --- a/examples/next/package.json +++ b/examples/next/package.json @@ -15,7 +15,7 @@ "@0xsequence/kit-checkout": "workspace:*", "@0xsequence/kit-wallet": "workspace:*", "@0xsequence/kit-example-shared-components": "workspace:*", - "@0xsequence/network": "^1.9.37", + "@0xsequence/network": "^1.10.7", "@tanstack/react-query": "^5.37.1", "next": "14.2.3", "react": "^18.3.1", diff --git a/examples/react/package.json b/examples/react/package.json index 893201d9..c8842297 100644 --- a/examples/react/package.json +++ b/examples/react/package.json @@ -16,7 +16,7 @@ "@0xsequence/kit-checkout": "workspace:*", "@0xsequence/kit-wallet": "workspace:*", "@0xsequence/kit-example-shared-components": "workspace:*", - "@0xsequence/network": "^1.9.37", + "@0xsequence/network": "^1.10.7", "@tanstack/react-query": "^5.37.1", "framer-motion": "^8.5.2", "react": "^18.3.1", diff --git a/examples/react/src/config.ts b/examples/react/src/config.ts index 21e8611b..755ef520 100644 --- a/examples/react/src/config.ts +++ b/examples/react/src/config.ts @@ -47,6 +47,7 @@ const getWaasConnectors = () => { appleRedirectURI, appName: 'Kit Demo', projectAccessKey, + // emailAuthVersion: 1, enableConfirmationModal: localStorage.getItem('confirmationEnabled') === 'true', isDev: isDebugMode }) diff --git a/packages/checkout/package.json b/packages/checkout/package.json index 32f5c8b3..3ae41fd5 100644 --- a/packages/checkout/package.json +++ b/packages/checkout/package.json @@ -31,13 +31,13 @@ "typecheck": "tsc --noEmit" }, "dependencies": { - "@0xsequence/api": "^1.9.37", - "@0xsequence/indexer": "^1.9.37", - "@0xsequence/metadata": "^1.9.37", - "@0xsequence/network": "^1.9.37", + "@0xsequence/api": "^1.10.7", + "@0xsequence/indexer": "^1.10.7", + "@0xsequence/metadata": "^1.10.7", + "@0xsequence/network": "^1.10.7", "@paperxyz/react-client-sdk": "^1.1.3", "@tanstack/react-query": "^5.37.1", - "0xsequence": "^1.9.37", + "0xsequence": "^1.10.7", "react-copy-to-clipboard": "^5.1.0" }, "peerDependencies": { diff --git a/packages/kit/package.json b/packages/kit/package.json index 29f307f9..852423a8 100644 --- a/packages/kit/package.json +++ b/packages/kit/package.json @@ -36,22 +36,22 @@ "typecheck": "tsc --noEmit" }, "dependencies": { - "@0xsequence/api": "^1.9.37", - "@0xsequence/auth": "^1.9.37", - "@0xsequence/core": "^1.9.37", + "@0xsequence/api": "^1.10.7", + "@0xsequence/auth": "^1.10.7", + "@0xsequence/core": "^1.10.7", "@0xsequence/design-system": "^1.7.3", "@0xsequence/ethauth": "^0.8.1", - "@0xsequence/indexer": "^1.9.37", - "@0xsequence/metadata": "^1.9.37", - "@0xsequence/network": "^1.9.37", - "@0xsequence/provider": "^1.9.37", - "@0xsequence/utils": "^1.9.37", + "@0xsequence/indexer": "^1.10.7", + "@0xsequence/metadata": "^1.10.7", + "@0xsequence/network": "^1.10.7", + "@0xsequence/provider": "^1.10.7", + "@0xsequence/utils": "^1.10.7", "framer-motion": "^8.5.2", "uuid": "^10.0.0" }, "peerDependencies": { - "0xsequence": ">= 1.9.37", - "@0xsequence/waas": ">= 1.9.37", + "0xsequence": ">= 1.10.7", + "@0xsequence/waas": ">= 1.10.7", "@react-oauth/google": ">= 0.11.1", "@tanstack/react-query": ">= 5.0.0", "ethers": ">= 5.7.2 < 6", @@ -62,7 +62,7 @@ "wagmi": ">= 2.0.0" }, "devDependencies": { - "0xsequence": "^1.9.37", + "0xsequence": "^1.10.7", "@tanstack/react-query": "^5.37.1", "@types/uuid": "^9.0.8", "ethers": "5.7.2", diff --git a/packages/kit/src/components/KitProvider/CollectibleTileImage.tsx b/packages/kit/src/components/CollectibleTileImage/CollectibleTileImage.tsx similarity index 100% rename from packages/kit/src/components/KitProvider/CollectibleTileImage.tsx rename to packages/kit/src/components/CollectibleTileImage/CollectibleTileImage.tsx diff --git a/packages/kit/src/components/CollectibleTileImage/index.ts b/packages/kit/src/components/CollectibleTileImage/index.ts new file mode 100644 index 00000000..7deefe4a --- /dev/null +++ b/packages/kit/src/components/CollectibleTileImage/index.ts @@ -0,0 +1 @@ +export { CollectibleTileImage } from './CollectibleTileImage' diff --git a/packages/kit/src/components/KitProvider/ConnectWalletContent/Banner.tsx b/packages/kit/src/components/Connect/Banner.tsx similarity index 86% rename from packages/kit/src/components/KitProvider/ConnectWalletContent/Banner.tsx rename to packages/kit/src/components/Connect/Banner.tsx index 8d21df2f..15752ddc 100644 --- a/packages/kit/src/components/KitProvider/ConnectWalletContent/Banner.tsx +++ b/packages/kit/src/components/Connect/Banner.tsx @@ -1,7 +1,6 @@ import { Box, Image } from '@0xsequence/design-system' -import React from 'react' -import { KitConfig } from '../../../types' +import { KitConfig } from '../../types' interface BannerProps { config: KitConfig diff --git a/packages/kit/src/components/KitProvider/ConnectWalletContent/index.tsx b/packages/kit/src/components/Connect/Connect.tsx similarity index 80% rename from packages/kit/src/components/KitProvider/ConnectWalletContent/index.tsx rename to packages/kit/src/components/Connect/Connect.tsx index 58e8f14a..efaae14c 100644 --- a/packages/kit/src/components/KitProvider/ConnectWalletContent/index.tsx +++ b/packages/kit/src/components/Connect/Connect.tsx @@ -8,46 +8,44 @@ import { TextInput, Spinner, Image, - IconButton, - PINCodeInput + IconButton } from '@0xsequence/design-system' import React, { useState, useEffect } from 'react' import { appleAuthHelpers, useScript } from 'react-apple-signin-auth' import { useConnect, useAccount } from 'wagmi' -import { LocalStorageKey } from '../../../constants' -import { useStorage } from '../../../hooks/useStorage' -import { useEmailAuth } from '../../../hooks/useWaasEmailAuth' -import { ExtendedConnector, KitConfig, LogoProps } from '../../../types' -import { isEmailValid } from '../../../utils/helpers' -import { AppleWaasConnectButton, ConnectButton, EmailConnectButton, GoogleWaasConnectButton } from '../../ConnectButton' -import { KitConnectProviderProps } from '../index' +import { LocalStorageKey } from '../../constants' +import { useStorage } from '../../hooks/useStorage' +import { useEmailAuth } from '../../hooks/useWaasEmailAuth' +import { FormattedEmailConflictInfo } from '../../hooks/useWaasEmailConflict' +import { ExtendedConnector, KitConfig, LogoProps } from '../../types' +import { isEmailValid } from '../../utils/helpers' +import { AppleWaasConnectButton, ConnectButton, EmailConnectButton, GoogleWaasConnectButton } from '../ConnectButton' +import { KitConnectProviderProps } from '../KitProvider/KitProvider' +import { PoweredBySequence } from '../SequenceLogo' import { Banner } from './Banner' +import { EmailWaasVerify } from './EmailWaasVerify' import { ExtendedWalletList } from './ExtendedWalletList' interface ConnectWalletContentProps extends KitConnectProviderProps { - openConnectModal: boolean - setOpenConnectModal: React.Dispatch> + emailConflictInfo?: FormattedEmailConflictInfo | null + onClose: () => void } -export const ConnectWalletContent = (props: ConnectWalletContentProps) => { +export const Connect = (props: ConnectWalletContentProps) => { useScript(appleAuthHelpers.APPLE_SCRIPT_SRC) - const storage = useStorage() - const { isConnected } = useAccount() - const { config = {} } = props + const { onClose, emailConflictInfo, config = {} } = props const { signIn = {} } = config as KitConfig - - const { openConnectModal, setOpenConnectModal } = props + const { isConnected } = useAccount() + const storage = useStorage() const [email, setEmail] = useState('') const [showEmailInput, setShowEmailInput] = useState(false) const [showEmailWaasPinInput, setShowEmailWaasPinInput] = useState(false) const [showExtendedList, setShowExtendedList] = useState(false) - const [waasEmailPinCode, setWaasEmailPinCode] = useState([]) const { connectors, connect } = useConnect() - const hasInjectedSequenceConnector = connectors.some(c => c.id === 'app.sequence') const baseWalletConnectors = (connectors as ExtendedConnector[]) @@ -105,26 +103,12 @@ export const ConnectWalletContent = (props: ConnectWalletContentProps) => { setEmail(ev.target.value) } - const { - inProgress: emailAuthInProgress, - loading: emailAuthLoading, - initiateAuth: initiateEmailAuth, - sendChallengeAnswer - } = useEmailAuth({ - connector: socialAuthConnectors.find(c => c._wallet.id === 'email-waas'), - onSuccess: async idToken => { - storage?.setItem(LocalStorageKey.WaasEmailIdToken, idToken) - if (emailConnector) { - connect({ connector: emailConnector }) - } - } - }) - + // Close after successful connection useEffect(() => { - if (isConnected && openConnectModal) { - setOpenConnectModal(false) + if (isConnected) { + onClose() } - }, [isConnected, openConnectModal]) + }, [isConnected]) const onConnect = (connector: ExtendedConnector) => { if (signIn.useMock && mockConnector) { @@ -170,31 +154,37 @@ export const ConnectWalletContent = (props: ConnectWalletContentProps) => { } } + const { + inProgress: emailAuthInProgress, + loading: emailAuthLoading, + error: emailAuthError, + initiateAuth: initiateEmailAuth, + sendChallengeAnswer + } = useEmailAuth({ + connector: emailConnector, + onSuccess: async result => { + console.log('Successfult email auth', result) + + if (emailConnector) { + if (result.version === 1) { + // Store the version 1 idToken so that it can be used to authenticate during a refresh + storage?.setItem(LocalStorageKey.WaasEmailIdToken, result.idToken) + } + + connect({ connector: emailConnector }) + } + } + }) + + // Hide the email input if there is an email conflict + useEffect(() => { + if (emailConflictInfo) { + setShowEmailWaasPinInput(false) + } + }, [emailConflictInfo]) + if (showEmailWaasPinInput) { - return ( - <> - - - Enter code received in email. - - - - - {emailAuthLoading ? ( - - ) : ( -