From f3b6e6c846e32d375b8da27b5769a8f1140f9940 Mon Sep 17 00:00:00 2001
From: Jin Yi <jin12cc@gmail.com>
Date: Fri, 23 Jan 2026 17:26:41 +0900
Subject: [PATCH] refactor: applied code reivew

---
 src/platform/assets/components/ActiveMediaAssetCard.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/platform/assets/components/ActiveMediaAssetCard.vue b/src/platform/assets/components/ActiveMediaAssetCard.vue
index bb9d7295b..34a010f87 100644
--- a/src/platform/assets/components/ActiveMediaAssetCard.vue
+++ b/src/platform/assets/components/ActiveMediaAssetCard.vue
@@ -1,10 +1,13 @@
 <template>
   <div
     role="status"
+    tabindex="0"
     :aria-label="t('sideToolbar.activeJobStatus', { status: statusText })"
     class="flex flex-col gap-2 p-2 rounded-lg"
     @mouseenter="hovered = true"
     @mouseleave="hovered = false"
+    @focusin="hovered = true"
+    @focusout="hovered = false"
   >
     <!-- Thumbnail -->
     <div class="relative aspect-square overflow-hidden rounded-lg">
@@ -87,9 +90,7 @@ const { job } = defineProps<{ job: JobListItem }>()
 const { t } = useI18n()
 const hovered = ref(false)
 
-const { cancelAction, canCancelJob, runCancelJob } = useJobActions(
-  computed(() => (hovered.value ? job : null))
-)
+const { cancelAction, canCancelJob, runCancelJob } = useJobActions(() => job)
 
 const { progressBarPrimaryClass, hasProgressPercent, progressPercentStyle } =
   useProgressBarBackground()