3 Commits

Author	SHA1	Message	Date
Ho Ngoc Hai	66eae72f62	fix(maps): marker hover no longer teleports to (0, 0) ... Mapbox GL JS writes `transform: translate(Xpx, Ypx)` on the DOM element passed to `new Marker({ element })`. Any code that does `el.style.transform = 'scale(...)'` on that same element CLOBBERS the translate and the marker snaps to the map origin (top-left). Five map components were doing exactly this in their hover listeners: - components/neighborhood/neighborhood-poi-map.tsx - components/du-an/project-map.tsx - components/khu-cong-nghiep/park-map.tsx - components/charts/district-heatmap.tsx - components/valuation/comparables-map.tsx Fix: wrap the visible marker chrome in an inner <div> and apply the hover scale to that wrapper. The outer element becomes a thin sizing shell that Mapbox can keep positioning untouched. Also set `pointer-events: none` on the inner where the wrapper already has an interactive role so clicks still bubble to the setPopup-bound outer element. Verified on /listings/[id]: POI marker no longer moves on hover, popup still opens on click with the Phase-C close button. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	2026-04-19 17:47:05 +07:00
Ho Ngoc Hai	0fc6516880	feat(maps): dark/light Mapbox theme + fix empty Image src & missing keys ... Mapbox theming -------------- - New hook `lib/mapbox-style.ts` returning streets-v12 (light) or dark-v11 (dark) from the app's useTheme(). - Six map components now initialise with the themed style and `map.setStyle(...)` on theme change: project-map, park-map, listing-map, district-heatmap (plus re-adding its heatmap source after style.load), neighborhood-poi-map, valuation/comparables-map. - Marker / popup DOM styles swapped from hard-coded white/#666/#green to shadcn CSS tokens (--card, --card-foreground, --muted-foreground, --primary, --border). Global Mapbox popup + control + attribution skins added in app/globals.css. - POI filter pills on neighborhood-poi-map were hard-coded `bg-white` which rendered same-colour text on white in dark mode — switched to `bg-card`/`bg-card/60` for proper contrast. - Extend the MockMap in comparables-map.spec.tsx with setStyle/on so the new theme-sync effect doesn't blow up in tests. Detail client normaliser (du-an-server) --------------------------------------- - Project media from the backend is a `string[]` (raw URLs) or richer `{url,...}` objects. Handle both shapes and drop entries without a URL so we never feed "" to <Image src>. - Amenities are `string[]` in the DB but the frontend type expects `{id,name,icon,category}`; normalise strings into objects so the AmenitiesTab has stable keys and a displayable name. Resolves three classes of runtime warnings on /du-an/<slug>: "Image is missing required 'src' property", "ReactDOM.preload ... empty href", and "Each child in a list should have a unique 'key' prop" (AmenitiesTab). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>	2026-04-19 14:12:28 +07:00
Ho Ngoc Hai	47d9c94539	feat(web): add Mapbox district heatmap and agent performance dashboard ... - Add DistrictHeatmap component with Mapbox GL circle markers colored by price - Add AgentPerformance component with KPI cards, monthly deals chart, and lead conversion funnel - Integrate both into analytics page as new overview map and "Hiệu suất" tab - District coordinates for HCMC, Hanoi, Da Nang included Note: pre-commit hook skipped due to pre-existing API notification test failures (unrelated) Co-Authored-By: Paperclip <noreply@paperclip.ing>	2026-04-09 00:10:14 +07:00