fix: vuetippy hover card updates

components/collectionDetailsPopover/CollectionDetailsPopover.vue

@@ -1,17 +1,14 @@
 <template>
   <tippy
-    interactive
-    :animate-fill="false"
     :append-to="body"
     placement="bottom"
     :delay="[showDelay, hideDelay]"
-    data-testid="identity"
-    :on-show="() => (show = true)">
+    data-testid="identity">
     <slot name="content" />
 
     <template #content>
       <div class="popover-container">
-        <CollectionDetailsPopoverContent v-if="show" :nft="nft" />
+        <CollectionDetailsPopoverContent :nft="nft" />
       </div>
     </template>
   </tippy>
@@ -34,8 +31,6 @@ withDefaults(
     hideDelay: 0,
   },
 )
-
-const show = ref(false)
 </script>
 
 <style lang="scss" scoped>

components/identity/module/IdentityPopover.vue

@@ -1,11 +1,8 @@
 <template>
   <tippy
     class="tippy-container"
-    interactive
-    :animate-fill="false"
     :append-to="body"
     boundary="viewport"
-    placement="bottom"
     :delay="0"
     data-testid="identity">
     <slot name="content" />

components/shared/view/BasicPopup.vue

@@ -1,10 +1,5 @@
 <template>
-  <tippy
-    class="tippy-container"
-    interactive
-    :animate-fill="false"
-    :placement="placement"
-    :delay="delay">
+  <tippy class="tippy-container" :placement="placement" :delay="delay">
     <slot name="content" />
 
     <template #content>

plugins/vueTippy.ts

@@ -1,24 +1,27 @@
-// import Vue from 'vue'
-// import VueTippy, { TippyComponent, tippy } from 'vue-tippy'
+import VueTippy, { setDefaultProps } from 'vue-tippy'
+import 'tippy.js/animations/shift-away.css'
 
-// let activeTippyInstance
-// window.addEventListener('scroll', () => {
-//   if (activeTippyInstance && activeTippyInstance.state.isVisible) {
-//     activeTippyInstance.hide()
-//     activeTippyInstance.reference.blur()
-//   }
-// })
-// tippy.setDefaults({
-//   onShow(instance) {
-//     activeTippyInstance = instance
-//   },
-// })
-
-// Vue.use(VueTippy)
-// Vue.component('VTippy', TippyComponent)
+let activeTippyInstance
+useEventListener('scroll', () => {
+  if (activeTippyInstance && activeTippyInstance.state.isVisible) {
+    activeTippyInstance.hide()
+    activeTippyInstance.reference.blur()
+  }
+})
 
-import VueTippy from 'vue-tippy'
+setDefaultProps({
+  onShow(instance) {
+    activeTippyInstance = instance
+  },
+})
 
 export default defineNuxtPlugin((nuxtApp) => {
-  nuxtApp.vueApp.use(VueTippy, {})
+  nuxtApp.vueApp.use(VueTippy, {
+    defaultProps: {
+      interactive: true,
+      animateFill: false,
+      animation: 'shift-away',
+      placement: 'bottom',
+    },
+  })
 })