From bb71e06dd84f30df90dbb99659b2b0d6e8c3b6e6 Mon Sep 17 00:00:00 2001
From: levig <levigft@gmail.com>
Date: Sun, 5 Jul 2026 01:41:43 -0300
Subject: [PATCH 1/2] feat(image-upload): make change/remove actions visually
 obvious
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Add a hover overlay over the image preview with clear icon actions — a camera to
change and an X to remove — so users can discover the actions instead of missing
the small text buttons. Works for both the square and circle shape variants and
applies everywhere ImageUpload is used.
---
 src/components/common/ImageUpload.tsx | 27 ++++++++++++++++++++++++++-
 1 file changed, 26 insertions(+), 1 deletion(-)

diff --git a/src/components/common/ImageUpload.tsx b/src/components/common/ImageUpload.tsx
index 648946f..77a3b28 100644
--- a/src/components/common/ImageUpload.tsx
+++ b/src/components/common/ImageUpload.tsx
@@ -1,5 +1,5 @@
 import { useRef, useState } from "react"
-import { Upload, X, Loader2 } from "lucide-react"
+import { Upload, X, Loader2, Camera } from "lucide-react"
 import { toast } from "sonner"
 import { uploadsAPI } from "@/services/api"
 import { cn } from "@/utils/cn"
@@ -87,6 +87,31 @@ export function ImageUpload({
         ) : (
           placeholder || <Upload className="h-6 w-6 text-verde/30 group-hover:text-verde/50 transition-colors" />
         )}
+        {value && !uploading && (
+          <div
+            className={cn(
+              "absolute inset-0 flex items-center justify-center gap-2 bg-preto/50 opacity-0 group-hover:opacity-100 focus-within:opacity-100 transition-opacity",
+              shape === "circle" ? "rounded-full" : "rounded-xl",
+            )}
+          >
+            <button
+              type="button"
+              onClick={(e) => { e.stopPropagation(); fileInputRef.current?.click() }}
+              aria-label="Change image"
+              className="flex items-center justify-center h-7 w-7 rounded-full bg-surface/90 text-preto hover:bg-surface transition-colors"
+            >
+              <Camera className="h-3.5 w-3.5" />
+            </button>
+            <button
+              type="button"
+              onClick={(e) => { e.stopPropagation(); onChange(null) }}
+              aria-label="Remove image"
+              className="flex items-center justify-center h-7 w-7 rounded-full bg-surface/90 text-red-600 hover:bg-surface transition-colors"
+            >
+              <X className="h-3.5 w-3.5" />
+            </button>
+          </div>
+        )}
         <input
           ref={fileInputRef}
           type="file"

From 1aafbf70ba542aac1527fb5a5a735e3e44b08cff Mon Sep 17 00:00:00 2001
From: Levi Gomes <levigft@gmail.com>
Date: Wed, 15 Jul 2026 17:01:03 -0300
Subject: [PATCH 2/2] chore(ci): empty commit to re-trigger CI checks

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>