- ${
- img
+ ` : ''}
+
+ ${isCamera ? `
+
+ ` : img
? `
})
`
: `
${escapeHtml(normCatLabel(postData))}
`
}
@@ -1020,15 +1232,21 @@ export function openCenteredOverlay({ map, post, theme, fullScreen = false }) {
+ ${isCamera ? `
+
+ Watch Live Stream
+
+ ` : `
+ `}
-
+ ${!isCamera ? `` : ''}
-
+ ${!isCamera ? `` : ''}
@@ -1539,14 +1757,17 @@ export function createMarkerForPost(post, mapRef, markersRef, expandedElRef, the
root.addEventListener("click", (ev) => {
ev.stopPropagation();
+ // Use root.__post to get the most up-to-date post data (may have been refreshed)
+ const currentPost = root.__post || post;
+
const existing = map.__swCenteredOverlay;
- if (existing && existing.postId === post?.id) {
+ if (existing && existing.postId === currentPost?.id) {
if (existing.openedAt && Date.now() - existing.openedAt < 800) return;
closeCenteredOverlay(map, { force: true });
return;
}
- openCenteredOverlay({ map, post, theme, fullScreen: false });
+ openCenteredOverlay({ map, post: currentPost, theme, fullScreen: false });
if (expandedElRef) expandedElRef.current = null;
});
}
@@ -1592,7 +1813,20 @@ export function createSimpleMarkerForPost(post, mapRef, markersRef, expandedElRe
function renderSimple() {
const activePost = root.__post || post;
- const color = getMarkerColorForCategory(activePost?.category);
+ const isCamera = activePost?.content_type === 'camera';
+ const isLive = activePost?.content_type === 'live';
+ const liveColor = 'linear-gradient(135deg, rgba(220,38,38,0.95), rgba(239,68,68,0.95))';
+ const livePin = 'rgba(220,38,38,0.95)';
+ const color = isLive
+ ? liveColor
+ : isCamera
+ ? 'linear-gradient(135deg, rgba(56, 189, 248, 0.9), rgba(59, 130, 246, 0.9))'
+ : getMarkerColorForCategory(activePost?.category);
+ const pinColor = isLive
+ ? livePin
+ : isCamera
+ ? 'rgba(56, 189, 248, 0.9)'
+ : getMarkerColorForCategory(activePost?.category);
const img = normalizeImageUrl(activePost?.image_small || "");
root.__lastTemplateKey = getTemplateKeyForPost(activePost);
root.__lastImage = img || "";
@@ -1600,13 +1834,13 @@ export function createSimpleMarkerForPost(post, mapRef, markersRef, expandedElRe
// Marqueur pin avec image en haut et pointe en bas
root.innerHTML = `
-
- ${img ? `
` : `
+ ${isLive ? `
` : isCamera ? `
` : img ? `
` : `
+ ${isCamera ? `
+ LIVE
+
` : ""}
${escapeHtml(activePost?.title || "Untitled")}
@@ -1660,7 +1897,7 @@ export function createSimpleMarkerForPost(post, mapRef, markersRef, expandedElRe
${escapeHtml((activePost?.snippet || "").substring(0, 80))}${(activePost?.snippet || "").length > 80 ? "..." : ""}
- ${normCatLabel(activePost)} • ${formatRelativeTime(activePost?.created_at || activePost?.CreatedAt)}
+ ${isCamera ? `` : ""}${normCatLabel(activePost)} • ${isCamera ? (activePost?.region || "Quebec") : formatRelativeTime(activePost?.created_at || activePost?.CreatedAt)}
`;
@@ -1706,14 +1943,26 @@ export function createSimpleMarkerForPost(post, mapRef, markersRef, expandedElRe
root.addEventListener("click", (ev) => {
ev.stopPropagation();
+ // Use root.__post to get the most up-to-date post data (may have been refreshed)
+ const currentPost = root.__post || post;
+
+ // Debug logging
+ console.log('[SimpleMarker click] currentPost:', {
+ id: currentPost?.id,
+ content_type: currentPost?.content_type,
+ source: currentPost?.source,
+ hasRootPost: !!root.__post,
+ rootPostContentType: root.__post?.content_type
+ });
+
const existing = map.__swCenteredOverlay;
- if (existing && existing.postId === post?.id) {
+ if (existing && existing.postId === currentPost?.id) {
if (existing.openedAt && Date.now() - existing.openedAt < 800) return;
closeCenteredOverlay(map, { force: true });
return;
}
- openCenteredOverlay({ map, post, theme, fullScreen: false });
+ openCenteredOverlay({ map, post: currentPost, theme, fullScreen: false });
if (expandedElRef) expandedElRef.current = null;
});
diff --git a/src/components/Map/usePostsEngine.js b/src/components/Map/usePostsEngine.js
index 6753eac..fdfe086 100644
--- a/src/components/Map/usePostsEngine.js
+++ b/src/components/Map/usePostsEngine.js
@@ -1398,5 +1398,34 @@ export function usePostsEngine({
[mapRef, refreshVisibleAndMarkers, timeHours]
);
- return { status, debugStatus, visiblePosts, loadingPosts, loadError, handleIncomingPost, handlePostUpdate };
+ const handlePostDelete = useCallback(
+ (payload) => {
+ const postId = payload?.post_id || payload?.postId || payload?.id;
+ if (!postId) return;
+
+ const map = mapRef.current;
+ const overlay = map?.__swCenteredOverlay;
+ if (overlay && overlay.postId === postId) {
+ try { overlay.el?.remove?.(); } catch {}
+ map.__swCenteredOverlay = null;
+ }
+
+ allPostsRef.current = (allPostsRef.current || []).filter((p) => (p?.id || p?.ID) !== postId);
+ setVisiblePosts((current) => current.filter((p) => (p?.id || p?.ID) !== postId));
+
+ const markers = markersRef.current || [];
+ const nextMarkers = [];
+ for (const item of markers) {
+ if (!item || item.id !== postId) {
+ nextMarkers.push(item);
+ continue;
+ }
+ try { item.marker?.remove?.(); } catch {}
+ }
+ markersRef.current = nextMarkers;
+ },
+ [mapRef, markersRef]
+ );
+
+ return { status, debugStatus, visiblePosts, loadingPosts, loadError, handleIncomingPost, handlePostUpdate, handlePostDelete };
}
setThumbError(true)}
+ />
+ ) : (
+