ajustement route

client/.env.development

@@ -1,2 +1,3 @@
 VITE_BACKEND_URL=http://localhost:4400
 VITE_BACKEND_SOCKET_URL=http://localhost:4400
+VITE_IMG_URL=http://localhost:4400

client/.env.example

@@ -1,2 +1,3 @@
 VITE_BACKEND_URL=http://localhost:4400
-VITE_AZURE_BACKEND_URL=http://localhost:4400
+VITE_AZURE_BACKEND_URL=http://localhost:4400
+VITE_IMG_URL=http://localhost:4400

client/src/__tests__/components/ImageGallery/ImageGallery.test.tsx

@@ -90,7 +90,7 @@ describe("ImageGallery", () => {
 
     await waitFor(() => {
       expect(screen.queryByAltText("Image image1.jpg")).toBeNull();
-      expect(screen.getByText("Image supprimée avec succès !")).toBeInTheDocument();
+      expect(screen.getByText("Image supprimée avec succès!")).toBeInTheDocument();
     });
   });
 

client/src/components/ImageGallery/ImageGallery.tsx

@@ -22,6 +22,8 @@ import CloseIcon from "@mui/icons-material/Close";
 import { ImageType } from "../../Types/ImageType";
 import ApiService from "../../services/ApiService";
 import { Upload } from "@mui/icons-material";
+import { ENV_VARIABLES } from '../../constants';
+import { escapeForGIFT } from "src/utils/giftUtils";
 
 interface ImagesProps {
   handleCopy?: (id: string) => void;
@@ -63,10 +65,9 @@ const ImageGallery: React.FC<ImagesProps> = ({ handleCopy, handleDelete }) => {
       setLoading(false);
 
       if (isDeleted) {
-        //setImages(images.filter((image) => image.id !== id));
         setImgPage(1);
         fetchImages();
-        setSnackbarMessage("Image supprimée avec succès !");
+        setSnackbarMessage("Image supprimée avec succès!");
         setSnackbarSeverity("success");
       } else {
         setSnackbarMessage("Erreur lors de la suppression de l'image. Veuillez réessayer.");
@@ -82,11 +83,18 @@ const ImageGallery: React.FC<ImagesProps> = ({ handleCopy, handleDelete }) => {
 
   const defaultHandleCopy = (id: string) => {
     if (navigator.clipboard) {
-      navigator.clipboard.writeText(id);
+      const link = `${ENV_VARIABLES.IMG_URL}/api/image/get/${id}`;
+      const imgTag = `[markdown]![alt_text](${escapeForGIFT(link)} "texte de l'infobulle") {T}`;
+      setSnackbarMessage("Le lien Markdown de l’image a été copié dans le presse-papiers");
+      setSnackbarSeverity("success");
+      setSnackbarOpen(true);
+      navigator.clipboard.writeText(imgTag);
+    }
+    if(handleCopy) {
+      handleCopy(id);
     }
   };
 
-  const handleCopyFunction = handleCopy || defaultHandleCopy;
   const handleDeleteFunction = handleDelete || defaultHandleDelete;
 
   const handleImageUpload = (event: React.ChangeEvent<HTMLInputElement>) => {
@@ -121,9 +129,9 @@ const ImageGallery: React.FC<ImagesProps> = ({ handleCopy, handleDelete }) => {
       setSnackbarSeverity("success");
       setSnackbarOpen(true);
 
-      // Reset the input field and preview after successful upload
       setImportedImage(null);
       setPreview(null);
+      setTabValue(0);
     } catch (error) {
       setSnackbarMessage(`Une erreur est survenue.\n${error}\nVeuillez réessayer plus tard.`);
       setSnackbarSeverity("error");
@@ -135,6 +143,7 @@ const ImageGallery: React.FC<ImagesProps> = ({ handleCopy, handleDelete }) => {
     setSnackbarOpen(false);
   };
 
+
   return (
     <Box p={3}>
       <Tabs value={tabValue} onChange={(_, newValue) => setTabValue(newValue)}>
@@ -162,7 +171,7 @@ const ImageGallery: React.FC<ImagesProps> = ({ handleCopy, handleDelete }) => {
                     <Box display="flex" justifyContent="center" mt={1}>
                       <IconButton onClick={(e) => {
                         e.stopPropagation();
-                        handleCopyFunction(obj.id);
+                        defaultHandleCopy(obj.id);
                         }} 
                         color="primary"
                         data-testid={`gallery-tab-copy-${obj.id}`} >

client/src/constants.tsx

@@ -2,7 +2,7 @@
 const ENV_VARIABLES = {
     MODE: process.env.MODE || "production",
     VITE_BACKEND_URL: process.env.VITE_BACKEND_URL || "",
-    IMG_URL: process.env.MODE == "development" ? process.env.VITE_BACKEND_URL : process.env.IMG_URL,
+    IMG_URL: process.env.MODE == "development" ? process.env.VITE_BACKEND_URL : process.env.VITE_IMG_URL,
     BACKEND_URL: process.env.SITE_URL != undefined ? `${process.env.SITE_URL}${process.env.USE_PORTS ? `:${process.env.BACKEND_PORT}`:''}` : process.env.VITE_BACKEND_URL || '',
     FRONTEND_URL: process.env.SITE_URL != undefined ? `${process.env.SITE_URL}${process.env.USE_PORTS ? `:${process.env.PORT}`:''}` : ''
 };

client/src/pages/Teacher/EditorQuiz/EditorQuiz.tsx

@@ -171,7 +171,6 @@ const QuizForm: React.FC = () => {
 
     const handleCopyImage = (id: string) => {
         const escLink = `${ENV_VARIABLES.IMG_URL}/api/image/get/${id}`;
-        navigator.clipboard.writeText(id);
         setImageLinks(prevLinks => [...prevLinks, escLink]);
     }
 

server/models/images.js

@@ -82,7 +82,7 @@ class Images {
         if (!total || total === 0) return { images: [], total };
 
         const result = await imagesCollection.find({ userId: uid })
-        .sort({ created_at: 1 })
+        .sort({ created_at: -1 })
         .skip((page - 1) * limit)
         .limit(limit)
         .toArray();

server/routers/images.js

@@ -13,7 +13,7 @@ const upload = multer({ storage: storage });
 router.post("/upload", jwt.authenticate, upload.single('image'), asyncHandler(images.upload));
 router.get("/get/:id", asyncHandler(images.get));
 router.get("/getImages", asyncHandler(images.getImages));
-router.get("/getUserImages", asyncHandler(images.getUserImages));
-router.delete("/delete", asyncHandler(images.delete));
+router.get("/getUserImages", jwt.authenticate, asyncHandler(images.getUserImages));
+router.delete("/delete", jwt.authenticate, asyncHandler(images.delete));
 
 module.exports = router;