From 09375bd5d8e00d2b1150f0d8b3967729c6fa4b9a Mon Sep 17 00:00:00 2001
From: Adrian <adrianmartinezr2002@gmail.com>
Date: Mon, 1 May 2023 01:06:02 +0200
Subject: [PATCH] =?UTF-8?q?A=C3=B1adido=20boton=20para=20eliminar=20marcad?=
 =?UTF-8?q?or=20de=20una=20ruta?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 webapp/src/components/RoutesSidebar/index.tsx | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/webapp/src/components/RoutesSidebar/index.tsx b/webapp/src/components/RoutesSidebar/index.tsx
index 59a1326..fc07a4f 100644
--- a/webapp/src/components/RoutesSidebar/index.tsx
+++ b/webapp/src/components/RoutesSidebar/index.tsx
@@ -17,7 +17,7 @@ import CloseButton from "../CloseButton";
 import { useTranslation } from "react-i18next";
 import { IRoute } from "../../types/IRoute";
 import DeleteButton from "../DeleteButton";
-import { Box, Button, Divider, Menu, MenuItem, Tooltip, Typography } from "@mui/material";
+import { Box, Button, Divider, IconButton, Menu, MenuItem, Tooltip, Typography } from "@mui/material";
 import { AiFillPlusCircle } from "react-icons/ai";
 import { TbArrowBackUp } from "react-icons/tb";
 import { v4 as uuid } from "uuid";
@@ -26,6 +26,7 @@ import { RoutesContext } from "../../context/RoutesContext";
 import { IMarker } from "../../types/IMarker";
 import { Types } from "../../types/ContextActionTypes";
 import { MarkerContext } from "../../context/MarkersContext";
+import { Close as CloseIcon } from '@mui/icons-material';
 
 type Props = {
   toggleSidebar: (open?: boolean) => void;
@@ -194,6 +195,14 @@ const RouteInfo = ({ route, close }: InfoProps) => {
     setDragOverMarker(null)
   }
 
+  const deleteMarker = (id: string) => {
+    console.log(id)
+    let markers = route.points.filter(m => m.id !== id)
+    console.log(markers)
+    route.points = [...markers]
+    rDispatch({ type: Types.UPDATE, payload: { id: route.id, route: { points: [...markers]} } })
+  }
+
   return (
     <>
       <Button
@@ -232,6 +241,11 @@ const RouteInfo = ({ route, close }: InfoProps) => {
                   <h3>{marker.name}</h3>
                   <p>{marker.description}</p>
                 </MarkerContent>
+                <Tooltip title={t('sidebar.list.delete.tooltip')}>
+                  <IconButton onClick={() => deleteMarker(marker.id)}>
+                    <CloseIcon />
+                  </IconButton>
+                </Tooltip>
               </MarkerSection>
             ))
           }