use config file to limit upload images

sumn2u · Jun 13, 2024 · 596804d · 596804d
1 parent b3e6d6c
commit 596804d
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 6 deletions.
diff --git a/client/config.js b/client/config.js
@@ -9,7 +9,8 @@ if (typeof import.meta !== 'undefined' && import.meta.env) {
 
 const config = {
     DEMO_SITE_URL:"https://annotate-docs.dwaste.live/",
-    VITE_SERVER_URL
+    VITE_SERVER_URL,
+    UPLOAD_LIMIT: 5,
   };
 
 export default config;

diff --git a/client/src/ImageUpload/index.jsx b/client/src/ImageUpload/index.jsx
@@ -5,6 +5,7 @@ import DeleteIcon from '@mui/icons-material/Delete';
 import axios from 'axios';
 import { useSnackbar } from '../SnackbarContext';
 import { useTranslation } from "react-i18next"
+import config from '../../config.js';
 
 const ImageUpload = ({ onImageUpload }) => {
   const { t } = useTranslation(); 
@@ -23,7 +24,7 @@ const ImageUpload = ({ onImageUpload }) => {
     }
 
     const totalImages = images.length + acceptedFiles.length;
-    if (totalImages > 2) {
+    if (totalImages > config.UPLOAD_LIMIT) {
       showSnackbar(t("error.configuration.image_upload.max"), "error");
       return;
     }
@@ -108,7 +109,7 @@ const ImageUpload = ({ onImageUpload }) => {
     onDrop,
     accept: 'image/*',
     multiple: true,
-    maxFiles: 2,
+    maxFiles: config.UPLOAD_LIMIT,
   });
 
   return (
@@ -148,7 +149,7 @@ const ImageUpload = ({ onImageUpload }) => {
             </>
           ) : (
             <Typography sx={{fontSize: "14px", color: "rgb(117, 117, 117)" }}>
-              {t("configuration.image_upload.description")}
+              {t("configuration.image_upload.description")} {config.UPLOAD_LIMIT}
             </Typography>
           )}
         </>

diff --git a/client/src/Localization/translation-de-DE.js b/client/src/Localization/translation-de-DE.js
@@ -44,7 +44,7 @@ const translationDeDE = {
   "configuration.regions": "Standard-Regionstyp",
   "configuration.regions.description": "Wählen Sie den Standard-Regionstyp, der auf dem Bild gezeichnet werden kann.",
   "error.configuration.image_upload.max": "Maximale Anzahl von Bildern erreicht",
-  "configuration.image_upload.description": "Laden Sie Bilder hoch, die annotiert werden sollen, oder ziehen Sie Bilder hierher. Unterstützte Dateien: .jpg, .jpeg, .png und maximale Anzahl von Bildern: 2",
+  "configuration.image_upload.description": "Laden Sie Bilder hoch, die annotiert werden sollen, oder ziehen Sie Bilder hierher. Unterstützte Dateien: .jpg, .jpeg, .png und maximale Anzahl von Bildern:",
   "configuration.image_upload.file_drop": "Dateien hierher ziehen",
   "download.configuration": "Konfiguration",
   "download.image_mask": "Maskiertes Bild",

diff --git a/client/src/Localization/translation-en-EN.js b/client/src/Localization/translation-en-EN.js
@@ -45,7 +45,7 @@ const translationEnEN = {
   "configuration.regions": "Default Region Type",
   "configuration.regions.description": "Choose default region type that can be drawn on the image.",
   "error.configuration.image_upload.max": "Maximum number of images reached",
-  "configuration.image_upload.description": "Upload images to be annotated, or drag and drop images here. Files supported: .jpg, .jpeg, .png and max number of images: 2",
+  "configuration.image_upload.description": "Upload images to be annotated, or drag and drop images here. Files supported: .jpg, .jpeg, .png and max number of images:",
   "configuration.image_upload.file_drop": "Drop files here",
   "download.configuration": "Configuration",
   "download.image_mask": "Masked Image",