diff --git a/client/src/__tests__/components/ImageGallery/ImageGallery.test.tsx b/client/src/__tests__/components/ImageGallery/ImageGallery.test.tsx
index 761029f..2fdb583 100644
--- a/client/src/__tests__/components/ImageGallery/ImageGallery.test.tsx
+++ b/client/src/__tests__/components/ImageGallery/ImageGallery.test.tsx
@@ -22,10 +22,13 @@ beforeAll(() => {
});
describe("ImageGallery", () => {
+
+ let mockHandleDelete: jest.Mock;
beforeEach(() => {
(ApiService.getUserImages as jest.Mock).mockResolvedValue({ images: mockImages, total: 3 });
(ApiService.deleteImage as jest.Mock).mockResolvedValue(true);
(ApiService.uploadImage as jest.Mock).mockResolvedValue('mockImageUrl');
+ mockHandleDelete = jest.fn();
render();
});
@@ -43,13 +46,46 @@ describe("ImageGallery", () => {
const handleCopyMock = jest.fn();
render();
-
- const copyButtons = await waitFor(() => screen.findAllByTestId(/gallery-tab-copy-/));
- await act(async () => {
- fireEvent.click(copyButtons[0]);
- });
+
+ const copyButtons = await waitFor(() => screen.findAllByTestId(/gallery-tab-copy-/));
+ await act(async () => {
+ fireEvent.click(copyButtons[0]);
+ });
expect(navigator.clipboard.writeText).toHaveBeenCalled();
});
-});
\ No newline at end of file
+ it("should delete an image and update the gallery", async () => {
+ const fetchImagesMock = jest.fn().mockResolvedValue({ images: mockImages.filter((image) => image.id !== "1"), total: 2 });
+
+ (ApiService.getUserImages as jest.Mock).mockImplementation(fetchImagesMock);
+
+ render();
+
+ await act(async () => {
+ await screen.findByAltText("Image image1.jpg");
+ });
+
+ const deleteButtons = await waitFor(() => screen.findAllByTestId(/gallery-tab-delete-/));
+ fireEvent.click(deleteButtons[0]);
+
+ await waitFor(() => {
+ expect(screen.getByText("Voulez-vous supprimer cette image?")).toBeInTheDocument();
+ });
+
+ const confirmDeleteButton = screen.getByText("Delete");
+ await act(async () => {
+ fireEvent.click(confirmDeleteButton);
+ });
+
+ await waitFor(() => {
+ expect(ApiService.deleteImage).toHaveBeenCalledWith("1");
+ });
+
+ await waitFor(() => {
+ expect(screen.queryByAltText("Image image1.jpg")).toBeNull();
+ expect(screen.getByText("Image supprimée avec succès !")).toBeInTheDocument();
+ });
+ });
+
+});
diff --git a/client/src/components/ImageGallery/ImageGallery.tsx b/client/src/components/ImageGallery/ImageGallery.tsx
index de907d8..1bed68e 100644
--- a/client/src/components/ImageGallery/ImageGallery.tsx
+++ b/client/src/components/ImageGallery/ImageGallery.tsx
@@ -25,9 +25,10 @@ import { Upload } from "@mui/icons-material";
interface ImagesProps {
handleCopy?: (id: string) => void;
+ handleDelete?: (id: string) => void;
}
-const ImageGallery: React.FC = ({ handleCopy }) => {
+const ImageGallery: React.FC = ({ handleCopy, handleDelete }) => {
const [images, setImages] = useState([]);
const [totalImg, setTotalImg] = useState(0);
const [imgPage, setImgPage] = useState(1);
@@ -55,14 +56,16 @@ const ImageGallery: React.FC = ({ handleCopy }) => {
fetchImages();
}, [imgPage]);
- const handleDelete = async () => {
+ const defaultHandleDelete = async (id: string) => {
if (imageToDelete) {
setLoading(true);
- const isDeleted = await ApiService.deleteImage(imageToDelete.id);
+ const isDeleted = await ApiService.deleteImage(id);
setLoading(false);
if (isDeleted) {
- setImages(images.filter((image) => image.id !== imageToDelete.id));
+ //setImages(images.filter((image) => image.id !== id));
+ setImgPage(1);
+ fetchImages();
setSnackbarMessage("Image supprimée avec succès !");
setSnackbarSeverity("success");
} else {
@@ -84,6 +87,7 @@ const ImageGallery: React.FC = ({ handleCopy }) => {
};
const handleCopyFunction = handleCopy || defaultHandleCopy;
+ const handleDeleteFunction = handleDelete || defaultHandleDelete;
const handleImageUpload = (event: React.ChangeEvent) => {
const file = event.target.files ? event.target.files[0] : null;
@@ -264,7 +268,7 @@ const ImageGallery: React.FC = ({ handleCopy }) => {
-