Передаем на тест

frontend/src/components/storage/FileList.svelte

@@ -0,0 +1,85 @@
+<!-- [DEF:FileList:Component] -->
+<!--
+@SEMANTICS: storage, files, list, table
+@PURPOSE:   Displays a table of files with metadata and actions.
+@LAYER:     Component
+@RELATION:  DEPENDS_ON -> storageService
+
+@PROPS:     files (Array) - List of StoredFile objects.
+@EVENTS:    delete (filename) - Dispatched when a file is deleted.
+-->
+
+<script lang="ts">
+  // [SECTION: IMPORTS]
+  import { createEventDispatcher } from 'svelte';
+  import { downloadFileUrl } from '../../services/storageService';
+  // [/SECTION: IMPORTS]
+
+  export let files = [];
+  const dispatch = createEventDispatcher();
+
+  function formatSize(bytes) {
+    if (bytes === 0) return '0 B';
+    const k = 1024;
+    const sizes = ['B', 'KB', 'MB', 'GB', 'TB'];
+    const i = Math.floor(Math.log(bytes) / Math.log(k));
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+  }
+
+  function formatDate(dateStr) {
+    return new Date(dateStr).toLocaleString();
+  }
+</script>
+
+<!-- [SECTION: TEMPLATE] -->
+<div class="overflow-x-auto">
+  <table class="min-w-full bg-white border border-gray-200">
+    <thead class="bg-gray-50">
+      <tr>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Name</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Category</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Size</th>
+        <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Created At</th>
+        <th class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">Actions</th>
+      </tr>
+    </thead>
+    <tbody class="divide-y divide-gray-200">
+      {#each files as file}
+        <tr class="hover:bg-gray-50">
+          <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">{file.name}</td>
+          <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500 capitalize">{file.category}</td>
+          <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">{formatSize(file.size)}</td>
+          <td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">{formatDate(file.created_at)}</td>
+          <td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
+            <a 
+              href={downloadFileUrl(file.category, file.name)} 
+              download={file.name}
+              class="text-indigo-600 hover:text-indigo-900 mr-4"
+            >
+              Download
+            </a>
+            <button 
+              on:click={() => dispatch('delete', { category: file.category, filename: file.name })}
+              class="text-red-600 hover:text-red-900"
+            >
+              Delete
+            </button>
+          </td>
+        </tr>
+      {:else}
+        <tr>
+          <td colspan="5" class="px-6 py-10 text-center text-sm text-gray-500">
+            No files found.
+          </td>
+        </tr>
+      {/each}
+    </tbody>
+  </table>
+</div>
+<!-- [/SECTION: TEMPLATE] -->
+
+<style>
+  /* ... */
+</style>
+
+<!-- [/DEF:FileList:Component] -->