refactor: use new documents interfaces

Signed-off-by: Sebastian Krupinski <krupinski01@gmail.com>

src/pages/FilesPage.vue

@@ -1,7 +1,7 @@
 <script setup lang="ts">
-import { ref, computed, onMounted, watch, nextTick } from 'vue'
+import { ref, computed, onMounted, watch, nextTick, defineAsyncComponent } from 'vue'
 import { useDisplay } from 'vuetify'
-import { useModuleStore } from '@KTXC'
+import { useModuleStore, useIntegrationStore } from '@KTXC'
 import { useFileManager, useFileSelection, useFileUpload, useFileEditor } from '@/composables'
 import type { ViewMode, SortField, SortOrder, BreadcrumbItem } from '@/types'
 import { CollectionObject } from '@DocumentsManager/models/collection'
@@ -20,7 +20,6 @@ import {
   FilesGridView,
   FilesListView,
   FilesDetailsView,
-  FileViewerDialog,
   FileEditorDialog,
   NewFolderDialog,
   RenameDialog,
@@ -33,6 +32,7 @@ const display = useDisplay()
 const isMobile = computed(() => display.mdAndDown.value)
 
 const moduleStore = useModuleStore()
+const integrationStore = useIntegrationStore()
 const isFileManagerAvailable = computed(() => {
   return moduleStore.has('documents_manager') || moduleStore.has('DocumentsManager')
 })
@@ -98,9 +98,45 @@ const uploadPreparationMessage = ref('Preparing uploads...')
 const uploadPreparationProcessedCount = ref(0)
 const uploadPreparationTotalCount = ref(0)
 
-// Viewer state
-const viewerEntity = ref<EntityObject | null>(null)
+// Viewer state — the media viewer dialog is provided by the media_viewer module
+// and resolved from the integration store so Documents does not import it.
+interface ViewerItem {
+  id: string
+  title: string
+  mime: string
+  size?: number | null
+  meta?: Record<string, unknown>
+}
+
 const showViewer = ref(false)
+const viewerIndex = ref(0)
+
+const mediaViewerDialog = computed(() => {
+  // Integration ids are prefixed with the module handle (e.g. 'media_viewer.dialog').
+  const entry = integrationStore.getItems('media_viewer').find(i => i.id.endsWith('.dialog'))
+  return entry?.component ? defineAsyncComponent(entry.component as () => Promise<unknown>) : null
+})
+
+const viewerItems = computed<ViewerItem[]>(() =>
+  sortedItems.value.entities.map(entityToViewerItem),
+)
+
+function entityToViewerItem(entity: EntityObject): ViewerItem {
+  return {
+    id: String(entity.identifier ?? ''),
+    title: entity.properties.label ?? String(entity.identifier ?? ''),
+    mime: entity.properties.mime ?? '',
+    meta: { collection: entity.collection ? String(entity.collection) : null },
+  }
+}
+
+function resolveViewerSource(item: ViewerItem): string {
+  return fileManager.getEntityUrl(item.id, (item.meta?.collection as string | null) ?? null)
+}
+
+function downloadViewerItem(item: ViewerItem): void {
+  fileManager.downloadEntity(item.id, (item.meta?.collection as string | null) ?? null)
+}
 
 // Editor state
 const fileEditorComposable = useFileEditor()
@@ -163,7 +199,9 @@ async function queueFolderUploads(
 
 function handleOpenItem(item: CollectionObject | EntityObject) {
   if (item instanceof EntityObject) {
-    viewerEntity.value = item
+    const id = String(item.identifier ?? '')
+    const idx = viewerItems.value.findIndex(m => m.id === id)
+    viewerIndex.value = idx >= 0 ? idx : 0
     showViewer.value = true
   } else {
     // Folders: navigate into them when opened via double-click / action
@@ -172,10 +210,6 @@ function handleOpenItem(item: CollectionObject | EntityObject) {
   }
 }
 
-function handleViewerNavigate(entity: EntityObject) {
-  viewerEntity.value = entity
-}
-
 function handleEditItem(item: CollectionObject | EntityObject) {
   if (item instanceof EntityObject && fileEditorComposable.canEdit(item)) {
     editorEntity.value = item
@@ -747,6 +781,7 @@ onMounted(async () => {
                 :collections="sortedItems.collections"
                 :entities="sortedItems.entities"
                 :selected-ids="selectedIds"
+                :preview-source="resolveViewerSource"
                 @item-click="handleItemClick"
                 @open="handleOpenItem"
                 @edit="handleEditItem"
@@ -762,6 +797,7 @@ onMounted(async () => {
                 :collections="sortedItems.collections"
                 :entities="sortedItems.entities"
                 :selected-ids="selectedIds"
+                :preview-source="resolveViewerSource"
                 @item-click="handleItemClick"
                 @open="handleOpenItem"
                 @edit="handleEditItem"
@@ -777,6 +813,7 @@ onMounted(async () => {
                 :collections="sortedItems.collections"
                 :entities="sortedItems.entities"
                 :selected-ids="selectedIds"
+                :preview-source="resolveViewerSource"
                 @item-click="handleItemClick"
                 @open="handleOpenItem"
                 @edit="handleEditItem"
@@ -856,14 +893,17 @@ onMounted(async () => {
       @close="handleUploadDialogClose"
     />
 
-    <!-- File Viewer -->
-    <FileViewerDialog
+    <!-- File Viewer (provided by the media_viewer module) -->
+    <component
+      :is="mediaViewerDialog"
+      v-if="mediaViewerDialog"
       v-model="showViewer"
-      :entity="viewerEntity"
-      :all-entities="sortedItems.entities"
-      :get-url="fileManager.getEntityUrl"
-      :download-entity="fileManager.downloadEntity"
-      @navigate="handleViewerNavigate"
+      :items="viewerItems"
+      :index="viewerIndex"
+      :source="resolveViewerSource"
+      :download="downloadViewerItem"
+      :navigation="true"
+      @update:index="viewerIndex = $event"
     />
 
     <!-- File Editor -->