From d0328f9ec8a5101bb8d847843bebce4434107d64 Mon Sep 17 00:00:00 2001 From: Eddi3_As Date: Thu, 27 Mar 2025 19:18:43 -0400 Subject: [PATCH] =?UTF-8?q?FIX=20ajustement=20gallery=20demand=C3=A9s?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- client/.env.development | 1 + client/.env.example | 3 ++- .../components/ImageGallery/ImageGallery.tsx | 21 +++++++++++++------ client/src/constants.tsx | 2 +- .../pages/Teacher/EditorQuiz/EditorQuiz.tsx | 1 - server/models/images.js | 2 +- 6 files changed, 20 insertions(+), 10 deletions(-) diff --git a/client/.env.development b/client/.env.development index e37f392..d1374e8 100644 --- a/client/.env.development +++ b/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 diff --git a/client/.env.example b/client/.env.example index 944dcbb..787c0f6 100644 --- a/client/.env.example +++ b/client/.env.example @@ -1,2 +1,3 @@ VITE_BACKEND_URL=http://localhost:4400 -VITE_AZURE_BACKEND_URL=http://localhost:4400 \ No newline at end of file +VITE_AZURE_BACKEND_URL=http://localhost:4400 +VITE_IMG_URL=http://localhost:4400 \ No newline at end of file diff --git a/client/src/components/ImageGallery/ImageGallery.tsx b/client/src/components/ImageGallery/ImageGallery.tsx index f404b91..cb60aa4 100644 --- a/client/src/components/ImageGallery/ImageGallery.tsx +++ b/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 = ({ 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 = ({ 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) => { @@ -121,9 +129,9 @@ const ImageGallery: React.FC = ({ 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 = ({ handleCopy, handleDelete }) => { setSnackbarOpen(false); }; + return ( setTabValue(newValue)}> @@ -162,7 +171,7 @@ const ImageGallery: React.FC = ({ handleCopy, handleDelete }) => { { e.stopPropagation(); - handleCopyFunction(obj.id); + defaultHandleCopy(obj.id); }} color="primary" data-testid={`gallery-tab-copy-${obj.id}`} > diff --git a/client/src/constants.tsx b/client/src/constants.tsx index fcdd278..0cbbb9f 100644 --- a/client/src/constants.tsx +++ b/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}`:''}` : '' }; diff --git a/client/src/pages/Teacher/EditorQuiz/EditorQuiz.tsx b/client/src/pages/Teacher/EditorQuiz/EditorQuiz.tsx index d3989a3..ab7ea13 100644 --- a/client/src/pages/Teacher/EditorQuiz/EditorQuiz.tsx +++ b/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]); } diff --git a/server/models/images.js b/server/models/images.js index 16e52de..e3b6afd 100644 --- a/server/models/images.js +++ b/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();