fix(frontend): add uid for upload components

This commit is contained in:
yassinedorbozgithub 2025-05-25 22:29:58 +01:00
parent 933daaa221
commit 4981f723c5

View File

@ -17,7 +17,7 @@ import {
styled, styled,
Typography, Typography,
} from "@mui/material"; } from "@mui/material";
import { ChangeEvent, DragEvent, FC, useState } from "react"; import { ChangeEvent, DragEvent, FC, useId, useState } from "react";
import { useUpload } from "@/hooks/crud/useUpload"; import { useUpload } from "@/hooks/crud/useUpload";
import { useDialogs } from "@/hooks/useDialogs"; import { useDialogs } from "@/hooks/useDialogs";
@ -88,6 +88,7 @@ const AttachmentUploader: FC<FileUploadProps> = ({
const [attachment, setAttachment] = useState<IAttachment | undefined>( const [attachment, setAttachment] = useState<IAttachment | undefined>(
undefined, undefined,
); );
const uid = useId();
const { t } = useTranslate(); const { t } = useTranslate();
const dialogs = useDialogs(); const dialogs = useDialogs();
const [isDragOver, setIsDragOver] = useState<boolean>(false); const [isDragOver, setIsDragOver] = useState<boolean>(false);
@ -154,11 +155,11 @@ const AttachmentUploader: FC<FileUploadProps> = ({
<HiddenInput <HiddenInput
onChange={handleChange} onChange={handleChange}
accept={accept} accept={accept}
id="file-upload" id={`file-upload${uid}`}
type="file" type="file"
/> />
<FileUploadLabel <FileUploadLabel
htmlFor="file-upload" htmlFor={`file-upload${uid}`}
isDragOver={isDragOver} isDragOver={isDragOver}
onMouseEnter={() => setIsDragOver(true)} onMouseEnter={() => setIsDragOver(true)}
onMouseLeave={() => setIsDragOver(false)} onMouseLeave={() => setIsDragOver(false)}