From 6e38ba855c1b9b4682c969a2c4a8fc015b3caa4e Mon Sep 17 00:00:00 2001
From: Jan-Henrik Bruhn <jan-henrik.bruhn@offis.de>
Date: Mon, 22 Dec 2025 11:52:18 +0100
Subject: [PATCH] fix: Prevent button activation during post-upload state
 synchronization
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fix the Choose File button remaining clickable during the brief window between upload completion and pattern info retrieval. The issue was that labels don't support the disabled attribute, so when using asChild with a label, the disabled state was ignored.

Changes:
- Only use asChild when button is enabled (labels can't be disabled)
- Keep input and button disabled conditions synchronized
- Add uploadProgress check to prevent re-enabling before patternUploaded is true

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
---
 src/components/FileUpload.tsx | 26 ++++++++++++++++++++++----
 1 file changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/components/FileUpload.tsx b/src/components/FileUpload.tsx
index 5c05105..0c1ebc8 100644
--- a/src/components/FileUpload.tsx
+++ b/src/components/FileUpload.tsx
@@ -256,16 +256,34 @@ export function FileUpload() {
             onChange={handleFileChange}
             id="file-input"
             className="hidden"
-            disabled={isLoading || patternUploaded || isUploading}
+            disabled={
+              isLoading ||
+              patternUploaded ||
+              isUploading ||
+              (uploadProgress > 0 && !patternUploaded)
+            }
           />
           <Button
-            asChild={!fileService.hasNativeDialogs()}
+            asChild={
+              !fileService.hasNativeDialogs() &&
+              !(
+                isLoading ||
+                patternUploaded ||
+                isUploading ||
+                (uploadProgress > 0 && !patternUploaded)
+              )
+            }
             onClick={
               fileService.hasNativeDialogs()
                 ? () => handleFileChange()
                 : undefined
             }
-            disabled={isLoading || patternUploaded || isUploading}
+            disabled={
+              isLoading ||
+              patternUploaded ||
+              isUploading ||
+              (uploadProgress > 0 && !patternUploaded)
+            }
             variant="outline"
             className="flex-[2]"
           >
@@ -289,7 +307,7 @@ export function FileUpload() {
                 )}
               </>
             ) : (
-              <label htmlFor="file-input" className="flex items-center gap-2">
+              <label htmlFor="file-input" className="flex items-center gap-2 cursor-pointer">
                 {isLoading ? (
                   <>
                     <Loader2 className="w-3.5 h-3.5 animate-spin" />