default image

.env

@@ -1,2 +1,2 @@
-REACT_APP_API_URL=https://venus.acatlan.unam.mx/directorio_test
+REACT_APP_API_URL=http://192.168.100.7:3000
 REACT_APP_PORT=3001

src/components/Card/CardProfesores/CardProfesor.js

@@ -11,7 +11,6 @@ const CardProfesor = ({ profesor, edificioNombre, permissions }) => {
   const { deleteTeacher } = useDeleteTeacher();
   const defaultImage =
     "https://static.vecteezy.com/system/resources/thumbnails/020/765/399/small_2x/default-profile-account-unknown-icon-black-silhouette-free-vector.jpg";
-  const fotoProfesor = profesor.fotografia || defaultImage;
 
   const handleDeleteClick = () => {
     setShowDialog(true);
@@ -33,24 +32,22 @@ const CardProfesor = ({ profesor, edificioNombre, permissions }) => {
     window.location.href = `${PublicRoutes.DATAPROFESOR}${profesor.id_profesor}`;
   };
 
+  const handleImageError = (e) => {
+    e.target.src = defaultImage;
+  };
+
   return (
     <div className="card m-1">
       <div className="image">
-        {fotoProfesor && fotoProfesor.startsWith("http") ? (
-          <img
-            src={fotoProfesor}
-            className="imgProfe"
-            alt={profesor.nombre}
-            onClick={handleViewProfesor}
-          />
-        ) : (
-          <img
-            src={`${API_URL}/imagenes/${profesor.fotografia}`}
-            className="imgProfe"
-            alt={profesor.nombre}
-            onClick={handleViewProfesor}
-          />
-        )}
+        <img
+          src={profesor.fotografia && profesor.fotografia.startsWith("http")
+            ? profesor.fotografia
+            : `${API_URL}/imagenes/${profesor.fotografia}`}
+          className="imgProfe"
+          alt={profesor.nombre}
+          onClick={handleViewProfesor}
+          onError={handleImageError}
+        />
 
         {permissions ? (
           <div

src/components/Teacher/PerfilProfesor/PerfilProfesor.js

@@ -88,6 +88,10 @@ const PerfilProfesor = () => {
     });
   };
 
+  const handleImageError = (e) => {
+    e.target.src = defaultImage;
+  };
+
   return (
     <div className="form-container">
       <div className="containerButton">
@@ -98,12 +102,18 @@ const PerfilProfesor = () => {
       <div className="perfil-profesor">
         <div className="foto-nombre">
           {fotoProfesor && fotoProfesor.startsWith("http") ? (
-            <img src={fotoProfesor} alt={profesor.nombre} className="foto" />
+            <img
+              src={fotoProfesor}
+              alt={profesor.nombre}
+              className="foto"
+              onError={handleImageError}
+            />
           ) : (
             <img
               src={`${API_URL}/imagenes/${profesor.fotografia}`}
               alt={profesor.nombre}
               className="foto"
+              onError={handleImageError}
             />
           )}