From 7d98b1578021b5bbad7885b2449da39a8960f06b Mon Sep 17 00:00:00 2001
From: grngxd <36968271+grngxd@users.noreply.github.com>
Date: Sun, 8 Jun 2025 15:10:49 +0100
Subject: [PATCH] wrap file component in anchor tag for file serving

---
 src/components/File.tsx | 40 +++++++++++++++++++++-------------------
 1 file changed, 21 insertions(+), 19 deletions(-)

diff --git a/src/components/File.tsx b/src/components/File.tsx
index f852be9..60f9e4a 100644
--- a/src/components/File.tsx
+++ b/src/components/File.tsx
@@ -19,26 +19,28 @@ const formatSize = (bytes: number) => {
 
 export default component$(({ file }: FileProps) => {
     return (
-        <div class="rounded-xl bg-neutral-900 flex flex-col overflow-hidden">
-            { file.Base64 && (file.ID.endsWith(".png") || file.ID.endsWith(".jpg") || file.ID.endsWith(".jpeg")) && (
-                <img
-                    width={400}
-                    height={300}
-                    src={`data:image/png;base64,${file.Base64}`}
-                    alt={file.ID}
-                    class="w-full h-80 object-cover bg-gray-800 flex-grow"
-                />
-            )}
-            <div class="p-4 flex-grow-0 text-center">
-                <p class="text-lg font-semibold text-white w-full truncate">
-                    {file.ID.split("_").slice(1).join("_") || "Untitled"}
-                    </p>
-                <div class="flex gap-1 text-sm text-gray-400 items-center justify-center">
-                    <span>{formatSize(getBase64Size(file.Base64))}</span>
-                    <span class="text-gray-600">•</span>
-                    <p>Uploaded on {new Date(file.CreatedAt).toLocaleDateString()}</p>
+        <a href={`/api/${file.ID}`} target="_blank">
+            <div class="rounded-xl bg-neutral-900 flex flex-col overflow-hidden">
+                { file.Base64 && (file.ID.endsWith(".png") || file.ID.endsWith(".jpg") || file.ID.endsWith(".jpeg")) && (
+                    <img
+                        width={400}
+                        height={300}
+                        src={`data:image/png;base64,${file.Base64}`}
+                        alt={file.ID}
+                        class="w-full h-80 object-cover bg-gray-800 flex-grow"
+                    />
+                )}
+                <div class="p-4 flex-grow-0 text-center">
+                    <p class="text-lg font-semibold text-white w-full truncate">
+                        {file.ID.split("_").slice(1).join("_") || "Untitled"}
+                        </p>
+                    <div class="flex gap-1 text-sm text-gray-400 items-center justify-center">
+                        <span>{formatSize(getBase64Size(file.Base64))}</span>
+                        <span class="text-gray-600">•</span>
+                        <p>Uploaded on {new Date(file.CreatedAt).toLocaleDateString()}</p>
+                    </div>
                 </div>
             </div>
-        </div>
+        </a>
     )
 })
\ No newline at end of file