ffs bruno

src/lib/components/ui/input/input-file.svelte

@@ -7,7 +7,7 @@
 		/**
 		 * Ignored.
 		 */
-        // eslint-disable-next-line
+		// eslint-disable-next-line
 		type = "file",
 
 		// Events
@@ -55,7 +55,6 @@
 		ev.stopPropagation();
 		ev.preventDefault();
 	}}
-
 	{onblur}
 	{onchange}
 	{onclick}

src/lib/drizzle.ts

@@ -121,7 +121,7 @@ export type EmailAddressesInsertModel = InferInsertModel<
 /**
  * This is a table that allows us to do a quick and dirty user public assets api
  *
- * This is to be used for things like profile pictures
+ * This is to be used for things like profile pictures, which are *public*
  */
 export const publicAssetTable = sqliteTable("public_assets", {
 	/**

src/routes/(auth)/auth/login/+page.svelte

@@ -3,7 +3,7 @@
 
 	import { Button } from "@/ui/button";
 	import { Label } from "@/ui/label";
-	import { Input, File } from "@/ui/input";
+	import { Input, File as FileInput } from "@/ui/input";
 	import * as Card from "@/ui/card";
 
 	import { PAGE_TRANSITION_TIME } from "$lib";
@@ -12,17 +12,22 @@
 
 	let username = $state("");
 	let password = $state("");
-	let secret_key_filelist: FileList | undefined = $state(undefined);
+	let secret_key_file: File | null = $state(null);
 
-	$effect(() => {
-		if (secret_key_filelist && secret_key_filelist.item(0)) {
-			const blob_url = URL.createObjectURL(secret_key_filelist.item(0)!);
-			fetch(blob_url)
-				.then((res) => res.json())
-				.then(console.log);
+	const secret_key_json = $derived.by(async () => {
+		if (secret_key_file) {
+			const blob_url = URL.createObjectURL(secret_key_file);
+			const blob_response = await fetch(blob_url);
+			return await blob_response.json();
+		} else {
+			return null;
 		}
 	});
 
+	$inspect(secret_key_json).with(async (type, val) =>
+		console.log(type, await val),
+	);
+
 	const onsubmit = (ev: SubmitEvent) => {
 		ev.preventDefault();
 	};
@@ -60,7 +65,7 @@
 
 						<div class="flex flex-col space-y-1.5">
 							<Label for="secret-key">Secret Key</Label>
-							<File
+							<FileInput
 								id="secret-key"
 								class="cursor-pointer"
 								accept="application/json"
@@ -70,7 +75,8 @@
 									)
 										return;
 									if (ev.target.files)
-										secret_key_filelist = ev.target.files;
+										secret_key_file =
+											ev.target.files.item(0);
 								}}
 								ondrop={(ev) => {
 									// handle drag and drop.
@@ -79,7 +85,7 @@
 
 									const dt = ev.dataTransfer;
 									if (dt && dt.files)
-										secret_key_filelist = dt.files;
+										secret_key_file = dt.files.item(0);
 								}}
 							/>
 						</div>