From 1ca03273c126a6065c7c19be8f47590b26118804 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Omar=20Luna=20Hern=C3=A1ndez?= <42101656@uaz.edu.mx>
Date: Wed, 6 Nov 2024 12:14:39 -0600
Subject: [PATCH 1/7] Se crea un componente de un interruptor y sus estilos

---
 .../components/switch/assets/css/styles.css   | 62 +++++++++++++++++++
 .../presentation/components/switch/switch.tsx | 14 +++++
 2 files changed, 76 insertions(+)
 create mode 100644 web/src/presentation/components/switch/assets/css/styles.css
 create mode 100644 web/src/presentation/components/switch/switch.tsx

diff --git a/web/src/presentation/components/switch/assets/css/styles.css b/web/src/presentation/components/switch/assets/css/styles.css
new file mode 100644
index 00000000..86369a45
--- /dev/null
+++ b/web/src/presentation/components/switch/assets/css/styles.css
@@ -0,0 +1,62 @@
+/* The switch - the box around the slider */
+.switch {
+  position: relative;
+  display: inline-block;
+  width: 40px; /* 60px * 2/3 */
+  height: 22.67px; /* 34px * 2/3 */
+}
+
+/* Hide default HTML checkbox */
+.switch input {
+  opacity: 0;
+  width: 0;
+  height: 0;
+}
+
+/* The slider */
+.slider {
+  position: absolute;
+  cursor: pointer;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ccc;
+  -webkit-transition: 0.4s;
+  transition: 0.4s;
+}
+
+.slider:before {
+  position: absolute;
+  content: "";
+  height: 17.33px; /* 26px * 2/3 */
+  width: 17.33px; /* 26px * 2/3 */
+  left: 2.67px; /* 4px * 2/3 */
+  bottom: 2.67px; /* 4px * 2/3 */
+  background-color: white;
+  -webkit-transition: 0.4s;
+  transition: 0.4s;
+}
+
+input:checked + .slider {
+  background-color: #2196f3;
+}
+
+input:focus + .slider {
+  box-shadow: 0 0 1px #2196f3;
+}
+
+input:checked + .slider:before {
+  -webkit-transform: translateX(17.33px); /* 26px * 2/3 */
+  -ms-transform: translateX(17.33px); /* 26px * 2/3 */
+  transform: translateX(17.33px); /* 26px * 2/3 */
+}
+
+/* Rounded sliders */
+.slider.round {
+  border-radius: 22.67px; /* 34px * 2/3 */
+}
+
+.slider.round:before {
+  border-radius: 50%;
+}
diff --git a/web/src/presentation/components/switch/switch.tsx b/web/src/presentation/components/switch/switch.tsx
new file mode 100644
index 00000000..457ce591
--- /dev/null
+++ b/web/src/presentation/components/switch/switch.tsx
@@ -0,0 +1,14 @@
+import "./assets/css/styles.css";
+
+interface Props {
+  onClick?: () => void;
+}
+
+export const Swicth = ({ onClick }: Props) => {
+  return (
+    <label className="switch">
+      <input type="checkbox" onClick={onClick} />
+      <span className="slider round"></span>
+    </label>
+  );
+};
-- 
GitLab


From 3ef6f5db0a34c6082723858f0ab3a40c961a13cc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Omar=20Luna=20Hern=C3=A1ndez?= <42101656@uaz.edu.mx>
Date: Wed, 6 Nov 2024 13:04:45 -0600
Subject: [PATCH 2/7] Se modifica para que las direcciones hacia el siguiente
 punto puedan ser null

---
 .../dto/create-pointAndTraduction.dto.ts      |   4 +-
 .../dto/create-pointTrad.dto.ts               |   2 +-
 .../src/pointOfInterest/dto/getPoint.dto.ts   |   2 +-
 .../pointOfInterest/dto/printPointInfo.dto.ts |   2 +-
 web/src/data/datasource/api/entities/poi.ts   |   4 +-
 web/src/data/datasource/api/poi_datasource.ts |   6 +-
 web/src/domain/model/POIModel.ts              |   2 +-
 web/src/domain/useCase/usePointOfInterest.ts  | 186 +++++++++---------
 .../admin_panel_poi_register.tsx              | 117 ++++++-----
 .../admin_panel_poi_viewer.tsx                |  91 ++++-----
 10 files changed, 223 insertions(+), 193 deletions(-)

diff --git a/backend/src/pointOfInterest/dto/create-pointAndTraduction.dto.ts b/backend/src/pointOfInterest/dto/create-pointAndTraduction.dto.ts
index 1c77b9e5..dc58fa5b 100644
--- a/backend/src/pointOfInterest/dto/create-pointAndTraduction.dto.ts
+++ b/backend/src/pointOfInterest/dto/create-pointAndTraduction.dto.ts
@@ -12,7 +12,7 @@ export class CreatePointAndTradDto {
   @ApiProperty()
   contentES: string;
   @ApiProperty()
-  directionsEN: string;
+  directionsEN?: string;
   @ApiProperty()
-  directionsES: string;
+  directionsES?: string;
 }
diff --git a/backend/src/pointOfInterest/dto/create-pointTrad.dto.ts b/backend/src/pointOfInterest/dto/create-pointTrad.dto.ts
index 6c4a0dcd..9998e907 100644
--- a/backend/src/pointOfInterest/dto/create-pointTrad.dto.ts
+++ b/backend/src/pointOfInterest/dto/create-pointTrad.dto.ts
@@ -4,6 +4,6 @@ export class CreatePointTradDto {
   language: LANGUAGES;
   idPoint: number;
   content: string;
-  directions: string;
+  directions?: string;
   audioName: string;
 }
diff --git a/backend/src/pointOfInterest/dto/getPoint.dto.ts b/backend/src/pointOfInterest/dto/getPoint.dto.ts
index 2a826ef0..352b3e56 100644
--- a/backend/src/pointOfInterest/dto/getPoint.dto.ts
+++ b/backend/src/pointOfInterest/dto/getPoint.dto.ts
@@ -4,5 +4,5 @@ export class getPointDto {
   name: string;
   imageName: string;
   content: string;
-  directions: string;
+  directions?: string;
 }
diff --git a/backend/src/pointOfInterest/dto/printPointInfo.dto.ts b/backend/src/pointOfInterest/dto/printPointInfo.dto.ts
index 20696a29..19d91673 100644
--- a/backend/src/pointOfInterest/dto/printPointInfo.dto.ts
+++ b/backend/src/pointOfInterest/dto/printPointInfo.dto.ts
@@ -2,4 +2,4 @@ export class printPointInfo {
   idPoint: number;
   namePlace: string;
   name: string;
-}
\ No newline at end of file
+}
diff --git a/web/src/data/datasource/api/entities/poi.ts b/web/src/data/datasource/api/entities/poi.ts
index ad5936a3..8227265a 100644
--- a/web/src/data/datasource/api/entities/poi.ts
+++ b/web/src/data/datasource/api/entities/poi.ts
@@ -8,8 +8,8 @@ export interface PointOfInterest {
   image: File | string;
   contentEN: string;
   contentES: string;
-  directionsEN: string;
-  directionsES: string;
+  directionsEN?: string;
+  directionsES?: string;
 }
 
 /**
diff --git a/web/src/data/datasource/api/poi_datasource.ts b/web/src/data/datasource/api/poi_datasource.ts
index 206f5c92..4e26660e 100644
--- a/web/src/data/datasource/api/poi_datasource.ts
+++ b/web/src/data/datasource/api/poi_datasource.ts
@@ -22,8 +22,10 @@ export class POIDatasourceProd implements PoiDatasourceInf {
     formToSend.append("image", form.image);
     formToSend.append("contentEN", form.contentEN);
     formToSend.append("contentES", form.contentES);
-    formToSend.append("directionsEN", form.directionsEN);
-    formToSend.append("directionsES", form.directionsES);
+    if (form.directionsEN && form.directionsES) {
+      formToSend.append("directionsEN", form.directionsEN);
+      formToSend.append("directionsES", form.directionsES);
+    }
 
     const headers = {
       "Content-Type": "multipart/form-data",
diff --git a/web/src/domain/model/POIModel.ts b/web/src/domain/model/POIModel.ts
index 72d14080..c8bf2ac2 100644
--- a/web/src/domain/model/POIModel.ts
+++ b/web/src/domain/model/POIModel.ts
@@ -15,7 +15,7 @@ export interface POIModel {
   /** Content description of the point of interest */
   content: string;
   /** Directions to the point of interest */
-  directions: string;
+  directions?: string;
 }
 
 /**
diff --git a/web/src/domain/useCase/usePointOfInterest.ts b/web/src/domain/useCase/usePointOfInterest.ts
index 656e827a..2104b533 100644
--- a/web/src/domain/useCase/usePointOfInterest.ts
+++ b/web/src/domain/useCase/usePointOfInterest.ts
@@ -13,102 +13,110 @@ import { showErrorAxios } from "../../core/utils/Messages";
 const POIDatasouce = new POIDatasourceProd();
 const POIRepository = new POIRepositoryProd(POIDatasouce);
 
-// Define resolver for form validation
-const resolver: Resolver<PointOfInterest> = async (data) => {
-  const errors: FieldErrors<PointOfInterest> = {};
-
-  // Validate idPlace
-  if (!data.idPlace) {
-    errors.idPlace = {
-      type: "required",
-      message: "Debe seleccionar el lugar al que pertenece el punto de interés",
-    };
-  }
+// Custom hook for point of interest functionality
+export const usePointOfInterest = (
+  forceRenderList?: () => void,
+  setIsWindowActive?: (visibility: boolean) => void
+) => {
+  const [isLastPoint, setIsLastPoint] = useState(false);
 
-  // Validate name
-  if (!data.name) {
-    errors.name = {
-      type: "required",
-      message: "El nombre del punto de interés es requerido",
-    };
-  } else if (data.name.length > 255) {
-    errors.name = {
-      type: "maxLength",
-      message: "El tamaño no debe sobrepasar los 255 caracteres",
-    };
-  }
+  // Define resolver for form validation
+  const resolver: Resolver<PointOfInterest> = async (data) => {
+    const errors: FieldErrors<PointOfInterest> = {};
 
-  // Validate content in English
-  if (!data.contentEN) {
-    errors.contentEN = {
-      type: "required",
-      message: "La descripción del punto de interés en inglés es requerida",
-    };
-  } else if (data.contentEN.length > 1024) {
-    errors.contentEN = {
-      type: "maxLength",
-      message: "El tamaño no debe sobrepasar los 1024 caracteres",
-    };
-  }
+    // Validate idPlace
+    if (!data.idPlace) {
+      errors.idPlace = {
+        type: "required",
+        message:
+          "Debe seleccionar el lugar al que pertenece el punto de interés",
+      };
+    }
 
-  // Validate content in Spanish
-  if (!data.contentES) {
-    errors.contentES = {
-      type: "required",
-      message: "La descripción del punto de interés en español es requerida",
-    };
-  } else if (data.contentES.length > 1024) {
-    errors.contentES = {
-      type: "maxLength",
-      message: "El tamaño no debe sobrepasar los 1024 caracteres",
-    };
-  }
+    // Validate name
+    if (!data.name) {
+      errors.name = {
+        type: "required",
+        message: "El nombre del punto de interés es requerido",
+      };
+    } else if (data.name.length > 255) {
+      errors.name = {
+        type: "maxLength",
+        message: "El tamaño no debe sobrepasar los 255 caracteres",
+      };
+    }
 
-  // Validate directions in English
-  if (!data.directionsEN) {
-    errors.directionsEN = {
-      type: "required",
-      message: "Las direcciones del punto de interés en inglés son requeridas",
-    };
-  } else if (data.directionsEN.length > 1024) {
-    errors.directionsEN = {
-      type: "maxLength",
-      message: "El tamaño no debe sobrepasar los 1024 caracteres",
-    };
-  }
+    // Validate content in English
+    if (!data.contentEN) {
+      errors.contentEN = {
+        type: "required",
+        message: "La descripción del punto de interés en inglés es requerida",
+      };
+    } else if (data.contentEN.length > 1024) {
+      errors.contentEN = {
+        type: "maxLength",
+        message: "El tamaño no debe sobrepasar los 1024 caracteres",
+      };
+    }
 
-  // Validate directions in Spanish
-  if (!data.directionsES) {
-    errors.directionsES = {
-      type: "required",
-      message: "Las direcciones del punto de interés en español son requeridas",
-    };
-  } else if (data.directionsES.length > 1024) {
-    errors.directionsES = {
-      type: "maxLength",
-      message: "El tamaño no debe sobrepasar los 1024 caracteres",
-    };
-  }
+    // Validate content in Spanish
+    if (!data.contentES) {
+      errors.contentES = {
+        type: "required",
+        message: "La descripción del punto de interés en español es requerida",
+      };
+    } else if (data.contentES.length > 1024) {
+      errors.contentES = {
+        type: "maxLength",
+        message: "El tamaño no debe sobrepasar los 1024 caracteres",
+      };
+    }
 
-  // Validate image
-  if (!data.image) {
-    errors.image = {
-      type: "required",
-      message: "Debe de haber al menos 1 imagen representativa del lugar",
-    };
-  }
+    // Validate directions in English
+    if (!isLastPoint) {
+      if (!data.directionsEN) {
+        errors.directionsEN = {
+          type: "required",
+          message:
+            "Las direcciones del punto de interés en inglés son requeridas",
+        };
+      } else if (data.directionsEN.length > 1024) {
+        errors.directionsEN = {
+          type: "maxLength",
+          message: "El tamaño no debe sobrepasar los 1024 caracteres",
+        };
+      }
+    }
 
-  return {
-    values: Object.keys(errors).length > 0 ? {} : data,
-    errors: errors,
-  };
-};
+    // Validate directions in Spanish
+    if (!isLastPoint) {
+      if (!data.directionsES) {
+        errors.directionsES = {
+          type: "required",
+          message:
+            "Las direcciones del punto de interés en español son requeridas",
+        };
+      } else if (data.directionsES.length > 1024) {
+        errors.directionsES = {
+          type: "maxLength",
+          message: "El tamaño no debe sobrepasar los 1024 caracteres",
+        };
+      }
+    }
 
-// Custom hook for point of interest functionality
-export const usePointOfInterest = (
-  forceRenderList?: () => void,
-  setIsWindowActive?: (visibility: boolean) => void
-) => {
+    // Validate image
+    if (!data.image) {
+      errors.image = {
+        type: "required",
+        message: "Debe de haber al menos 1 imagen representativa del lugar",
+      };
+    }
+
+    return {
+      values: Object.keys(errors).length > 0 ? {} : data,
+      errors: errors,
+    };
+  };
   const {
     register,
     handleSubmit,
@@ -242,5 +250,7 @@ export const usePointOfInterest = (
     getPointById,
     updatePOIByPlace,
     getPdfById,
+    isLastPoint,
+    setIsLastPoint,
   };
 };
diff --git a/web/src/presentation/admin/admin_panel_poi/admin_panel_poi_register/admin_panel_poi_register.tsx b/web/src/presentation/admin/admin_panel_poi/admin_panel_poi_register/admin_panel_poi_register.tsx
index 5c490a4b..9672eb53 100644
--- a/web/src/presentation/admin/admin_panel_poi/admin_panel_poi_register/admin_panel_poi_register.tsx
+++ b/web/src/presentation/admin/admin_panel_poi/admin_panel_poi_register/admin_panel_poi_register.tsx
@@ -9,6 +9,7 @@ import { PointOfInterest } from "../../../../data/datasource/api/entities/poi";
 import { usePlace } from "../../../../domain/useCase/usePlace";
 import { usePointOfInterest } from "../../../../domain/useCase/usePointOfInterest";
 import { LoadingScreen } from "../../../components/loading_screen/loading_screen";
+import { Swicth } from "../../../components/switch/switch";
 
 // Define the props interface for the component
 interface props {
@@ -43,6 +44,8 @@ export const AdminPanelPoiRegister = ({
     languageDescriptionIndexSelected,
     languageDirectionsIndexSelected,
     setLanguageDirectionsIndexSelected,
+    isLastPoint,
+    setIsLastPoint,
   } = usePointOfInterest(forceRenderList, setWindowVisibility);
 
   // State variables for loading, image preview, and image file
@@ -169,58 +172,70 @@ export const AdminPanelPoiRegister = ({
 
               <div className="input">
                 <div className="input_header">
-                  Direcciones hacia el siguiente punto de interés
-                  <select
-                    name="language_description_select"
-                    onChange={(e) =>
-                      setLanguageDirectionsIndexSelected(Number(e.target.value))
-                    }
-                  >
-                    {languaguesList.map((language, index) => {
+                  ¿Es el último punto?
+                  <Swicth onClick={() => setIsLastPoint(!isLastPoint)} />
+                </div>
+              </div>
+
+              {!isLastPoint && (
+                <div className="input">
+                  <div className="input_header">
+                    Direcciones hacia el siguiente punto de interés
+                    <select
+                      name="language_description_select"
+                      onChange={(e) =>
+                        setLanguageDirectionsIndexSelected(
+                          Number(e.target.value)
+                        )
+                      }
+                    >
+                      {languaguesList.map((language, index) => {
+                        return (
+                          <option key={index} value={index}>
+                            {language}
+                          </option>
+                        );
+                      })}
+                    </select>
+                  </div>
+                  {languaguesList.map((language, index) => {
+                    if (index === languageDirectionsIndexSelected) {
                       return (
-                        <option key={index} value={index}>
-                          {language}
-                        </option>
+                        <textarea
+                          id={index.toString()}
+                          className="poi_description"
+                          value={directions[index]}
+                          key={language}
+                          maxLength={1024}
+                          onChange={(e) => {
+                            const updatedDirectionsList = [...directions];
+                            updatedDirectionsList[index] = e.target.value;
+                            setDirections(updatedDirectionsList);
+                            if (index === 0) {
+                              setValue(
+                                "directionsES",
+                                updatedDirectionsList[index],
+                                { shouldValidate: true }
+                              );
+                            } else {
+                              setValue(
+                                "directionsEN",
+                                updatedDirectionsList[index],
+                                { shouldValidate: true }
+                              );
+                            }
+                          }}
+                        />
                       );
-                    })}
-                  </select>
+                    }
+                    return null;
+                  })}
+                  <p className="error">
+                    {errors.directionsEN?.message ||
+                      errors.directionsES?.message}
+                  </p>
                 </div>
-                {languaguesList.map((language, index) => {
-                  if (index === languageDirectionsIndexSelected) {
-                    return (
-                      <textarea
-                        id={index.toString()}
-                        className="poi_description"
-                        value={directions[index]}
-                        key={language}
-                        maxLength={1024}
-                        onChange={(e) => {
-                          const updatedDirectionsList = [...directions];
-                          updatedDirectionsList[index] = e.target.value;
-                          setDirections(updatedDirectionsList);
-                          if (index === 0) {
-                            setValue(
-                              "directionsES",
-                              updatedDirectionsList[index],
-                              { shouldValidate: true }
-                            );
-                          } else {
-                            setValue(
-                              "directionsEN",
-                              updatedDirectionsList[index],
-                              { shouldValidate: true }
-                            );
-                          }
-                        }}
-                      />
-                    );
-                  }
-                  return null;
-                })}
-                <p className="error">
-                  {errors.directionsEN?.message || errors.directionsES?.message}
-                </p>
-              </div>
+              )}
 
               <div className="place_select">
                 <label>Lugar al que pertenece el punto de interés</label>
@@ -229,9 +244,9 @@ export const AdminPanelPoiRegister = ({
                     No hay lugares
                   </option>
                 ) : (
-                  <select {...register("idPlace")}>
+                  <select defaultValue={"start"} {...register("idPlace")}>
                     <>
-                      <option disabled selected={isRegister} value="">
+                      <option disabled value="start">
                         Selecciona el lugar
                       </option>
                       {placeList.map((place) => {
diff --git a/web/src/presentation/admin/admin_panel_poi/admin_panel_poi_viewer/admin_panel_poi_viewer.tsx b/web/src/presentation/admin/admin_panel_poi/admin_panel_poi_viewer/admin_panel_poi_viewer.tsx
index 5bcdbb72..5774fdd7 100644
--- a/web/src/presentation/admin/admin_panel_poi/admin_panel_poi_viewer/admin_panel_poi_viewer.tsx
+++ b/web/src/presentation/admin/admin_panel_poi/admin_panel_poi_viewer/admin_panel_poi_viewer.tsx
@@ -31,8 +31,8 @@ export const AdminPanelPoiViewer = ({
   const [descriptions, setDescriptions] = useState<string[]>(
     new Array(languaguesList.length).fill("")
   ); // Descriptions in different languages
-  const [directions, setDirections] = useState<string[]>(
-    new Array(languaguesList.length).fill("")
+  const [directions, setDirections] = useState<(string | null)[]>(
+    new Array(languaguesList.length).fill(null)
   ); // Directions in different languages
   const [placeName, setPlaceName] = useState(""); // Name of the place
 
@@ -62,17 +62,18 @@ export const AdminPanelPoiViewer = ({
         }
       });
       setDescriptions(newDescriptions);
-
-      const newDirections = directions.map((element, index) => {
-        if (index === 0) {
-          return result.directionsES;
-        } else if (index === 1) {
-          return result.directionsEN;
-        } else {
-          return element;
-        }
-      });
-      setDirections(newDirections);
+      if (result.directionsEN && result.directionsES) {
+        const newDirections = directions.map((element, index) => {
+          if (index === 0) {
+            return result.directionsES || null;
+          } else if (index === 1) {
+            return result.directionsEN || null;
+          } else {
+            return element;
+          }
+        });
+        setDirections(newDirections);
+      }
 
       const place = await getPlaceById(result.idPlace);
       if (place) {
@@ -136,40 +137,42 @@ export const AdminPanelPoiViewer = ({
               })}
             </div>
 
-            <div className="input">
-              <div className="input_header">
-                Direcciones hacia el siguiente punto de interés
-                <select
-                  name="language_description_select"
-                  onChange={(e) =>
-                    setLanguageDirectionsIndexSelected(Number(e.target.value))
-                  }
-                >
-                  {languaguesList.map((language, index) => {
+            {directions[0] !== null && (
+              <div className="input">
+                <div className="input_header">
+                  Direcciones hacia el siguiente punto de interés
+                  <select
+                    name="language_description_select"
+                    onChange={(e) =>
+                      setLanguageDirectionsIndexSelected(Number(e.target.value))
+                    }
+                  >
+                    {languaguesList.map((language, index) => {
+                      return (
+                        <option key={index} value={index}>
+                          {language}
+                        </option>
+                      );
+                    })}
+                  </select>
+                </div>
+                {languaguesList.map((language, index) => {
+                  if (index === languageDirectionsIndexSelected) {
                     return (
-                      <option key={index} value={index}>
-                        {language}
-                      </option>
+                      <textarea
+                        id={index.toString()}
+                        className="poi_description"
+                        defaultValue={directions[index] || ""}
+                        readOnly
+                        disabled
+                        key={language}
+                      />
                     );
-                  })}
-                </select>
+                  }
+                  return null;
+                })}
               </div>
-              {languaguesList.map((language, index) => {
-                if (index === languageDirectionsIndexSelected) {
-                  return (
-                    <textarea
-                      id={index.toString()}
-                      className="poi_description"
-                      defaultValue={directions[index]}
-                      readOnly
-                      disabled
-                      key={language}
-                    />
-                  );
-                }
-                return null;
-              })}
-            </div>
+            )}
 
             <div className="input">
               <div className="input_header">
-- 
GitLab


From 73b45a0f328e11eceebbeccde3dc003afecad576 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Omar=20Luna=20Hern=C3=A1ndez?= <42101656@uaz.edu.mx>
Date: Wed, 13 Nov 2024 10:16:47 -0600
Subject: [PATCH 3/7] Se modifica para que no se vuelvan a insertar puntos
 cuando se haya llegado al final

---
 .../src/pointOfInterest/PointOfInterest.service.ts | 14 ++++++++++++++
 1 file changed, 14 insertions(+)

diff --git a/backend/src/pointOfInterest/PointOfInterest.service.ts b/backend/src/pointOfInterest/PointOfInterest.service.ts
index 8ec12a18..c89cf494 100644
--- a/backend/src/pointOfInterest/PointOfInterest.service.ts
+++ b/backend/src/pointOfInterest/PointOfInterest.service.ts
@@ -40,6 +40,20 @@ export class PointOfInterestService {
     if (!place) {
       throw new BadRequestException('Place not found');
     }
+
+    const idPlace = place.idPlace;
+    const points: getPointDto[] = await this.dataSource
+      .getRepository(PointOfInterestTraduction)
+      .createQueryBuilder('pointTrad')
+      .leftJoin('pointTrad.idPoint', 'point')
+      .select(['point.idPoint as idPoint', 'pointTrad.directions as directions', 'point.idPlace as idPlace'])
+      .where('point.idPlace = :idPlace', { idPlace })
+      .andWhere('pointTrad.directions IS NULL')
+      .getRawMany();
+    if (points.length > 0) {
+      throw new BadRequestException('El ultimo punto ha sido registrad');
+    }
+
     const createPointDto: CreatePointDto = {
       name: createPointAndTradDto.name,
       imageName: createPointAndTradDto.image,
-- 
GitLab


From 47cdfcbbf4e29aa375c3d924deafec29dbe13b69 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Omar=20Luna=20Hern=C3=A1ndez?= <42101656@uaz.edu.mx>
Date: Wed, 13 Nov 2024 10:32:46 -0600
Subject: [PATCH 4/7] Se mejora el mensaje de error

---
 backend/src/pointOfInterest/PointOfInterest.service.ts | 2 +-
 web/src/domain/useCase/usePointOfInterest.ts           | 5 +----
 2 files changed, 2 insertions(+), 5 deletions(-)

diff --git a/backend/src/pointOfInterest/PointOfInterest.service.ts b/backend/src/pointOfInterest/PointOfInterest.service.ts
index 836bde07..1be3ce47 100644
--- a/backend/src/pointOfInterest/PointOfInterest.service.ts
+++ b/backend/src/pointOfInterest/PointOfInterest.service.ts
@@ -51,7 +51,7 @@ export class PointOfInterestService {
       .andWhere('pointTrad.directions IS NULL')
       .getRawMany();
     if (points.length > 0) {
-      throw new BadRequestException('El ultimo punto ha sido registrad');
+      throw new BadRequestException('El ultimo punto ha sido registrado. Para agregar más, cambia el último punto');
     }
 
     const createPointDto: CreatePointDto = {
diff --git a/web/src/domain/useCase/usePointOfInterest.ts b/web/src/domain/useCase/usePointOfInterest.ts
index 2104b533..7042bc8d 100644
--- a/web/src/domain/useCase/usePointOfInterest.ts
+++ b/web/src/domain/useCase/usePointOfInterest.ts
@@ -159,14 +159,11 @@ export const usePointOfInterest = (
         if (axios.isAxiosError(error)) {
           error as AxiosError;
           switch (error.code) {
-            case axios.AxiosError.ERR_BAD_REQUEST:
-              setErrorMessage("Acceso no autorizado");
-              break;
             case axios.AxiosError.ERR_NETWORK:
               setErrorMessage("Conexión con el servidor fallida");
               break;
             default:
-              setErrorMessage(error.message);
+              setErrorMessage(error.response?.data.message);
               break;
           }
         }
-- 
GitLab


From 18f2378ecd790e6873302ac7d6787620c33743fe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Omar=20Luna=20Hern=C3=A1ndez?= <42101656@uaz.edu.mx>
Date: Wed, 13 Nov 2024 14:16:13 -0600
Subject: [PATCH 5/7] Se agrega el metodo para eliminar un lugar

---
 web/src/data/datasource/api/place_datasource.ts | 9 +++++++++
 web/src/data/datasource/place_datasource.ts     | 7 +++++++
 web/src/data/repository/place_repository.ts     | 9 +++++++++
 web/src/domain/repository/place_repository.ts   | 7 +++++++
 4 files changed, 32 insertions(+)

diff --git a/web/src/data/datasource/api/place_datasource.ts b/web/src/data/datasource/api/place_datasource.ts
index 88145c21..946b8bb5 100644
--- a/web/src/data/datasource/api/place_datasource.ts
+++ b/web/src/data/datasource/api/place_datasource.ts
@@ -125,4 +125,13 @@ export class PlaceDatasourceProd implements PlaceDatasourceInf {
       headers,
     });
   }
+
+  /**
+   * Delete an existing place.
+   * @param idPlace - The place id to delete.
+   * @returns A promise that resolves when the place is deleted.
+   */
+  async deletePlace(idPlace: number): Promise<void> {
+    //await axios.patch(APIUrl + `/place/${idPlace}`)
+  }
 }
diff --git a/web/src/data/datasource/place_datasource.ts b/web/src/data/datasource/place_datasource.ts
index 3b787935..9407136a 100644
--- a/web/src/data/datasource/place_datasource.ts
+++ b/web/src/data/datasource/place_datasource.ts
@@ -31,4 +31,11 @@ export interface PlaceDatasourceInf {
    * @returns A promise that resolves when the update is complete.
    */
   updatePlace(place: Place): Promise<void>;
+
+  /**
+   * Delete an existing place.
+   * @param idPlace - The place id to delete.
+   * @returns A promise that resolves when the place is deleted.
+   */
+  deletePlace(idPlace: number): Promise<void>;
 }
diff --git a/web/src/data/repository/place_repository.ts b/web/src/data/repository/place_repository.ts
index aa120f13..f2c0c9dd 100644
--- a/web/src/data/repository/place_repository.ts
+++ b/web/src/data/repository/place_repository.ts
@@ -43,4 +43,13 @@ export class PlaceRepositoryProd implements PlaceRepositoryInf {
   async updatePlace(place: Place): Promise<void> {
     return this.datasouce.updatePlace(place);
   }
+
+  /**
+   * Delete an existing place.
+   * @param idPlace - The place id to delete.
+   * @returns A promise that resolves when the place is deleted.
+   */
+  async deletePlace(idPlace: number): Promise<void> {
+    return this.datasouce.deletePlace(idPlace);
+  }
 }
diff --git a/web/src/domain/repository/place_repository.ts b/web/src/domain/repository/place_repository.ts
index a89108d1..9ec6e750 100644
--- a/web/src/domain/repository/place_repository.ts
+++ b/web/src/domain/repository/place_repository.ts
@@ -31,4 +31,11 @@ export interface PlaceRepositoryInf {
    * @returns A promise that resolves when the place is updated.
    */
   updatePlace(place: Place): Promise<void>;
+
+  /**
+   * Delete an existing place.
+   * @param idPlace - The place id to delete.
+   * @returns A promise that resolves when the place is deleted.
+   */
+  deletePlace(idPlace: number): Promise<void>;
 }
-- 
GitLab


From 1fa58b652df5b5ab1dfc32d8e0856390bc94d6f4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Omar=20Luna=20Hern=C3=A1ndez?= <42101656@uaz.edu.mx>
Date: Wed, 13 Nov 2024 14:37:44 -0600
Subject: [PATCH 6/7] Se ha agreado la funcion para eliminar un lugar

---
 web/src/domain/useCase/usePlace.ts            |  9 ++
 .../admin_panel_place_list.tsx                | 92 ++++++++++++++++---
 .../admin_panel_place_screen.tsx              |  1 +
 3 files changed, 87 insertions(+), 15 deletions(-)

diff --git a/web/src/domain/useCase/usePlace.ts b/web/src/domain/useCase/usePlace.ts
index eec0430e..3f98a17b 100644
--- a/web/src/domain/useCase/usePlace.ts
+++ b/web/src/domain/useCase/usePlace.ts
@@ -234,6 +234,14 @@ export const usePlace = (
     });
   };
 
+  // Delete a place
+  const deletePlace = async (idPlace: number) => {
+    await placeRepository.deletePlace(idPlace);
+    if (forceRenderList) {
+      forceRenderList();
+    }
+  };
+
   // Handle form submission for updating a place
   const onSubmitUpdate: SubmitHandler<Place> = (data: Place) => {
     const fetch = async () => {
@@ -338,5 +346,6 @@ export const usePlace = (
     setCategoriesId,
     getPlaceById,
     getValues,
+    deletePlace,
   };
 };
diff --git a/web/src/presentation/admin/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx b/web/src/presentation/admin/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx
index e57c1a19..36ebe155 100644
--- a/web/src/presentation/admin/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx
+++ b/web/src/presentation/admin/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx
@@ -4,15 +4,18 @@ import { usePlace } from "../../../../domain/useCase/usePlace";
 import "./assets/css/styles.css";
 import { Place } from "../../../../data/datasource/api/entities/place";
 import { LoadingSpinner } from "../../../components/loading_spinner/loading_spinner";
-import { faEdit } from "@fortawesome/free-solid-svg-icons";
+import { faEdit, faTrash } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Dispatch, SetStateAction, useEffect } from "react";
+import { Dispatch, SetStateAction, useEffect, useState } from "react";
+import { toast } from "react-toastify";
+import { ConfirmationDialog } from "../../../components/confirmation_dialog_box/confirmation_dialog";
 
 // Define the props interface for the component
 interface props {
   idTown: number;
   isWindowActive: boolean;
   setWindowVisibility: (visibility: boolean) => void;
+  setIsWindowActiveDelete: Dispatch<SetStateAction<boolean>>;
   setActualPlace: Dispatch<SetStateAction<Place | undefined>>;
   setIsRegisterPane: Dispatch<SetStateAction<boolean>>;
 }
@@ -24,21 +27,62 @@ export const AdminPanelPlaceList = ({
   setWindowVisibility,
   setActualPlace,
   setIsRegisterPane,
+  setIsWindowActiveDelete,
 }: props) => {
   // Use the custom hook to fetch place data
-  const { placeList, pending, updatePlacesByTown } = usePlace();
+  const { placeList, pending, updatePlacesByTown, deletePlace } = usePlace();
+
+  // State variables for managing dialog and deletion
+  const [isDialogOpen, setIsDialogOpen] = useState(false);
+  const [dialogMessage, setDialogMessage] = useState("");
+  const [placeDeleted, setPlaceDeleted] = useState<Place | null>(null);
+  const [deletePlaceBool, setDeletePlaceBool] = useState(false);
 
   // Handle the edit action for a selected place
-  const handleEditSelectedCategory = (place: Place) => {
+  const handleEditSelectedPlace = (place: Place) => {
     setIsRegisterPane(false);
     setActualPlace(place);
     setWindowVisibility(true);
   };
 
+  // Function to delete the selected place with a toast notification
+  const deleteSelectedPlace = (place: Place) => {
+    toast.promise(deletePlace(place.idPlace || -1), {
+      pending: "Eliminando categoría...",
+      success: "La categoría se ha eliminado correctamente",
+      error: "No se pudo eliminar la categoría",
+    });
+  };
+
+  // Effect to handle Place deletion when deletePlaceBool changes
+  useEffect(() => {
+    if (deletePlaceBool && placeDeleted) {
+      deleteSelectedPlace(placeDeleted);
+      setDeletePlaceBool(false);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [deletePlaceBool]);
+
+  // Function to close the confirmation dialog
+  const handleToClose = () => {
+    setIsWindowActiveDelete(false);
+    setIsDialogOpen(false);
+  };
+
+  // Function to handle the delete action and open the confirmation dialog
+  const handleDeleteSelectedPlace = (place: Place) => {
+    setDialogMessage(
+      `¿Desea eliminar el lugar ${place.name}?\nEsto eliminará todos los datos relacionados a este lugar.`
+    );
+    setPlaceDeleted(place);
+    setIsDialogOpen(true);
+    setIsWindowActiveDelete(true);
+  };
+
   // Fetch the places when the component mounts
   useEffect(() => {
     updatePlacesByTown(idTown);
-  // eslint-disable-next-line react-hooks/exhaustive-deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   // Define the columns for the data table
@@ -50,7 +94,6 @@ export const AdminPanelPlaceList = ({
     {
       name: "Nombre",
       selector: (row) => row.name,
-      sortable: true,
     },
     {
       name: "Estado",
@@ -60,15 +103,27 @@ export const AdminPanelPlaceList = ({
       name: "Acciones",
       cell: (row) => {
         return (
-          <FontAwesomeIcon
-            style={isWindowActive ? { color: "gray" } : { cursor: "pointer" }}
-            icon={faEdit}
-            onClick={() => {
-              if (!isWindowActive) {
-                handleEditSelectedCategory(row);
-              }
-            }}
-          />
+          <>
+            <FontAwesomeIcon
+              style={isWindowActive ? { color: "gray" } : { cursor: "pointer" }}
+              icon={faTrash}
+              onClick={() => {
+                if (!isWindowActive) {
+                  handleDeleteSelectedPlace(row);
+                }
+              }}
+            />
+            <span style={{ margin: "0 10px" }}></span> {/* Separation between icons */}
+            <FontAwesomeIcon
+              style={isWindowActive ? { color: "gray" } : { cursor: "pointer" }}
+              icon={faEdit}
+              onClick={() => {
+                if (!isWindowActive) {
+                  handleEditSelectedPlace(row);
+                }
+              }}
+            />
+          </>
         );
       },
     },
@@ -85,6 +140,13 @@ export const AdminPanelPlaceList = ({
         data={placeList}
         className="data_table"
       />
+      {isDialogOpen && (
+        <ConfirmationDialog
+          handleToClose={handleToClose}
+          setAnswer={setDeletePlaceBool}
+          message={dialogMessage}
+        />
+      )}
     </div>
   );
 };
diff --git a/web/src/presentation/admin/admin_panel_places/admin_panel_place_screen/admin_panel_place_screen.tsx b/web/src/presentation/admin/admin_panel_places/admin_panel_place_screen/admin_panel_place_screen.tsx
index d86bae58..21e0cd8d 100644
--- a/web/src/presentation/admin/admin_panel_places/admin_panel_place_screen/admin_panel_place_screen.tsx
+++ b/web/src/presentation/admin/admin_panel_places/admin_panel_place_screen/admin_panel_place_screen.tsx
@@ -78,6 +78,7 @@ export const AdminPanelPlaceScreen = ({
           setWindowVisibility={setWindowVisibility}
           setActualPlace={setActualPlace}
           setIsRegisterPane={setIsRegisterPane}
+          setIsWindowActiveDelete={setIsWindowActive}
         />
       </div>
     </div>
-- 
GitLab


From ad35a544bc088faa79d70c5cb5b6b629c0d705be Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Omar=20Luna=20Hern=C3=A1ndez?= <42101656@uaz.edu.mx>
Date: Wed, 13 Nov 2024 20:31:23 -0600
Subject: [PATCH 7/7] Correccion de errores

---
 web/src/domain/useCase/usePlace.ts            | 28 +++++++++++++----
 web/src/domain/useCase/usePointOfInterest.ts  |  9 ++++++
 .../admin_panel_place_list.tsx                |  6 ++--
 .../admin_panel_place_register.tsx            |  9 ++++--
 .../assets/css/styles.css                     | 30 ++++++++++---------
 5 files changed, 57 insertions(+), 25 deletions(-)

diff --git a/web/src/domain/useCase/usePlace.ts b/web/src/domain/useCase/usePlace.ts
index 3f98a17b..d27057a2 100644
--- a/web/src/domain/useCase/usePlace.ts
+++ b/web/src/domain/useCase/usePlace.ts
@@ -14,6 +14,8 @@ import { showErrorAxios } from "../../core/utils/Messages";
 const placeDatasouce = new PlaceDatasourceProd();
 const placeRepository = new PlaceRepositoryProd(placeDatasouce);
 
+let lastSubmitTime = 0;
+
 // Define resolver for form validation
 const resolver: Resolver<Place> = async (data) => {
   const errors: FieldErrors<Place> = {};
@@ -199,6 +201,13 @@ export const usePlace = (
 
   // Handle form submission for registering a place
   const onSubmitRegister: SubmitHandler<Place> = (data: Place) => {
+    const currentTime = Date.now();
+    if (currentTime - lastSubmitTime < 5000) {
+      toast.error("Debe esperar 5 segundos entre ejecuciones.");
+      return;
+    }
+    lastSubmitTime = currentTime;
+
     const fetch = async () => {
       try {
         await placeRepository.registerPlace(data).then(() => {
@@ -212,12 +221,12 @@ export const usePlace = (
         if (axios.isAxiosError(error)) {
           error as AxiosError;
           switch (error.code) {
-            case axios.AxiosError.ERR_BAD_REQUEST:
-              errorMessage = "Acceso no autorizado";
-              break;
             case axios.AxiosError.ERR_NETWORK:
               errorMessage = "Conexión con el servidor fallida";
               break;
+            default:
+              errorMessage = error.response?.data.message;
+              break;
           }
         }
         throw new Error(errorMessage);
@@ -244,6 +253,13 @@ export const usePlace = (
 
   // Handle form submission for updating a place
   const onSubmitUpdate: SubmitHandler<Place> = (data: Place) => {
+    const currentTime = Date.now();
+    if (currentTime - lastSubmitTime < 5000) {
+      toast.error("Debe esperar 5 segundos entre ejecuciones.");
+      return;
+    }
+    lastSubmitTime = currentTime;
+
     const fetch = async () => {
       try {
         await placeRepository.updatePlace(data);
@@ -256,12 +272,12 @@ export const usePlace = (
         if (axios.isAxiosError(error)) {
           error as AxiosError;
           switch (error.code) {
-            case axios.AxiosError.ERR_BAD_REQUEST:
-              errorMessage = "Acceso no autorizado";
-              break;
             case axios.AxiosError.ERR_NETWORK:
               errorMessage = "Conexión con el servidor fallida";
               break;
+            default:
+              errorMessage = error.response?.data.message;
+              break;
           }
         }
         throw new Error(errorMessage);
diff --git a/web/src/domain/useCase/usePointOfInterest.ts b/web/src/domain/useCase/usePointOfInterest.ts
index 7042bc8d..722c190b 100644
--- a/web/src/domain/useCase/usePointOfInterest.ts
+++ b/web/src/domain/useCase/usePointOfInterest.ts
@@ -13,6 +13,8 @@ import { showErrorAxios } from "../../core/utils/Messages";
 const POIDatasouce = new POIDatasourceProd();
 const POIRepository = new POIRepositoryProd(POIDatasouce);
 
+let lastSubmitTime = 0;
+
 // Custom hook for point of interest functionality
 export const usePointOfInterest = (
   forceRenderList?: () => void,
@@ -145,6 +147,13 @@ export const usePointOfInterest = (
   const onSubmitRegister: SubmitHandler<PointOfInterest> = (
     data: PointOfInterest
   ) => {
+    const currentTime = Date.now();
+    if (currentTime - lastSubmitTime < 5000) {
+      toast.error("Debe esperar 5 segundos entre ejecuciones.");
+      return;
+    }
+    lastSubmitTime = currentTime;
+
     const fetch = async () => {
       try {
         await POIRepository.registerPoint(data).then(() => {
diff --git a/web/src/presentation/admin/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx b/web/src/presentation/admin/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx
index 36ebe155..468d0809 100644
--- a/web/src/presentation/admin/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx
+++ b/web/src/presentation/admin/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx
@@ -48,9 +48,9 @@ export const AdminPanelPlaceList = ({
   // Function to delete the selected place with a toast notification
   const deleteSelectedPlace = (place: Place) => {
     toast.promise(deletePlace(place.idPlace || -1), {
-      pending: "Eliminando categoría...",
-      success: "La categoría se ha eliminado correctamente",
-      error: "No se pudo eliminar la categoría",
+      pending: "Eliminando lugar...",
+      success: "El lugar se ha eliminado correctamente",
+      error: "No se pudo eliminar el lugar",
     });
   };
 
diff --git a/web/src/presentation/admin/admin_panel_places/admin_panel_place_register/admin_panel_place_register.tsx b/web/src/presentation/admin/admin_panel_places/admin_panel_place_register/admin_panel_place_register.tsx
index fe8e629d..c8efa887 100644
--- a/web/src/presentation/admin/admin_panel_places/admin_panel_place_register/admin_panel_place_register.tsx
+++ b/web/src/presentation/admin/admin_panel_places/admin_panel_place_register/admin_panel_place_register.tsx
@@ -154,7 +154,7 @@ export const AdminPanelPlaceRegister = ({
   return (
     <div className="place_register_wrap">
       <div className="place_register_header">
-        Registra el lugar
+        {isRegister ? "Registra" : "Actualiza"} el lugar
         <FontAwesomeIcon
           icon={faWindowClose}
           className="close_btn"
@@ -173,7 +173,12 @@ export const AdminPanelPlaceRegister = ({
             <div className="inputs_container">
               <div className="input">
                 <div className="input_header">Nombre del lugar</div>
-                <input type="text" {...register("name")} autoComplete="off" maxLength={255}/>
+                <input
+                  type="text"
+                  {...register("name")}
+                  autoComplete="off"
+                  maxLength={255}
+                />
                 <p className="error">{errors.name?.message}</p>
               </div>
 
diff --git a/web/src/presentation/superadmin/sa_panel_admin/sa_panel_admin_register/assets/css/styles.css b/web/src/presentation/superadmin/sa_panel_admin/sa_panel_admin_register/assets/css/styles.css
index fccd3249..23e3a368 100644
--- a/web/src/presentation/superadmin/sa_panel_admin/sa_panel_admin_register/assets/css/styles.css
+++ b/web/src/presentation/superadmin/sa_panel_admin/sa_panel_admin_register/assets/css/styles.css
@@ -1,4 +1,4 @@
-*{
+* {
   user-select: none;
 }
 
@@ -11,21 +11,23 @@
   margin: auto;
   width: 30vw;
   height: 70vh;
-  background: green;
+  background: white;
   display: flex;
   z-index: 999;
   flex-direction: column;
+  border: solid 2px black;
 }
 
-.admin_register_header  {
+.admin_register_header {
   display: flex;
   width: 100%;
   align-items: center;
   justify-content: center;
   padding: 5px;
+  background: #ccc;
 }
 
-.admin_register_close_btn{
+.admin_register_close_btn {
   display: inline-block;
   cursor: pointer;
   position: absolute;
@@ -40,13 +42,13 @@
   flex-direction: column;
 }
 
-.admin_register_content form{
+.admin_register_content form {
   display: flex;
   flex-direction: column;
   flex-grow: 1;
 }
 
-.admin_input_cnt{
+.admin_input_cnt {
   display: flex;
   align-items: center;
   justify-content: center;
@@ -54,40 +56,40 @@
   padding: 5px 0;
 }
 
-.admin_input_cnt input{
+.admin_input_cnt input {
   width: 80%;
   padding: 5px 20px;
-  border: 1px solid  lightgray;
+  border: 1px solid lightgray;
   border-radius: 5px;
 }
 
-.error{
+.error {
   color: red;
   font-size: 12px;
   padding: 0;
   margin: 0;
 }
 
-.admin_input_cnt .submit_btn{
+.admin_input_cnt .submit_btn {
   width: 30%;
 }
 
-.password_input_visibility_cnt{
+.password_input_visibility_cnt {
   position: relative;
   width: 80%;
 }
 
-.password_input_visibility_cnt input{
+.password_input_visibility_cnt input {
   width: 100%;
   padding-left: 20px;
   padding-right: 30px;
 }
 
-.pass-visibility-button{
+.pass-visibility-button {
   position: absolute;
   top: 50%;
   right: 5px;
   transform: translateY(-50%);
   transform: all 0.3s ease;
   cursor: pointer;
-}
\ No newline at end of file
+}
-- 
GitLab