api proxy & file listing

src/components/Controlbar.tsx

@@ -0,0 +1,10 @@
+import { component$ } from "@builder.io/qwik";
+
+// TODO: add upload button and other stuff fr
+export default component$(() => {
+    return (
+        <div class="absolute bottom-4 left-1/2 transform -translate-x-1/2 bg-red-400 w-1/4 p-4 rounded-lg flex items-center justify-center">
+            hi
+        </div>
+    )
+})

src/components/File.tsx

@@ -0,0 +1,15 @@
+import { component$ } from "@builder.io/qwik";
+import { StereoFile } from "~/lib/types";
+
+export default component$(({ file }: { file: StereoFile }) => {
+    return (
+        <div key={file.ID}>
+            <h2>Owner: {file.Owner}</h2>
+            <p>File ID: {file.ID}</p>
+            <p>Created: {new Date(file.CreatedAt).toLocaleString()}</p>
+            { file.Base64 && (file.ID.endsWith(".png") || file.ID.endsWith(".jpg") || file.ID.endsWith(".jpeg")) && (
+                <img src={`data:image/png;base64,${file.Base64}`} alt="Stereo File" class="w-full h-auto" />
+            )}
+        </div>
+    )
+})