Ghost markers — унификация стиля маркеров на карте

Контекст: Все маркеры мест на карте используют единый ghost-стиль (радиальный градиент, неинтерактивные). Различие только в интерактивности для авторизованных пользователей.

Суть

Ранее маркеры имели разный визуал для обычных и авторизованных пользователей, плюс была концепция «точек посетителей» (visitor dots), которые отображались отдельно.

После рефакторинга:

Все маркеры — жёлтый радиальный градиент (radial-gradient(circle, rgba(255,238,0,1) 0%, rgba(255,238,0,0) 75%))
Неавторизованные — interactive: false (не реагируют на hover/click)

Авторизованные — interactive: true (tooltip с названием, клик)

// frontend/src/lib/map.ts
const ghost = options?.ghost
const marker = L.marker([lat, lng], { icon, interactive: !ghost })

Что изменилось

b2d22a1 — удалена концепция visitor location с карты (WebSocket visitor dots больше не рендерятся)
4cb4eb6 — все маркеры используют единый ghost стиль
2377646 — ghost visual for all markers, keep interactive for auth users
39ee188 — исправлено обновление цвета маркера после логина

Файлы

frontend/src/lib/map.ts:19-31 — определение стиля маркера
frontend/src/lib/map.ts:99-101 — применение interactive в зависимости от ghost
frontend/src/components/MapView.tsx — логика показа ghost-маркеров

Связанные заметки

[[architecture-overview]] — общая архитектура
[[frontend-api-client]] — API клиент

Источник

Code review 2026-07-01, унификация UI/UX карты.

#frontend #leaflet #ui #ux #markers #refactoring

atomic-ghost-markers.md 2.2 KB История Исходник