Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-05-03 04:31:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor: simplify hover state management in WorkflowTemplateSelectorDialog

Browse Source
This commit is contained in:
Johnpaul
2025-09-23 00:41:50 +01:00
parent c7b4ec815c
commit 430549767f
1 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/custom/widget/WorkflowTemplateSelectorDialog.vue
View File

@@ -146,8 +146,8 @@
:min-width="200"
class="cursor-pointer transition-all duration-300 hover:scale-[1.02]"
:data-testid="`template-workflow-${template.name}`"
@mouseenter="hoveredTemplates[template.name] = true"
@mouseleave="hoveredTemplates[template.name] = false"
@mouseenter="hoveredTemplate = template.name"
@mouseleave="hoveredTemplate = null"
@click="onLoadWorkflow(template)"
>
<template #top>
@@ -170,7 +170,7 @@
getEffectiveSourceModule(template)
)
"
:is-hovered="hoveredTemplates[template.name] || false"
:is-hovered="hoveredTemplate === template.name"
:is-video="
template.mediaType === 'video' ||
template.mediaSubtype === 'webp'
@@ -189,7 +189,7 @@
getEffectiveSourceModule(template)
)
"
:is-hovered="hoveredTemplates[template.name] || false"
:is-hovered="hoveredTemplate === template.name"
:is-video="
template.mediaType === 'video' ||
template.mediaSubtype === 'webp'
@@ -205,7 +205,7 @@
getEffectiveSourceModule(template)
)
"
:is-hovered="hoveredTemplates[template.name] || false"
:is-hovered="hoveredTemplate === template.name"
:is-video="
template.mediaType === 'video' ||
template.mediaSubtype === 'webp'
@@ -277,7 +277,7 @@
v-tooltip.bottom="$t('g.seeTutorial')"
:class="[
'inline-flex items-center justify-center rounded-lg bg-[#FDFBFA] w-8 h-8 cursor-pointer transition-opacity duration-200',
hoveredTemplates[template.name]
hoveredTemplate === template.name
? 'opacity-100'
: 'opacity-0 pointer-events-none'
]"
@@ -491,7 +491,7 @@ const selectedLicenseObjects = computed({
// Loading states
const isLoading = ref(true)
const loadingTemplate = ref<string | null>(null)
const hoveredTemplates = ref<Record<string, boolean>>({})
const hoveredTemplate = ref<string | null>(null)
const cardRefs = ref<HTMLElement[]>([])
// Navigation