diff --git a/unlock-app/src/components/interface/checkout/Connected.tsx b/unlock-app/src/components/interface/checkout/Connected.tsx
index 3a23985f8f1..2d06ebdbd24 100644
--- a/unlock-app/src/components/interface/checkout/Connected.tsx
+++ b/unlock-app/src/components/interface/checkout/Connected.tsx
@@ -189,7 +189,8 @@ export function Connected({
})
const { signIn, signOut, isSignedIn } = useSIWE()
const [isDisconnecting, setIsDisconnecting] = useState(false)
- const autoconnect = state.context?.paywallConfig?.autoconnect
+ const useDelegatedProvider =
+ state.context?.paywallConfig?.useDelegatedProvider
useEffect(() => {
const autoSignIn = async () => {
@@ -197,7 +198,7 @@ export function Connected({
!isSignedIn &&
!signing &&
connected &&
- (isUnlockAccount || autoconnect)
+ (isUnlockAccount || useDelegatedProvider)
) {
setSigning(true)
await signIn()
@@ -205,7 +206,14 @@ export function Connected({
}
}
autoSignIn()
- }, [connected, autoconnect, isUnlockAccount, signIn, signing, isSignedIn])
+ }, [
+ connected,
+ useDelegatedProvider,
+ isUnlockAccount,
+ signIn,
+ signing,
+ isSignedIn,
+ ])
useEffect(() => {
if (!account) {
@@ -213,7 +221,7 @@ export function Connected({
} else console.debug(`Connected as ${account}`)
}, [account])
- if (autoconnect) {
+ if (useDelegatedProvider) {
return
{children}
}
diff --git a/unlock-app/src/components/interface/checkout/index.tsx b/unlock-app/src/components/interface/checkout/index.tsx
index 74f2bdc45a2..830f25a8841 100644
--- a/unlock-app/src/components/interface/checkout/index.tsx
+++ b/unlock-app/src/components/interface/checkout/index.tsx
@@ -46,13 +46,19 @@ export function CheckoutPage() {
paywallConfig.referrer = referrerAddress
}
- const injectedProvider =
- communication.providerAdapter || selectProvider(config)
-
// Autoconnect, provider might change (we could receive the provider from the parent with a delay!)
useEffect(() => {
- authenticateWithProvider('DELEGATED_PROVIDER', injectedProvider)
- }, [authenticateWithProvider, injectedProvider])
+ if (communication.providerAdapter) {
+ authenticateWithProvider(
+ 'DELEGATED_PROVIDER',
+ communication.providerAdapter
+ )
+ }
+ }, [authenticateWithProvider, communication.providerAdapter])
+
+ // TODO: do we need to pass it down?
+ const injectedProvider =
+ communication.providerAdapter || selectProvider(config)
const checkoutRedirectURI =
paywallConfig?.redirectUri ||
diff --git a/unlock-app/src/components/interface/checkout/main/Payment.tsx b/unlock-app/src/components/interface/checkout/main/Payment.tsx
index 46a31a539aa..20a8ea2fc87 100644
--- a/unlock-app/src/components/interface/checkout/main/Payment.tsx
+++ b/unlock-app/src/components/interface/checkout/main/Payment.tsx
@@ -70,8 +70,6 @@ export function Payment({ injectedProvider, checkoutService }: Props) {
currencyContractAddress: lock.currencyContractAddress,
})
- console.log(state)
-
const { data: purchaseData, isLoading: isPurchaseDataLoading } =
usePurchaseData({
lockAddress: lock.address,
diff --git a/unlock-app/src/hooks/useAutoLogin.ts b/unlock-app/src/hooks/useAutoLogin.ts
index 589ae22bd80..17f4f9893e4 100644
--- a/unlock-app/src/hooks/useAutoLogin.ts
+++ b/unlock-app/src/hooks/useAutoLogin.ts
@@ -1,18 +1,20 @@
import { useCallback, useState } from 'react'
import { useAppStorage } from './useAppStorage'
import { useAuthenticate, WalletProvider } from './useAuthenticate'
+import { useSIWE } from '~/hooks/useSIWE'
export function useAutoLogin() {
const [isLoading, setLoading] = useState(false)
const { getStorage } = useAppStorage()
const { authenticateWithProvider } = useAuthenticate()
+ const { signOut } = useSIWE()
const getAutoLoginData = useCallback(() => {
const storedProvider: WalletProvider | null = getStorage(
'provider'
) as WalletProvider
-
- const canAutoLogin = storedProvider !== null
+ const canAutoLogin =
+ storedProvider !== null && storedProvider !== 'DELEGATED_PROVIDER'
return [canAutoLogin, storedProvider] as const
}, [getStorage])
@@ -33,10 +35,14 @@ export function useAutoLogin() {
} catch (error: any) {
console.error('Autologin failed.')
console.error(error)
+ await signOut()
}
}
+ if (!canAutoLogin && storedProvider === 'DELEGATED_PROVIDER') {
+ await signOut()
+ }
setLoading(false)
- }, [authenticateWithProvider, getAutoLoginData])
+ }, [authenticateWithProvider, getAutoLoginData, signOut])
return {
tryAutoLogin,
diff --git a/unlock-app/src/hooks/useSIWE.tsx b/unlock-app/src/hooks/useSIWE.tsx
index a9ce3a4995e..75a14a28eb7 100644
--- a/unlock-app/src/hooks/useSIWE.tsx
+++ b/unlock-app/src/hooks/useSIWE.tsx
@@ -27,6 +27,14 @@ export interface SIWEContextType {
isSignedIn: boolean
}
+const signOut = async () => {
+ const session = getAccessToken()
+ if (session) {
+ await storage.revoke().catch(console.error)
+ removeAccessToken()
+ }
+}
+
const SIWEContext = createContext({
siweSign: (_nonce: string, _statement: string) => {
throw new Error('No SIWE provider found')
@@ -34,9 +42,7 @@ const SIWEContext = createContext({
signIn: () => {
throw new Error('No SIWE provider found')
},
- signOut: () => {
- throw new Error('No SIWE provider found')
- },
+ signOut,
session: undefined,
isSignedIn: false,
})
@@ -68,11 +74,7 @@ export const SIWEProvider = ({ children }: Props) => {
const signOut = async () => {
try {
setStatus('loading')
- const session = getAccessToken()
- if (session) {
- await storage.revoke().catch(console.error)
- removeAccessToken()
- }
+ await signOut()
await Promise.all([queryClient.invalidateQueries(), refetchSession()])
setStatus('idle')
} catch (error) {