From c50690cc8a6ba053e58a3d3d25fc8e8e9357d4b2 Mon Sep 17 00:00:00 2001
From: vjrj <vjrj@comunes.org>
Date: Tue, 28 Jul 2026 00:35:11 +0200
Subject: [PATCH] fix(maps): evitar carrera MapReady/DDP que dejaba el mapa en
 gris

En react-leaflet v4 la capa union no se dibujaba (mundo gris a zoom 0) en
/zones, /subscriptions y el bloque Participa cuando los datos DDP llegaban
despues de montar el mapa. Se anade reintento en componentDidUpdate y se
endurece la guarda, con flag de instancia para el ajuste de bounds.
---
 .../ui/pages/Subscriptions/SubscriptionsMap.js  | 17 +++++++++++++++--
 1 file changed, 15 insertions(+), 2 deletions(-)

diff --git a/imports/ui/pages/Subscriptions/SubscriptionsMap.js b/imports/ui/pages/Subscriptions/SubscriptionsMap.js
index d7c2c40..b1a98e4 100644
--- a/imports/ui/pages/Subscriptions/SubscriptionsMap.js
+++ b/imports/ui/pages/Subscriptions/SubscriptionsMap.js
@@ -43,6 +43,15 @@ class SubscriptionsMap extends React.Component {
     this.handleMapReady = this.handleMapReady.bind(this);
   }
 
+  // The `subs-public-union` doc (~2.2MB) usually arrives via DDP *after* the map
+  // is ready, so the one-shot MapReady draw runs with `userSubs` still null.
+  // Redraw the union (and fit bounds on first real data) whenever it changes.
+  componentDidUpdate(prevProps) {
+    if (this.map && this.props.userSubs && this.props.userSubs !== prevProps.userSubs) {
+      this.handleLeafletLoad(this.map);
+    }
+  }
+
   getMap() {
     return this.map;
   }
@@ -66,7 +75,7 @@ class SubscriptionsMap extends React.Component {
 
   handleLeafletLoad(map) {
     // console.log('Map loading');
-    if (map && this.props.userSubs !== 'null') {
+    if (map && this.props.userSubs && this.props.userSubs !== 'null') {
       // console.log(`Union of ${this.props.userSubs}`);
       this.state.union = subsUnion(this.state.union, {
         map,
@@ -74,8 +83,12 @@ class SubscriptionsMap extends React.Component {
         bounds: this.props.userSubsBounds,
         fromServer: true,
         show: true,
-        fit: this.state.init
+        // Only auto-fit to the union the first time we draw it with real data
+        // (and never once the user has recentred), so later reactive updates
+        // don't steal the current view. `fitDone` is a plain instance flag.
+        fit: this.state.init && !this.fitDone
       });
+      this.fitDone = true;
     }
   }