diff --git a/components/account/AccountHoverWrapper.vue b/components/account/AccountHoverWrapper.vue index a6c8d815..13ba07e7 100644 --- a/components/account/AccountHoverWrapper.vue +++ b/components/account/AccountHoverWrapper.vue @@ -2,39 +2,33 @@ import type { mastodon } from 'masto' import { fetchAccountByHandle } from '~/composables/cache' -type WatcherType = [acc?: mastodon.v1.Account, h?: string, v?: boolean] +type WatcherType = [acc?: mastodon.v1.Account | null, h?: string, v?: boolean] defineOptions({ inheritAttrs: false, }) const props = defineProps<{ - account?: mastodon.v1.Account + account?: mastodon.v1.Account | null handle?: string disabled?: boolean }>() -const hoverCard = ref() -const targetIsVisible = ref(false) +const accountHover = ref() +const hovered = useElementHover(accountHover) const account = ref(props.account) -useIntersectionObserver( - hoverCard, - ([{ intersectionRatio }]) => { - targetIsVisible.value = intersectionRatio > 0.1 - }, -) watch( - () => [props.account, props.handle, targetIsVisible.value] satisfies WatcherType, + () => [props.account, props.handle, hovered.value] satisfies WatcherType, ([newAccount, newHandle, newVisible], oldProps) => { + if (!newVisible || process.test) + return + if (newAccount) { account.value = newAccount return } - if (!newVisible || process.test) - return - if (newHandle) { const [_oldAccount, oldHandle, _oldVisible] = oldProps ?? [undefined, undefined, false] if (!oldHandle || newHandle !== oldHandle || !account.value) { @@ -56,8 +50,14 @@ const userSettings = useUserSettings()