From 32574981f659a6c59faf968c8dbfe6eda3c632d6 Mon Sep 17 00:00:00 2001
From: Ariel Costas Guerrero <ariel@costas.dev>
Date: Mon, 20 Apr 2026 16:23:00 +0200
Subject: Mostrar procedencia en rutas interurbanas

Closes #154
---
 src/frontend/app/api/schema.ts                       |  1 +
 src/frontend/app/components/arrivals/ArrivalCard.tsx | 16 ++++++++++++++--
 2 files changed, 15 insertions(+), 2 deletions(-)

(limited to 'src/frontend/app')

diff --git a/src/frontend/app/api/schema.ts b/src/frontend/app/api/schema.ts
index 864ea57..d900055 100644
--- a/src/frontend/app/api/schema.ts
+++ b/src/frontend/app/api/schema.ts
@@ -11,6 +11,7 @@ export const HeadsignInfoSchema = z.object({
   badge: z.string().optional().nullable(),
   destination: z.string().nullable(),
   marquee: z.string().optional().nullable(),
+  origin: z.string().optional().nullable(),
 });
 
 export const ArrivalPrecisionSchema = z.enum([
diff --git a/src/frontend/app/components/arrivals/ArrivalCard.tsx b/src/frontend/app/components/arrivals/ArrivalCard.tsx
index 51e0803..3aae65e 100644
--- a/src/frontend/app/components/arrivals/ArrivalCard.tsx
+++ b/src/frontend/app/components/arrivals/ArrivalCard.tsx
@@ -34,7 +34,7 @@ const AutoMarquee = ({ text }: { text: string }) => {
     if (!el) return;
 
     const checkScroll = () => {
-      const charWidth = 8;
+      const charWidth = 12;
       const availableWidth = el.offsetWidth;
       const textWidth = text.length * charWidth;
       setShouldScroll(textWidth > availableWidth);
@@ -252,10 +252,22 @@ export const ArrivalCard: React.FC<ArrivalCardProps> = ({
               {operator && (
                 <span className="text-xs font-mono text-slate-700 dark:text-slate-200 font-medium shrink-0">
                   {operator}
+                  {headsign.destination || headsign.origin ? (
+                    <>&nbsp;·&nbsp;</>
+                  ) : (
+                    ""
+                  )}
+                </span>
+              )}
+              {headsign.origin && (
+                <span className="text-xs font-mono text-slate-500 dark:text-slate-400 shrink-0">
+                  Proc: {headsign.origin}{" "}
                   {headsign.marquee && <>&nbsp;·&nbsp;</>}
                 </span>
               )}
-              {headsign.marquee && <AutoMarquee text={headsign.marquee} />}
+              {headsign.marquee && (
+                <AutoMarquee text={"Via: " + headsign.marquee} />
+              )}
             </div>
           </div>
         </div>
-- 
cgit v1.3