From 7c6bcdfe7a465e8d72019c010b67c7360e1c5512 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bal=C3=A1zs=20Sz=C3=BCcs?= <bszucs1209@gmail.com>
Date: Wed, 10 Dec 2025 10:39:06 +0100
Subject: [PATCH] feat(image-uploader): update background removal logic and
 store original image data
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Balázs Szücs <bszucs1209@gmail.com>
---
 .../annotation/shared/ImageUploader.tsx       | 20 ++++++++++++++++---
 .../components/tools/sign/SignSettings.tsx    |  1 -
 2 files changed, 17 insertions(+), 4 deletions(-)

diff --git a/frontend/src/core/components/annotation/shared/ImageUploader.tsx b/frontend/src/core/components/annotation/shared/ImageUploader.tsx
index 7dc5b8351..b9576f181 100644
--- a/frontend/src/core/components/annotation/shared/ImageUploader.tsx
+++ b/frontend/src/core/components/annotation/shared/ImageUploader.tsx
@@ -26,8 +26,9 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
   currentImageData
 }) => {
   const { t } = useTranslation();
-  const [removeBackground, setRemoveBackground] = useState(true);
+  const [removeBackground, setRemoveBackground] = useState(false);
   const [currentFile, setCurrentFile] = useState<File | null>(null);
+  const [originalImageData, setOriginalImageData] = useState<string | null>(null);
   const [isProcessing, setIsProcessing] = useState(false);
 
   const processImage = async (imageSource: File | string, shouldRemoveBackground: boolean) => {
@@ -47,6 +48,9 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
         setIsProcessing(false);
       }
     } else {
+      if (originalImageData) {
+        onProcessedImageData?.(originalImageData);
+      }
       setIsProcessing(false);
     }
     return null;
@@ -63,6 +67,15 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
 
         setCurrentFile(file);
         onImageChange(file);
+
+        const originalDataUrl = await new Promise<string>((resolve, reject) => {
+          const reader = new FileReader();
+          reader.onload = (e) => resolve(e.target?.result as string);
+          reader.onerror = () => reject(reader.error);
+          reader.readAsDataURL(file);
+        });
+
+        setOriginalImageData(originalDataUrl);
         await processImage(file, removeBackground);
       } catch (error) {
         console.error('Error processing image file:', error);
@@ -70,6 +83,7 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
     } else if (!file) {
       // Clear image data when no file is selected
       setCurrentFile(null);
+      setOriginalImageData(null);
       onImageChange(null);
       onProcessedImageData?.(null);
     }
@@ -77,8 +91,8 @@ export const ImageUploader: React.FC<ImageUploaderProps> = ({
 
   const handleBackgroundRemovalChange = async (checked: boolean) => {
     setRemoveBackground(checked);
-    if (currentImageData) {
-      await processImage(currentImageData, checked);
+    if (originalImageData) {
+      await processImage(originalImageData, checked);
     } else if (currentFile) {
       await processImage(currentFile, checked);
     }
diff --git a/frontend/src/core/components/tools/sign/SignSettings.tsx b/frontend/src/core/components/tools/sign/SignSettings.tsx
index 8ad80ed3b..0726a3963 100644
--- a/frontend/src/core/components/tools/sign/SignSettings.tsx
+++ b/frontend/src/core/components/tools/sign/SignSettings.tsx
@@ -835,7 +835,6 @@ const SignSettings = ({
             onImageChange={handleImageChange}
             disabled={disabled}
             allowBackgroundRemoval={true}
-            currentImageData={imageSignatureData}
             onProcessedImageData={(dataUrl) => {
               if (dataUrl) {
                 setImageSignatureData(dataUrl);