From 663a2a3ff10bf55498a6c8731b1a32e9f98d7343 Mon Sep 17 00:00:00 2001
From: Ariel Costas Guerrero <94913521+arielcostas@users.noreply.github.com>
Date: Fri, 30 Aug 2024 16:37:03 +0200
Subject: Replace <a> to links

---
 src/pages/Home.tsx |  6 +++---
 src/pages/Stop.tsx | 24 +++++++++++++++++++++---
 2 files changed, 24 insertions(+), 6 deletions(-)

(limited to 'src')

diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx
index f92847a..5070e5f 100644
--- a/src/pages/Home.tsx
+++ b/src/pages/Home.tsx
@@ -1,4 +1,4 @@
-import { useNavigate } from "react-router-dom";
+import { Link, useNavigate } from "react-router-dom";
 import useSWR from "swr";
 
 interface Stop {
@@ -75,9 +75,9 @@ export function Home() {
 			<ul>
 				{data?.sort((a, b) => a.stopId - b.stopId).map((stop: Stop) => (
 					<li key={stop.stopId}>
-						<a href={`/${stop.stopId}`}>
+						<Link to={`/${stop.stopId}`}>
 							({stop.stopId}) {stop.name} - {stop.lines?.join(', ')}
-						</a>
+						</Link>
 					</li>
 				))}
 			</ul>
diff --git a/src/pages/Stop.tsx b/src/pages/Stop.tsx
index 33f1a31..a5effc1 100644
--- a/src/pages/Stop.tsx
+++ b/src/pages/Stop.tsx
@@ -1,4 +1,4 @@
-import { useParams } from "react-router-dom";
+import { Link, useParams } from "react-router-dom";
 import useSWR from "swr";
 
 interface StopDetails {
@@ -46,7 +46,25 @@ export function Stop(): JSX.Element {
 
 	return (
 		<>
-			<h1>{data?.stop.name} ({data?.stop.id})</h1>
+			<div>
+				<h1>{data?.stop.name} ({data?.stop.id})</h1>
+			</div>
+
+			<Link to="/">
+				<svg
+					xmlns="http://www.w3.org/2000/svg"
+					viewBox="0 0 24 24"
+					fill="none"
+					stroke="currentColor"
+					strokeWidth="2"
+					strokeLinecap="round"
+					strokeLinejoin="round"
+					style={{marginInlineEnd: '0.5em', width: '1em', height: '1em'}}
+				>
+					<path d="M19 12H5M12 19l-7-7 7-7" />
+				</svg>
+				Volver al listado de paradas
+			</Link>
 
 			<table>
 				<caption>Estimaciones de llegadas</caption>
@@ -82,7 +100,7 @@ export function Stop(): JSX.Element {
 			</table>
 
 			<p>
-				<a href="/">Volver al inicio</a>
+				<Link to="/">Volver al inicio</Link>
 			</p>
 		</>
 	)
-- 
cgit v1.3