diff --git a/src/components/pages/profile/[name]/registration/Registration.tsx b/src/components/pages/profile/[name]/registration/Registration.tsx index d446afae4..1b3bffbc2 100644 --- a/src/components/pages/profile/[name]/registration/Registration.tsx +++ b/src/components/pages/profile/[name]/registration/Registration.tsx @@ -110,7 +110,7 @@ const Registration = ({ nameDetails, isLoading }: Props) => { const chainId = useChainId() const { address } = useAccount() const primary = usePrimary(address!, !address) - const selected = { name: nameDetails.normalisedName, address: address! } + const selected = { name: nameDetails.normalisedName, address: address!, chainId } const { normalisedName, beautifiedName } = nameDetails const defaultResolverAddress = useContractAddress('PublicResolver') const { data: resolverExists, isLoading: resolverExistsLoading } = useResolverExists( diff --git a/src/components/pages/profile/[name]/registration/types.ts b/src/components/pages/profile/[name]/registration/types.ts index cf0eef77f..19c2f905e 100644 --- a/src/components/pages/profile/[name]/registration/types.ts +++ b/src/components/pages/profile/[name]/registration/types.ts @@ -41,7 +41,7 @@ export type BackObj = { back: boolean } export type RegistrationData = Prettify> -export type SelectedItemProperties = { address: string; name: string } +export type SelectedItemProperties = { address: string; name: string; chainId: number } export type RegistrationReducerDataItem = Prettify< Omit & { diff --git a/src/components/pages/profile/[name]/registration/useMoonpayRegistration.ts b/src/components/pages/profile/[name]/registration/useMoonpayRegistration.ts index 8b805c7fc..577cee4fc 100644 --- a/src/components/pages/profile/[name]/registration/useMoonpayRegistration.ts +++ b/src/components/pages/profile/[name]/registration/useMoonpayRegistration.ts @@ -10,12 +10,12 @@ import { useQueryKeys } from '@app/utils/cacheKeyFactory' import { MOONPAY_WORKER_URL } from '@app/utils/constants' import { getLabelFromName } from '@app/utils/utils' -import { MoonpayTransactionStatus } from './types' +import { MoonpayTransactionStatus, SelectedItemProperties } from './types' export const useMoonpayRegistration = ( dispatch: ReturnType['dispatch'], normalisedName: string, - selected: { name: string; address: string }, + selected: SelectedItemProperties, item: ReturnType['item'], ) => { const chainId = useChainId() diff --git a/src/hooks/useRegistrationReducer.ts b/src/hooks/useRegistrationReducer.ts index e1897eec2..f000f67bd 100644 --- a/src/hooks/useRegistrationReducer.ts +++ b/src/hooks/useRegistrationReducer.ts @@ -7,6 +7,8 @@ import { } from '@app/components/pages/profile/[name]/registration/types' import { useLocalStorageReducer } from '@app/hooks/useLocalStorage' +import { useChainId } from './useChainId' + export const randomSecret = () => { // the first 4 bytes of the namehash of enslabs.eth const platformSource = '9923eb94' @@ -31,6 +33,7 @@ const defaultData: RegistrationReducerDataItem = { name: '', isMoonpayFlow: false, externalTransactionId: '', + chainId: 1, } const isBrowser = !!( @@ -57,7 +60,11 @@ const makeDefaultData = (selected: SelectedItemProperties): RegistrationReducerD export const getSelectedIndex = ( state: RegistrationReducerData, selected: SelectedItemProperties, -) => state.items.findIndex((x) => x.address === selected.address && x.name === selected.name) +) => + state.items.findIndex( + (x) => + x.address === selected.address && x.name === selected.name && x.chainId === selected.chainId, + ) /* eslint-disable no-param-reassign */ const reducer = (state: RegistrationReducerData, action: RegistrationReducerAction) => { @@ -138,7 +145,8 @@ const useRegistrationReducer = ({ address: string | undefined name: string }) => { - const selected = { address, name } as SelectedItemProperties + const chainId = useChainId() + const selected = { address: address!, name, chainId } as const const [state, dispatch] = useLocalStorageReducer< RegistrationReducerData, RegistrationReducerAction diff --git a/src/pages/register.tsx b/src/pages/register.tsx index 4ae5665bf..5df1e3af3 100644 --- a/src/pages/register.tsx +++ b/src/pages/register.tsx @@ -2,6 +2,7 @@ import { ReactElement } from 'react' import { useAccount } from 'wagmi' import Registration from '@app/components/pages/profile/[name]/registration/Registration' +import { useChainId } from '@app/hooks/useChainId' import { useInitial } from '@app/hooks/useInitial' import { useNameDetails } from '@app/hooks/useNameDetails' import { getSelectedIndex } from '@app/hooks/useRegistrationReducer' @@ -15,6 +16,7 @@ export default function Page() { const initial = useInitial() const { address } = useAccount() + const chainId = useChainId() const nameDetails = useNameDetails(name, true) const { isLoading: detailsLoading, registrationStatus } = nameDetails @@ -31,6 +33,7 @@ export default function Page() { const index = getSelectedIndex(registrationData, { address: address!, name: nameDetails.normalisedName, + chainId, }) if (index !== -1) { const { stepIndex, queue } = registrationData.items[index]