From 3536bd822ac5a24e286fa9e096a8513a928ed052 Mon Sep 17 00:00:00 2001
From: BrickheadJohnny <johnny.zgen@gmail.com>
Date: Thu, 12 Sep 2024 17:51:41 +0200
Subject: [PATCH] fix(ProfileBackgroundImageUploader): add input & use div
 instead of label

---
 .../EditProfile/ProfileBackgroundImageUploader.tsx         | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/app/(marketing)/profile/_components/EditProfile/ProfileBackgroundImageUploader.tsx b/src/app/(marketing)/profile/_components/EditProfile/ProfileBackgroundImageUploader.tsx
index 8f89ab7963..b67ebbe4bf 100644
--- a/src/app/(marketing)/profile/_components/EditProfile/ProfileBackgroundImageUploader.tsx
+++ b/src/app/(marketing)/profile/_components/EditProfile/ProfileBackgroundImageUploader.tsx
@@ -27,7 +27,7 @@ export const ProfileBackgroundImageUploader = ({
       description,
     })
 
-  const { isDragActive, getRootProps } = useDropzone({
+  const { isDragActive, getRootProps, getInputProps } = useDropzone({
     multiple: false,
     noClick: false,
     onDrop: (accepted, fileRejections) => {
@@ -53,9 +53,10 @@ export const ProfileBackgroundImageUploader = ({
   return (
     <Tooltip>
       <TooltipTrigger>
-        <label {...getRootProps()} className={buttonVariants(buttonProps as any)}>
+        <div {...getRootProps()} className={buttonVariants(buttonProps as any)}>
+        <input {...getInputProps()} hidden />
           {isDragActive ? <UploadSimple weight="bold" size={24} /> : children}
-        </label>
+        </div>
       </TooltipTrigger>
       <TooltipContent side="bottom">{tooltipLabel}</TooltipContent>
     </Tooltip>