From 6046647aa08728b0728a7fde75bbaacfd9249545 Mon Sep 17 00:00:00 2001
From: Jon Staab <jstaab@protonmail.com>
Date: Thu, 2 Jul 2026 16:52:36 -0700
Subject: [PATCH] Fix loading in profile picture input

---
 src/app/components/InputProfilePicture.svelte | 40 ++++++++++---------
 1 file changed, 21 insertions(+), 19 deletions(-)

diff --git a/src/app/components/InputProfilePicture.svelte b/src/app/components/InputProfilePicture.svelte
index 316773ff..264a3084 100644
--- a/src/app/components/InputProfilePicture.svelte
+++ b/src/app/components/InputProfilePicture.svelte
@@ -1,5 +1,5 @@
 <script lang="ts">
-  import {randomId, call} from "@welshman/lib"
+  import {randomId} from "@welshman/lib"
   import {preventDefault, stopPropagation, compressFile} from "@lib/html"
   import CloseCircle from "@assets/icons/close-circle.svg?dataurl"
   import AddCircle from "@assets/icons/add-circle.svg?dataurl"
@@ -36,32 +36,22 @@
   const onDrop = async (e: any) => {
     active = false
 
-    file = await compressFile(e.dataTransfer.files[0], compressOptions)
+    submit(e.dataTransfer.files[0])
   }
 
   const onChange = async (e: any) => {
-    file = await compressFile(e.target.files[0], compressOptions)
+    submit(e.target.files[0])
   }
 
-  const onClear = () => {
-    initialUrl = undefined
-    file = undefined
-    url = undefined
-  }
+  const submit = async (file: File) => {
+    loading = true
 
-  let active = $state(false)
-  let loading = $state(false)
-  let initialUrl = $state(url)
+    try {
+      file = await compressFile(file, compressOptions)
 
-  $effect(() => {
-    call(async () => {
       if (file) {
-        loading = true
-
         const {result} = await uploadFile(file)
 
-        loading = false
-
         if (result?.url) {
           url = result.url
         } else {
@@ -80,8 +70,20 @@
       } else {
         url = initialUrl
       }
-    })
-  })
+    } finally {
+      loading = false
+    }
+  }
+
+  const onClear = () => {
+    initialUrl = undefined
+    file = undefined
+    url = undefined
+  }
+
+  let active = $state(false)
+  let loading = $state(false)
+  let initialUrl = $state(url)
 </script>
 
 <form>