refactor: use new documents interfaces

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

src/components/views/FilesGridView.vue

@@ -2,12 +2,15 @@
 import { CollectionObject } from '@DocumentsManager/models/collection'
 import { EntityObject } from '@DocumentsManager/models/entity'
 import { getFileIcon, formatSize } from '@/utils/fileHelpers'
-import { FileActionsMenu } from '@/components'
+import { FileActionsMenu, FilePreviewPopover } from '@/components'
+
+type PreviewSource = (item: { id: string; meta?: Record<string, unknown> }) => string | Blob | Promise<string | Blob>
 
 defineProps<{
   collections: CollectionObject[]
   entities: EntityObject[]
   selectedIds: Set<string>
+  previewSource?: PreviewSource
 }>()
 
 const emit = defineEmits<{
@@ -73,6 +76,13 @@ const emit = defineEmits<{
       <v-icon size="48" color="grey">{{ getFileIcon(entity) }}</v-icon>
       <div class="files-grid-label">{{ entity.properties.label || String(entity.identifier ?? '') }}</div>
       <div class="files-grid-size">{{ formatSize(entity.properties.size) }}</div>
+
+      <FilePreviewPopover
+        v-if="previewSource"
+        :entity="entity"
+        :source="previewSource"
+        @expand="emit('open', $event)"
+      />
     </div>
   </div>
 </template>