From ecb73e1684b42265af3f8d93541600e4d0f9c414 Mon Sep 17 00:00:00 2001
From: Ariel Costas Guerrero <ariel@costas.dev>
Date: Tue, 24 Jun 2025 16:14:28 +0200
Subject: Implement i18n

Closes #18
---
 src/frontend/app/routes/stoplist.tsx | 16 +++-------------
 1 file changed, 3 insertions(+), 13 deletions(-)

(limited to 'src/frontend/app/routes/stoplist.tsx')

diff --git a/src/frontend/app/routes/stoplist.tsx b/src/frontend/app/routes/stoplist.tsx
index ff1da71..0ab6d15 100644
--- a/src/frontend/app/routes/stoplist.tsx
+++ b/src/frontend/app/routes/stoplist.tsx
@@ -3,25 +3,15 @@ import StopDataProvider, { type Stop } from "../data/StopDataProvider";
 import StopItem from "../components/StopItem";
 import Fuse from "fuse.js";
 import './stoplist.css';
-
-const placeholders = [
-	"Urzaiz",
-	"Gran Vía",
-	"Castelao",
-	"García Barbón",
-	"Valladares",
-	"Florida",
-	"Pizarro",
-	"Estrada Madrid",
-	"Sanjurjo Badía"
-];
+import { useTranslation } from "react-i18next";
 
 export default function StopList() {
+	const { t } = useTranslation();
 	const [data, setData] = useState<Stop[] | null>(null)
 	const [searchResults, setSearchResults] = useState<Stop[] | null>(null);
 	const searchTimeout = useRef<NodeJS.Timeout | null>(null);
 
-	const randomPlaceholder = useMemo(() => placeholders[Math.floor(Math.random() * placeholders.length)], []);
+	const randomPlaceholder = useMemo(() => t('stoplist.search_placeholder'), [t]);
 	const fuse = useMemo(() => new Fuse(data || [], { threshold: 0.3, keys: ['name.original'] }), [data]);
 
 	useEffect(() => {
-- 
cgit v1.3

