feat: facial recognition (#2180)

web/src/lib/components/assets/thumbnail/image-thumbnail.svelte

@@ -1,9 +1,13 @@
 <script lang="ts">
+	import { imageLoad } from '$lib/utils/image-load';
+
 	export let url: string;
 	export let altText: string;
-	export let heightStyle: string;
+	export let heightStyle: string | undefined = undefined;
 	export let widthStyle: string;
-
+	export let curve = false;
+	export let shadow = false;
+	export let circle = false;
 	let loading = true;
 </script>
 
@@ -13,7 +17,11 @@
 	src={url}
 	alt={altText}
 	class="object-cover transition-opacity duration-300"
+	class:rounded-lg={curve}
+	class:shadow-lg={shadow}
+	class:rounded-full={circle}
 	class:opacity-0={loading}
 	draggable="false"
-	on:load|once={() => (loading = false)}
+	use:imageLoad
+	on:image-load|once={() => (loading = false)}
 />