refactor(assets): remove write-only video state from MediaAsset context

src/platform/assets/components/MediaAssetCard.vue

@@ -43,8 +43,6 @@
         "
         class="absolute inset-0"
         @download="handleDownload"
-        @video-playing-state-changed="isVideoPlaying = $event"
-        @video-controls-changed="showVideoControls = $event"
         @image-loaded="handleImageLoaded"
       />
 
@@ -243,9 +241,6 @@ const emit = defineEmits<{
   'context-menu': [event: MouseEvent, asset: AssetItem]
 }>()
 
-const isVideoPlaying = ref(false)
-const showVideoControls = ref(false)
-
 // Store actual image dimensions
 const imageDimensions = ref<{ width: number; height: number } | undefined>()
 
@@ -299,9 +294,7 @@ const adaptedAsset = computed(() => {
 
 provide(MediaAssetKey, {
   asset: toRef(() => adaptedAsset.value),
-  context: toRef(() => ({ type: assetType.value })),
-  isVideoPlaying,
-  showVideoControls
+  context: toRef(() => ({ type: assetType.value }))
 })
 
 const formattedDuration = computed(() => {

src/platform/assets/components/MediaVideoTop.test.ts

@@ -53,31 +53,32 @@ describe('MediaVideoTop', () => {
     expect(container.querySelector('source')).not.toBeInTheDocument()
   })
 
-  it('emits playback events and hides paused overlay while playing', async () => {
+  it('shows native controls only while playing and hovered', async () => {
     const user = userEvent.setup()
-    const { container, emitted } = render(MediaVideoTop, {
+    const { container } = render(MediaVideoTop, {
       props: {
         asset: createVideoAsset('https://example.com/thumb.jpg')
       }
     })
 
     // eslint-disable-next-line testing-library/no-container, testing-library/no-node-access -- <video> has no ARIA role in happy-dom
     const video = container.querySelector('video')!
-    expect(video).toBeInTheDocument()
+    // eslint-disable-next-line testing-library/no-node-access -- root wrapper has no role
+    const wrapper = container.firstElementChild!
 
     await fireEvent.play(video)
-    expect(emitted()['videoPlayingStateChanged']?.at(-1)).toEqual([true])
+    expect(video.controls).toBe(false)
 
-    // eslint-disable-next-line testing-library/no-node-access -- root wrapper has no role
-    await user.hover(container.firstElementChild!)
+    await user.hover(wrapper)
     expect(video.controls).toBe(true)
 
-    // eslint-disable-next-line testing-library/no-node-access -- root wrapper has no role
-    await user.unhover(container.firstElementChild!)
+    await fireEvent.pause(video)
     expect(video.controls).toBe(false)
 
-    await fireEvent.pause(video)
-    expect(emitted()['videoPlayingStateChanged']?.at(-1)).toEqual([false])
+    await fireEvent.play(video)
+    expect(video.controls).toBe(true)
+
+    await user.unhover(wrapper)
     expect(video.controls).toBe(false)
   })
 

src/platform/assets/components/MediaVideoTop.vue

@@ -27,7 +27,7 @@
 </template>
 
 <script setup lang="ts">
-import { computed, onMounted, ref, watch } from 'vue'
+import { computed, ref } from 'vue'
 
 import type { AssetMeta } from '../schemas/mediaAssetSchema'
 
@@ -38,11 +38,6 @@ const { asset, showNativeControls = true } = defineProps<{
   showNativeControls?: boolean
 }>()
 
-const emit = defineEmits<{
-  videoPlayingStateChanged: [isPlaying: boolean]
-  videoControlsChanged: [showControls: boolean]
-}>()
-
 const videoElement = ref<HTMLVideoElement | null>(null)
 const isHovered = ref(false)
 const isPlaying = ref(false)
@@ -52,22 +47,12 @@ const shouldShowControls = computed(
   () => showNativeControls && isPlaying.value && isHovered.value
 )
 
-watch(shouldShowControls, (controlsVisible) => {
-  emit('videoControlsChanged', controlsVisible)
-})
-
-onMounted(() => {
-  emit('videoControlsChanged', shouldShowControls.value)
-})
-
 const onVideoPlay = () => {
   isPlaying.value = true
-  emit('videoPlayingStateChanged', true)
 }
 
 const onVideoPause = () => {
   isPlaying.value = false
-  emit('videoPlayingStateChanged', false)
 }
 
 async function onVideoClick(event: MouseEvent) {

src/platform/assets/composables/useMediaAssetActions.test.ts

@@ -275,9 +275,7 @@ function mountMediaActions(asset?: AssetMeta) {
     setup() {
       provide(MediaAssetKey, {
         asset: ref(asset),
-        context: ref({ type: 'input' as const }),
-        isVideoPlaying: ref(false),
-        showVideoControls: ref(false)
+        context: ref({ type: 'input' as const })
       })
       return () => h(ChildComponent)
     }

src/platform/assets/schemas/mediaAssetSchema.ts

@@ -45,8 +45,6 @@ export type AssetContext = z.infer<typeof zAssetContextSchema>
 interface MediaAssetProviderValue {
   asset: Ref<AssetMeta | undefined>
   context: Ref<AssetContext>
-  isVideoPlaying: Ref<boolean>
-  showVideoControls: Ref<boolean>
 }
 
 export const MediaAssetKey: InjectionKey<MediaAssetProviderValue> =