guild_front/src/components/FileTracker/FileTracker.jsx

51 lines
1.1 KiB
JavaScript

import React, { useState } from "react";
import { backendImg } from "@utils/helper";
import { apiRequest } from "@api/request";
import close from "assets/icons/closeProjectPersons.svg";
const FileTracker = ({ file, setDeletedTask, taskId }) => {
const [openImg, setOpenImg] = useState(false);
function deleteFile(file) {
apiRequest("/file/detach", {
method: "DELETE",
data: {
file_id: file.file_id,
entity_type: 2,
entity_id: taskId,
status: 0
}
}).then(() => {
setDeletedTask(file);
});
}
return (
<div
className={openImg ? "task-file img-opened" : "task-file"}
key={file.id}
onClick={() => {
if (openImg) setOpenImg(!openImg);
}}
>
<img
className="img-file"
src={backendImg(file.file?.url)}
alt="img"
onClick={() => {
if (!openImg) setOpenImg(!openImg);
}}
/>
{!openImg && (
<div className="delete-file" onClick={() => deleteFile(file)}>
<img src={close} alt="delete" />
</div>
)}
</div>
);
};
export default FileTracker;