From b87c9084159d0ce0a8081f9f3d9eaf0c4ec8df14 Mon Sep 17 00:00:00 2001
From: AI Assistant <ai@architools.local>
Date: Tue, 24 Mar 2026 16:39:01 +0200
Subject: [PATCH] fix(parcel-sync): static connection dots, legend position,
 mismatch labels

- ePay + eTerra pills: removed animate-ping, now show static green dot
  when connected (no more spinning appearance)
- Legend moved to top-left, hides when FeatureInfoPanel is open
  (no more overlap)
- Boundary mismatch parcels now show cadastral numbers as labels
  (orange for foreign, purple for edge parcels)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../components/connection-pill.tsx            |  5 +---
 .../parcel-sync/components/epay-connect.tsx   |  5 +---
 .../parcel-sync/components/tabs/map-tab.tsx   | 30 +++++++++++++++++--
 3 files changed, 30 insertions(+), 10 deletions(-)

diff --git a/src/modules/parcel-sync/components/connection-pill.tsx b/src/modules/parcel-sync/components/connection-pill.tsx
index 458b451..b9662ea 100644
--- a/src/modules/parcel-sync/components/connection-pill.tsx
+++ b/src/modules/parcel-sync/components/connection-pill.tsx
@@ -64,10 +64,7 @@ export function ConnectionPill({
           {connecting ? (
             <Loader2 className="h-3 w-3 animate-spin" />
           ) : session.connected ? (
-            <span className="relative flex h-2 w-2">
-              <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-emerald-400 opacity-75" />
-              <span className="relative inline-flex h-2 w-2 rounded-full bg-emerald-500" />
-            </span>
+            <span className="inline-flex h-2 w-2 rounded-full bg-emerald-500" />
           ) : session.eterraMaintenance ? (
             <AlertTriangle className="h-3 w-3" />
           ) : connectionError ? (
diff --git a/src/modules/parcel-sync/components/epay-connect.tsx b/src/modules/parcel-sync/components/epay-connect.tsx
index af7f72e..80281d8 100644
--- a/src/modules/parcel-sync/components/epay-connect.tsx
+++ b/src/modules/parcel-sync/components/epay-connect.tsx
@@ -205,10 +205,7 @@ export function EpayConnect({
               {connecting ? (
                 <Loader2 className="h-3 w-3 animate-spin" />
               ) : status.connected ? (
-                <span className="relative flex h-2 w-2">
-                  <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-emerald-400 opacity-75" />
-                  <span className="relative inline-flex h-2 w-2 rounded-full bg-emerald-500" />
-                </span>
+                <span className="inline-flex h-2 w-2 rounded-full bg-emerald-500" />
               ) : null}
 
               <span className="hidden sm:inline">ePay</span>
diff --git a/src/modules/parcel-sync/components/tabs/map-tab.tsx b/src/modules/parcel-sync/components/tabs/map-tab.tsx
index 8af9d15..241ca24 100644
--- a/src/modules/parcel-sync/components/tabs/map-tab.tsx
+++ b/src/modules/parcel-sync/components/tabs/map-tab.tsx
@@ -364,6 +364,30 @@ export function MapTab({ siruta, sirutaValid }: MapTabProps) {
                 "line-dasharray": [4, 2],
               },
             });
+
+            // Labels with cadastral numbers
+            map.addLayer({
+              id: "l-mismatch-label",
+              type: "symbol",
+              source: "boundary-mismatch",
+              layout: {
+                "text-field": ["coalesce", ["get", "cadastral_ref"], ""],
+                "text-font": ["Noto Sans Bold"],
+                "text-size": 11,
+                "text-anchor": "center",
+                "text-allow-overlap": true,
+              },
+              paint: {
+                "text-color": [
+                  "case",
+                  ["==", ["get", "mismatch_type"], "foreign"],
+                  "#ea580c",
+                  "#9333ea",
+                ],
+                "text-halo-color": "#ffffff",
+                "text-halo-width": 1.5,
+              },
+            });
           }
         },
       )
@@ -475,8 +499,9 @@ export function MapTab({ siruta, sirutaValid }: MapTabProps) {
           />
         </div>
 
-        {/* Bottom-right: legend */}
-        <div className="absolute bottom-3 right-3 z-10 rounded-lg bg-background/90 border p-2 text-[10px] space-y-1">
+        {/* Top-left: legend (hidden when feature panel is open) */}
+        {!clickedFeature && (
+        <div className="absolute top-3 left-3 z-10 rounded-lg bg-background/90 border p-2 text-[10px] space-y-1">
           <div className="flex items-center gap-1.5">
             <span
               className="inline-block h-3 w-3 rounded-sm"
@@ -543,6 +568,7 @@ export function MapTab({ siruta, sirutaValid }: MapTabProps) {
             </>
           )}
         </div>
+        )}
       </div>
     </div>
   );