diff --git a/app/components/Viewer/ObjectTree/Base/CommonTreeView.vue b/app/components/Viewer/ObjectTree/Base/CommonTreeView.vue
index a6a7b497c..891e0f690 100644
--- a/app/components/Viewer/ObjectTree/Base/CommonTreeView.vue
+++ b/app/components/Viewer/ObjectTree/Base/CommonTreeView.vue
@@ -124,6 +124,8 @@ const { focusedIndex, handleKeyDown } = useTreeKeyboardNav(
             :get-indeterminate="getIndeterminate"
             @toggle-open="toggleOpen"
             @toggle-select="toggleSelect"
+            @hover-eye-enter="emit('hover:leave', { item })"
+            @hover-eye-leave="emit('hover:enter', { item })"
           >
             <template #title="slotProps">
               <slot name="title" v-bind="slotProps" />
diff --git a/app/components/Viewer/ObjectTree/Base/TreeRow.vue b/app/components/Viewer/ObjectTree/Base/TreeRow.vue
index 005b18537..f9d24437c 100644
--- a/app/components/Viewer/ObjectTree/Base/TreeRow.vue
+++ b/app/components/Viewer/ObjectTree/Base/TreeRow.vue
@@ -7,7 +7,7 @@ const { item, itemProps, selection, isSelected, getIndeterminate } = defineProps
   getIndeterminate: { type: Function, required: true },
 });
 
-defineEmits(["toggle-open", "toggle-select"]);
+defineEmits(["toggle-open", "toggle-select", "hover-eye-enter", "hover-eye-leave"]);
 
 const INDENT_STEP = 10;
 </script>
@@ -45,6 +45,8 @@ const INDENT_STEP = 10;
         class="flex-shrink-0"
         @click.stop="$emit('toggle-select', item.raw)"
         @mousedown.stop
+        @mouseenter="$emit('hover-eye-enter', item.raw)"
+        @mouseleave="$emit('hover-eye-leave', item.raw)"
       />
     </div>