✨ Removed query parameter subscription on renderPins and added a check to open the popup of a selected marker (fix popup opens if pin in cluster).

src/app/components/leaflet-map/leaflet-map.component.ts

@@ -335,51 +335,20 @@ export class LeafletMapComponent implements OnInit {
 
       this.markersMap[pin.id] = marker;
 
-      this.route.queryParams
-        .subscribe((params) => {
-          const pinId = params['pin'];
-          if (pinId) {
-            const marker = this.markersMap[pinId];
-            if (marker) {
-              setTimeout(() => {
-                marker.openPopup();
-              }, 1); // 1ms pour que l'événement popupopen se produise correctement
-
-              const latlng = marker.getLatLng();
-              const zoom = this.map.getZoom();
-              const offsetLat = 0.05 / Math.pow(2, zoom - 10);
-              this.map.setView(
-                L.latLng(latlng.lat + offsetLat, latlng.lng),
-                zoom
-              );
-            }
-          }
-        })
-        .unsubscribe();
       this.markerClusterGroup.addLayer(marker);
-
-      if (
-        this.selectedCountry === '__all__' &&
-        this.selectedPerson === '__all__'
-      ) {
-        this.map.fitBounds(
-          L.latLngBounds(
-            filteredPins.map((pin) => pin.location as [number, number])
-          ),
-          {
-            padding: [50, 50],
-            maxZoom: 10,
-            animate: true,
-            duration: 1.5,
-          }
-        );
-      }
     });
 
     this.markerClusterGroup.refreshClusters();
 
+    // Vérifier si un pin est sélectionné
+    const pinId = this.route.snapshot.queryParamMap.get('pin');
+
     // Ajuster la vue si un pays est sélectionné
-    if (this.selectedCountry !== '__all__' && filteredPins.length > 0) {
+    if (
+      this.selectedCountry !== '__all__' &&
+      filteredPins.length > 0 &&
+      !pinId
+    ) {
       const bounds = L.latLngBounds(
         filteredPins.map((pin) => pin.location as [number, number])
       );
@@ -390,6 +359,17 @@ export class LeafletMapComponent implements OnInit {
         duration: 1.5, // Durée de l'animation en secondes
       });
     }
+
+    if (pinId) {
+      const marker = this.markersMap[pinId];
+      if (marker) {
+        const latlng = marker.getLatLng();
+        this.map.setView(L.latLng(latlng.lat, latlng.lng), 20);
+        setTimeout(() => {
+          marker.openPopup();
+        }, 100);
+      }
+    }
   }
 
   private createDivIcon(htmlContent: string): L.DivIcon {