From 45eda7126f7b7cdb51ddc11a29edd75cbfb24864 Mon Sep 17 00:00:00 2001 From: Your Name Date: Tue, 9 Dec 2025 04:43:35 +0000 Subject: [PATCH] Auto deploy: 2025-12-09 04:43:32 --- src/components/Map/MapView.jsx | 31 ++++++++++++------------------- 1 file changed, 12 insertions(+), 19 deletions(-) diff --git a/src/components/Map/MapView.jsx b/src/components/Map/MapView.jsx index 01a87a8..c8c0e08 100644 --- a/src/components/Map/MapView.jsx +++ b/src/components/Map/MapView.jsx @@ -1,6 +1,6 @@ import React, { useEffect, useRef, useState } from "react"; import maplibregl from "maplibre-gl"; -import "../../styles/maplibre.css"; // ✅ CSS locale copiée via bash +import "../../styles/maplibre.css"; // CSS locale copiée depuis maplibre-gl import { fetchPosts, fetchIpLocation, createPost } from "../../api/client"; @@ -28,7 +28,8 @@ export default function MapView() { const markersRef = useRef([]); // [{ id, marker, el, ... }] const expandedElRef = useRef(null); - const allPostsRef = useRef([]); // posts bruts (sans filtre temps) + // posts bruts (sans filtre temps) – maintenant indépendants du zoom + const allPostsRef = useRef([]); const [status, setStatus] = useState("Loading posts..."); @@ -38,6 +39,7 @@ export default function MapView() { const [userPosition, setUserPosition] = useState(null); // [lng, lat] + // on garde ça juste pour mémoriser la vue & lastView const [viewParams, setViewParams] = useState({ center: null, radiusKm: 250, @@ -118,7 +120,7 @@ export default function MapView() { setViewParams(vp); }); - // update viewParams à chaque move + // update viewParams à chaque move (juste pour sauvegarder centre/zoom) map.on("moveend", () => { const vp = getViewFromMap(map); setViewParams(vp); @@ -244,35 +246,25 @@ export default function MapView() { setStatus(visible.length ? "" : "No posts found."); }; - /* ------------ LOAD POSTS POUR LA ZONE COURANTE + CAT + SOUS-CAT -------------- */ + /* ------------ LOAD POSTS (cat + sous-cat) – PLUS LIÉ AU ZOOM -------------- */ useEffect(() => { - const map = mapRef.current; - if (!map) return; - if (!viewParams.center) return; - let cancelled = false; async function load() { try { setStatus("Loading posts..."); - const [lng, lat] = viewParams.center; - const radiusKm = viewParams.radiusKm || 250; - const catCode = categoryCode(mainFilter); const subCatParam = subFilter && subFilter.toUpperCase() !== "ALL" && subFilter !== "All" ? subFilter : ""; - // time="" -> backend renvoie TOUT pour zone + cat + sous-cat + // ⚠️ PAS de lat/lon/radius → backend renvoie tout (limité à 500) const posts = await fetchPosts({ category: catCode, subCategory: subCatParam, - time: "", - lat, - lon: lng, - radiusKm, + time: "", // on gère le temps en front }); if (cancelled) return; @@ -291,8 +283,9 @@ export default function MapView() { return () => { cancelled = true; }; + // déclenche seulement quand la catégorie ou sous-cat change // eslint-disable-next-line react-hooks/exhaustive-deps - }, [viewParams, mainFilter, subFilter]); + }, [mainFilter, subFilter]); /* ------------ QUAND LE TIME FILTER CHANGE, ON RECONSTRUIT JUSTE LES MARKERS -------------- */ useEffect(() => { @@ -324,7 +317,7 @@ export default function MapView() { if (msg.type === "new_post" && msg.post) { const p = msg.post; - // Filtrage live: cat + sous-cat + temps + zone + // Filtrage live: cat + sous-cat + temps (plus de rayon) const catCode = categoryCode(mainFilter); if ( catCode && @@ -365,7 +358,7 @@ export default function MapView() { ws.close(); } }; - }, [mainFilter, subFilter, timeFilter, viewParams]); + }, [mainFilter, subFilter, timeFilter]); /* ------------ ACTIONS UI -------------- */