From 6f765c72e03d1d8d4b024d231d97ea9daa8c02b6 Mon Sep 17 00:00:00 2001
From: Alberto Casado Torres <konzz@users.noreply.github.com>
Date: Fri, 31 Jan 2025 15:50:23 +0100
Subject: [PATCH] removced prefetch of images (#7636)

* removced prefetch of images

* fixed e2e
---
 .../components/specs/MediaField.spec.tsx      |  4 +-
 app/react/Metadata/components/ImageViewer.tsx | 37 +++----------------
 .../components/specs/ImageViewer.spec.tsx     | 17 +--------
 contents/ui-translations/ar.csv               |  2 +-
 contents/ui-translations/en.csv               |  2 +-
 contents/ui-translations/es.csv               |  2 +-
 contents/ui-translations/fr.csv               |  2 +-
 contents/ui-translations/ko.csv               |  2 +-
 contents/ui-translations/my.csv               |  2 +-
 contents/ui-translations/ru.csv               |  2 +-
 contents/ui-translations/th.csv               |  2 +-
 contents/ui-translations/tr.csv               |  2 +-
 cypress/e2e/media-metadata.cy.ts              | 25 +++++++++++--
 package.json                                  |  2 +-
 14 files changed, 40 insertions(+), 63 deletions(-)

diff --git a/app/react/Forms/components/specs/MediaField.spec.tsx b/app/react/Forms/components/specs/MediaField.spec.tsx
index b2d035c3bf..6d91ffbd81 100644
--- a/app/react/Forms/components/specs/MediaField.spec.tsx
+++ b/app/react/Forms/components/specs/MediaField.spec.tsx
@@ -174,9 +174,7 @@ describe('MediaField', () => {
       await render(imageProps);
       const img = renderResult.container.getElementsByTagName('img')[0];
       fireEvent.error(img);
-      expect(
-        await screen.findByText('This file type is not supported on media fields')
-      ).toBeInTheDocument();
+      expect(await screen.findByText('Error loading your image')).toBeInTheDocument();
     });
   });
 });
diff --git a/app/react/Metadata/components/ImageViewer.tsx b/app/react/Metadata/components/ImageViewer.tsx
index 222b48cb4a..3b45d927f5 100644
--- a/app/react/Metadata/components/ImageViewer.tsx
+++ b/app/react/Metadata/components/ImageViewer.tsx
@@ -1,50 +1,25 @@
 import { Translate } from 'app/I18N';
-import React, { useState, useEffect } from 'react';
+import React, { useState } from 'react';
 
 interface ImageViewerProps {
+  key?: string;
+  className?: string;
   src: string;
   alt: string;
-  className?: string;
 }
 
-const ImageViewer = ({ alt, src, className }: ImageViewerProps) => {
-  const [imageExists, setImageExists] = useState<boolean | null>(null);
+const ImageViewer = (props: ImageViewerProps) => {
   const [errorFlag, setErrorFlag] = useState(false);
 
-  useEffect(() => {
-    const checkImageExists = async (url: string) => {
-      try {
-        const response = await fetch(url, { method: 'GET' });
-        setImageExists(Boolean(response.ok));
-      } catch (error) {
-        setImageExists(false);
-      }
-    };
-
-    // eslint-disable-next-line no-void
-    void checkImageExists(src);
-  }, [src]);
-  if (imageExists === false) {
-    return (
-      <div className="media-error">
-        <Translate>Image not found</Translate>
-      </div>
-    );
-  }
-
   if (errorFlag) {
     return (
       <div className="media-error">
-        <Translate>This file type is not supported on media fields</Translate>
+        <Translate>Error loading your image</Translate>
       </div>
     );
   }
 
-  if (imageExists === null) {
-    return <Translate>Loading</Translate>;
-  }
-
-  return <img className={className} src={src} onError={() => setErrorFlag(true)} alt={alt} />;
+  return <img {...props} onError={() => setErrorFlag(true)} alt={props.alt} />;
 };
 
 export { ImageViewer, type ImageViewerProps };
diff --git a/app/react/Metadata/components/specs/ImageViewer.spec.tsx b/app/react/Metadata/components/specs/ImageViewer.spec.tsx
index f16619b36f..4e09edafb5 100644
--- a/app/react/Metadata/components/specs/ImageViewer.spec.tsx
+++ b/app/react/Metadata/components/specs/ImageViewer.spec.tsx
@@ -28,13 +28,6 @@ describe('ImageViewer', () => {
     });
   };
 
-  it('should render loading state initially', async () => {
-    //delay the fetch response
-    (global.fetch as jest.Mock).mockImplementation(async () => new Promise(() => {}));
-    await renderComponent();
-    expect(screen.getByText('Loading')).toBeInTheDocument();
-  });
-
   it('should render the image if it exists', async () => {
     (global.fetch as jest.Mock).mockResolvedValue({ ok: true });
 
@@ -45,14 +38,6 @@ describe('ImageViewer', () => {
     expect(img).toHaveAttribute('src', props.src);
   });
 
-  it('should render an error message if the image does not exist', async () => {
-    (global.fetch as jest.Mock).mockResolvedValue({ ok: false });
-
-    await renderComponent();
-
-    expect(screen.getByText('Image not found')).toBeInTheDocument();
-  });
-
   it('should handle image load errors with onError', async () => {
     (global.fetch as jest.Mock).mockResolvedValue({ ok: true });
 
@@ -66,6 +51,6 @@ describe('ImageViewer', () => {
       img.dispatchEvent(new Event('error'));
     });
 
-    expect(screen.getByText('This file type is not supported on media fields')).toBeInTheDocument();
+    expect(screen.getByText('Error loading your image')).toBeInTheDocument();
   });
 });
diff --git a/contents/ui-translations/ar.csv b/contents/ui-translations/ar.csv
index 1133276fa8..d89acbd436 100644
--- a/contents/ui-translations/ar.csv
+++ b/contents/ui-translations/ar.csv
@@ -307,6 +307,7 @@ Entity types,أنواع الكيانات
 Entity updated,Entity updated
 Error,خطأ
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expand all
 Exploration,استكشاف
@@ -377,7 +378,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.","If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io."
 "If you want to continue, please type",إذا كنت ترغب في المتابعة، يرجى كتابة
-Image not found,Image not found
 Impact of property change warning,All entities and documents that have already this property assigned will loose its current value
 Import,استيراد
 Import asset,Import asset
diff --git a/contents/ui-translations/en.csv b/contents/ui-translations/en.csv
index f50d0f1924..2932771955 100644
--- a/contents/ui-translations/en.csv
+++ b/contents/ui-translations/en.csv
@@ -310,6 +310,7 @@ Entity types,Entity types
 Entity updated,Entity updated
 Error,Error
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expand all
 Exploration,Exploration
@@ -380,7 +381,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.","If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io."
 "If you want to continue, please type","If you want to continue, please type"
-Image not found,Image not found
 Impact of property change warning,"By making this change, any values  from the previous thesaurus already assigned to entities will be lost."
 Import,Import
 Import asset,Import asset
diff --git a/contents/ui-translations/es.csv b/contents/ui-translations/es.csv
index 1f58a9d9ca..822a3767c4 100644
--- a/contents/ui-translations/es.csv
+++ b/contents/ui-translations/es.csv
@@ -306,6 +306,7 @@ Entity types,Tipos de entidades
 Entity updated,Entidad actualizada
 Error,Error
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expandir todo
 Exploration,Exploración
@@ -376,7 +377,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.","Si utilizas una URL externa, utiliza una dirección completa. Ejemplo: http://www.uwazi.io."
 "If you want to continue, please type","Si quieres continuar, por favor escribe"
-Image not found,Image not found
 Impact of property change warning,Todas las entidades y documentos que ya tienen esta propiedad asignada perderán su valor actual
 Import,Importar
 Import asset,Import asset
diff --git a/contents/ui-translations/fr.csv b/contents/ui-translations/fr.csv
index b775dc5d8f..0b01287600 100644
--- a/contents/ui-translations/fr.csv
+++ b/contents/ui-translations/fr.csv
@@ -307,6 +307,7 @@ Entity types,Types d'entités
 Entity updated,Entity updated
 Error,Erreur
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expand all
 Exploration,Exploration
@@ -377,7 +378,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.","Si c'est une URL externe, utilisez une URL complète. Par exemple, http://www.uwazi.io."
 "If you want to continue, please type","Si vous voulez continuer, veuillez taper"
-Image not found,Image not found
 Impact of property change warning,All entities and documents that have already this property assigned will loose its current value
 Import,Importer
 Import asset,Import asset
diff --git a/contents/ui-translations/ko.csv b/contents/ui-translations/ko.csv
index cc0dbcb863..03bbc90ce4 100644
--- a/contents/ui-translations/ko.csv
+++ b/contents/ui-translations/ko.csv
@@ -308,6 +308,7 @@ Entity types,엔티티 유형
 Entity updated,Entity updated
 Error,오류
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expand all
 Exploration,탐색
@@ -378,7 +379,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.",외부 URL 인 경우 전체 경로 (http://www. 부터 시작하는 전체 URL) 를 넣으십시오.
 "If you want to continue, please type",계속하려면 다음을 입력하십시오:
-Image not found,Image not found
 Impact of property change warning,All entities and documents that have already this property assigned will loose its current value
 Import,업로드
 Import asset,Import asset
diff --git a/contents/ui-translations/my.csv b/contents/ui-translations/my.csv
index 493df87535..555723d582 100644
--- a/contents/ui-translations/my.csv
+++ b/contents/ui-translations/my.csv
@@ -308,6 +308,7 @@ Entity types,ဖြည့်သွင်းချက် အမျိုးအစ
 Entity updated,Entity updated
 Error,ချွတ်ယွင်းချက်
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expand all
 Exploration,စူးစမ်းလေ့လာခြင်း
@@ -378,7 +379,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.",ပြင်ပ URL ဖြစ်ပါက URL ပုံစံအပြည့်အစုံကို သုံးပါ။ ဥပမာ- http://www.uwazi.io။
 "If you want to continue, please type",ဆက်လက်ဆောင်ရွက်လိုပါက ကျေးဇူးပြု၍ စာရိုက်ပါ
-Image not found,Image not found
 Impact of property change warning,All entities and documents that have already this property assigned will loose its current value
 Import,ထည့်သွင်းရန်
 Import asset,Import asset
diff --git a/contents/ui-translations/ru.csv b/contents/ui-translations/ru.csv
index 93b5538b6a..21081fe843 100644
--- a/contents/ui-translations/ru.csv
+++ b/contents/ui-translations/ru.csv
@@ -305,6 +305,7 @@ Entity types,Типы объектов
 Entity updated,Entity updated
 Error,Ошибка
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expand all
 Exploration,Изучение
@@ -375,7 +376,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.","Если это внешний URL, используйте полностью сформированный URL. Т. е. http://www.uwazi.io."
 "If you want to continue, please type","Если вы хотите продолжить, пожалуйста, введите"
-Image not found,Image not found
 Impact of property change warning,All entities and documents that have already this property assigned will loose its current value
 Import,Импортировать
 Import asset,Import asset
diff --git a/contents/ui-translations/th.csv b/contents/ui-translations/th.csv
index 08bc7616d6..30bdb8a532 100644
--- a/contents/ui-translations/th.csv
+++ b/contents/ui-translations/th.csv
@@ -308,6 +308,7 @@ Entity types,ประเภทรายการ
 Entity updated,Entity updated
 Error,ข้อผิดพลาด
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expand all
 Exploration,ค้นหา
@@ -378,7 +379,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.",หากเป็น URL จากภายนอก กรุณาใช้ URL แบบเต็มเช่น http://www.uwazi.io
 "If you want to continue, please type",ถ้าคุณต้องการดำเนินการต่อ กรุณาพิมพ์
-Image not found,Image not found
 Impact of property change warning,All entities and documents that have already this property assigned will loose its current value
 Import,นำเข้า
 Import asset,Import asset
diff --git a/contents/ui-translations/tr.csv b/contents/ui-translations/tr.csv
index cafc2780b9..4cd5ab3a5f 100644
--- a/contents/ui-translations/tr.csv
+++ b/contents/ui-translations/tr.csv
@@ -308,6 +308,7 @@ Entity types,Varlık türü
 Entity updated,Entity updated
 Error,Hata
 Error adding thesauri.,Error adding thesauri.
+Error loading your image,Error loading your image
 Error updating thesauri.,Error updating thesauri.
 Expand all,Expand all
 Exploration,Arama
@@ -378,7 +379,6 @@ ID,ID
 ID:,ID:
 "If it is an external URL, use a fully formed URL. Ie. http://www.uwazi.io.","Harici bir URL ise, tam olarak oluşturulmuş bir URL kullanın: http://www.uwazi.io."
 "If you want to continue, please type","Devam etmek istiyorsanız, lütfen yazın"
-Image not found,Image not found
 Impact of property change warning,All entities and documents that have already this property assigned will loose its current value
 Import,İçe aktar
 Import asset,Import asset
diff --git a/cypress/e2e/media-metadata.cy.ts b/cypress/e2e/media-metadata.cy.ts
index 59ef6c4ba8..fd103b815b 100644
--- a/cypress/e2e/media-metadata.cy.ts
+++ b/cypress/e2e/media-metadata.cy.ts
@@ -70,7 +70,7 @@ describe('Media metadata', { defaultCommandTimeout: 5000 }, () => {
     });
   };
 
-  const addInvalidFile = (field: string) => {
+  const addInvalidVideoFile = (field: string) => {
     cy.contains(field).parentsUntil('.form-group').contains('button', 'Add file').scrollIntoView();
     cy.contains(field).parentsUntil('.form-group').contains('button', 'Add file').click();
     cy.contains('button', 'Select from computer');
@@ -89,6 +89,25 @@ describe('Media metadata', { defaultCommandTimeout: 5000 }, () => {
       .should('be.visible');
   };
 
+  const addInvalidImageFile = (field: string) => {
+    cy.contains(field).parentsUntil('.form-group').contains('button', 'Add file').scrollIntoView();
+    cy.contains(field).parentsUntil('.form-group').contains('button', 'Add file').click();
+    cy.contains('button', 'Select from computer');
+    cy.get('.upload-button input[type=file]')
+      .first()
+      .selectFile('./cypress/test_files/sample.pdf', {
+        force: true,
+      });
+    cy.contains(field)
+      .parentsUntil('.form-group')
+      .contains('Error loading your image')
+      .scrollIntoView();
+    cy.contains(field)
+      .parentsUntil('.form-group')
+      .contains('Error loading your image')
+      .should('be.visible');
+  };
+
   const checkMediaSnapshots = (selector: string) => {
     cy.get(selector).scrollIntoView({ offset: { top: -30, left: 0 } });
     cy.get(selector).toMatchImageSnapshot({ disableTimersAndAnimations: true, threshold: 0.08 });
@@ -163,8 +182,8 @@ describe('Media metadata', { defaultCommandTimeout: 5000 }, () => {
   // eslint-disable-next-line max-statements
   it('should show an error for an invalid property and allow to replace it for a valid one', () => {
     addEntity('Reporte con propiedades audiovisuales corregidas');
-    addInvalidFile('Fotografía');
-    addInvalidFile('Video');
+    addInvalidImageFile('Fotografía');
+    addInvalidVideoFile('Video');
     clickMediaAction('Fotografía', 'Unlink');
     addImage();
     clickMediaAction('Video', 'Unlink');
diff --git a/package.json b/package.json
index 8e6f515c92..8f83370361 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "uwazi",
-  "version": "1.198.0-rc4",
+  "version": "1.198.0-rc5",
   "description": "Uwazi is a free, open-source solution for organising, analysing and publishing your documents.",
   "keywords": [
     "react"