import { type GetConnectionReturnType, watchConnection } from '@wagmi/core' import type { Compute, ConfigParameter } from '@wagmi/core/internal' import { watchEffect } from 'vue' import type { DeepMaybeRef } from '../types/ref.js' import { deepUnref } from '../utils/cloneDeep.js' import { useConfig } from './useConfig.js' export type UseConnectionEffectParameters = Compute< DeepMaybeRef< { onConnect?( data: Compute< Pick< Extract, 'address' | 'addresses' | 'chain' | 'chainId' | 'connector' > & { isReconnected: boolean } >, ): void onDisconnect?(): void } & ConfigParameter > > /** https://wagmi.sh/vue/api/composables/useConnectionEffect */ export function useConnectionEffect( parameters: UseConnectionEffectParameters = {}, ) { const config = useConfig(parameters) watchEffect((onCleanup) => { const { onConnect, onDisconnect } = deepUnref(parameters) const unwatch = watchConnection(config, { onChange(data, prevData) { if ( (prevData.status === 'reconnecting' || (prevData.status === 'connecting' && prevData.address === undefined)) && data.status === 'connected' ) { const { address, addresses, chain, chainId, connector } = data const isReconnected = prevData.status === 'reconnecting' || // if `previousAccount.status` is `undefined`, the connector connected immediately. prevData.status === undefined onConnect?.({ address, addresses, chain, chainId, connector, isReconnected, }) } else if ( prevData.status === 'connected' && data.status === 'disconnected' ) onDisconnect?.() }, }) onCleanup(() => unwatch()) }) }