feat(ui/trash): show original file path in tooltip on mouse over + display thumbnails

* fix: permission also check elements trashed elements
 * tested manually
 * all automated tests ok

static/js/app/trashView.js

@@ -6,9 +6,13 @@ import { escapeHtml, formatDateTime } from '../core/formatters.js';
 import { i18n } from '../core/i18n.js';
 import { fileOps } from '../features/files/fileOperations.js';
 import { multiSelect } from '../features/files/multiSelect.js';
+import * as pathTooltip from '../features/pathTooltip.js';
 import { appElements } from './state.js';
 import { ui } from './ui.js';
 
+/** Categories whose items have a server-side thumbnail. */
+const THUMBNAILABLE = new Set(['image', 'video', 'pdf']);
+
 /**
  *
  * @import {TrashItem} from '../core/types.js'
@@ -19,6 +23,7 @@ async function loadTrashItems() {
 
     try {
         if (multiSelect) multiSelect.clear();
+        pathTooltip.destroy(elements.filesList);
         ui.resetFilesList(); // ensure also list visible & error hidden
         elements.filesList.innerHTML = `
             <div class="list-header trash-header">
@@ -45,6 +50,7 @@ async function loadTrashItems() {
         trashItems.forEach((item) => {
             addTrashItemToView(item);
         });
+        pathTooltip.init(elements.filesList);
     } catch (error) {
         console.error('Error loading trash items:', error);
         ui.showNotification('Error', 'Error loading trash items');
@@ -76,17 +82,20 @@ function addTrashItemToView(item) {
 
     const isFolder = !isFile;
     const iconWrapClass = isFolder ? 'file-icon folder-icon' : `file-icon ${iconSpecialClass}`.trim();
+    const canThumbnail = isFile && THUMBNAILABLE.has((item.category || '').toLowerCase());
 
     const listElement = document.createElement('div');
     listElement.className = 'file-item trash-item';
     listElement.dataset.trashId = item.id;
     listElement.dataset.originalId = item.original_id;
     listElement.dataset.itemType = item.item_type;
+    if (item.original_path) listElement.dataset.path = item.original_path;
 
     listElement.innerHTML = `
         <div class="name-cell">
             <div class="${iconWrapClass}">
                 <i class="${iconClass}"></i>
+                ${canThumbnail ? `<img class="file-thumb" src="/api/files/${item.original_id}/thumbnail/icon" loading="lazy" alt="">` : ''}
             </div>
             <span>${escapeHtml(item.name)}</span>
         </div>