fix(SW-3203): Added property id to pointOfInterestSchema to handle identical names

Approved-by: Matilda Landström
Approved-by: Chuma Mcphoy (We Ahead)
This commit is contained in:
Erik Tiekstra
2025-08-26 05:58:25 +00:00
parent 091c46f85c
commit 8180271b0f
4 changed files with 29 additions and 34 deletions

View File

@@ -31,8 +31,8 @@ export default function PoiMapMarkers({
}: PoiMapMarkersProps) {
const intl = useIntl()
function toggleActivePoi(poiName: string) {
onActivePoiChange?.(activePoi === poiName ? null : poiName)
function toggleActivePoi(poiId: string) {
onActivePoiChange?.(activePoi === poiId ? null : poiId)
}
return (
<>
@@ -45,22 +45,22 @@ export default function PoiMapMarkers({
{pointsOfInterest.map((poi) => (
<AdvancedMarker
key={poi.name + poi.categoryName}
key={poi.id}
className={styles.advancedMarker}
position={poi.coordinates}
anchorPoint={AdvancedMarkerAnchorPoint.CENTER}
zIndex={activePoi === poi.name ? 2 : 0}
onMouseEnter={() => onActivePoiChange?.(poi.name ?? null)}
zIndex={activePoi === poi.id ? 2 : 0}
onMouseEnter={() => onActivePoiChange?.(poi.id ?? null)}
onMouseLeave={() => onActivePoiChange?.(null)}
onClick={() => toggleActivePoi(poi.name ?? '')}
onClick={() => toggleActivePoi(poi.id ?? '')}
>
<span
className={`${styles.poi} ${activePoi === poi.name ? styles.active : ''}`}
className={`${styles.poi} ${activePoi === poi.id ? styles.active : ''}`}
>
<PoiMarker
group={poi.group}
categoryName={poi.categoryName}
size={activePoi === poi.name ? 'large' : 'small'}
size={activePoi === poi.id ? 'large' : 'small'}
/>
<span className={styles.poiLabel}>
<Typography variant="Body/Paragraph/mdRegular">

View File

@@ -16,6 +16,7 @@ export const pointOfInterestSchema = z
name: nullableStringValidator,
})
.transform((poi) => ({
id: `${poi.name}-${poi.location.latitude}-${poi.location.longitude}`,
categoryName: poi.category.name,
coordinates: {
lat: poi.location.latitude,