From 10f0e63657888f8a681c4cafcb0bde44b3e0f8ed Mon Sep 17 00:00:00 2001
From: Meik <meikdre@gmx.de>
Date: Mon, 10 Nov 2025 23:56:50 +0100
Subject: [PATCH] maps route link

---
 src/components/StoreWatchPage.js | 37 +++++++++++++++++++++++++++++++-
 1 file changed, 36 insertions(+), 1 deletion(-)

diff --git a/src/components/StoreWatchPage.js b/src/components/StoreWatchPage.js
index 48a14eb..4ec2f6f 100644
--- a/src/components/StoreWatchPage.js
+++ b/src/components/StoreWatchPage.js
@@ -480,7 +480,42 @@ const StoreWatchPage = ({
         cell: ({ row }) => (
           <div>
             <p className="text-gray-800 text-sm">{row.original.city || 'unbekannt'}</p>
-            <p className="text-xs text-gray-500">{row.original.street || ''}</p>
+            <div className="flex items-center gap-1">
+              <p className="text-xs text-gray-500">{row.original.street || ''}</p>
+              {(() => {
+                const hasUserLocation =
+                  userLocation &&
+                  Number.isFinite(userLocation.lat) &&
+                  Number.isFinite(userLocation.lon);
+                const storeLat = Number(row.original.location?.lat);
+                const storeLon = Number(row.original.location?.lon);
+                const hasStoreLocation = Number.isFinite(storeLat) && Number.isFinite(storeLon);
+                if (!hasUserLocation || !hasStoreLocation) {
+                  return null;
+                }
+                const origin = encodeURIComponent(`${userLocation.lat},${userLocation.lon}`);
+                const destination = encodeURIComponent(`${storeLat},${storeLon}`);
+                const mapsUrl = `https://www.google.com/maps/dir/?api=1&origin=${origin}&destination=${destination}&travelmode=driving`;
+                return (
+                  <a
+                    href={mapsUrl}
+                    target="_blank"
+                    rel="noopener noreferrer"
+                    className="inline-flex h-5 w-5 items-center justify-center rounded text-gray-400 hover:text-blue-600"
+                    title="Route zu diesem Betrieb in Google Maps öffnen"
+                  >
+                    <span className="sr-only">Route in Google Maps</span>
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" className="h-4 w-4">
+                      <path
+                        fillRule="evenodd"
+                        d="M10.293 2.293a1 1 0 0 1 1.414 0l5.5 5.5a1 1 0 0 1-1.414 1.414L11 4.414V17a1 1 0 1 1-2 0V4.414L4.207 9.207a1 1 0 0 1-1.414-1.414l5.5-5.5Z"
+                        clipRule="evenodd"
+                      />
+                    </svg>
+                  </a>
+                );
+              })()}
+            </div>
           </div>
         ),
         sortingFn: 'alphanumeric',