feat(SW-552): close list on poi click

This commit is contained in:
Fredrik Thorsson
2024-10-17 15:49:59 +02:00
parent d8c26b32bd
commit 722e362c41

View File

@@ -1,6 +1,6 @@
"use client" "use client"
import { useState } from "react" import { useCallback, useState } from "react"
import { useIntl } from "react-intl" import { useIntl } from "react-intl"
import PoiMarker from "@/components/Maps/Markers/Poi" import PoiMarker from "@/components/Maps/Markers/Poi"
@@ -30,6 +30,14 @@ export default function Sidebar({
setIsFullScreenSidebar((prev) => !prev) setIsFullScreenSidebar((prev) => !prev)
} }
const handlePoiClick = useCallback(
(poiName: string) => {
onActivePoiChange(activePoi === poiName ? null : poiName)
toggleFullScreenSidebar()
},
[activePoi, onActivePoiChange]
)
return ( return (
<aside <aside
className={`${styles.sidebar} ${ className={`${styles.sidebar} ${
@@ -79,11 +87,7 @@ export default function Sidebar({
className={`${styles.poiButton} ${activePoi === poi.name ? styles.active : ""}`} className={`${styles.poiButton} ${activePoi === poi.name ? styles.active : ""}`}
onMouseEnter={() => onActivePoiChange(poi.name)} onMouseEnter={() => onActivePoiChange(poi.name)}
onMouseLeave={() => onActivePoiChange(null)} onMouseLeave={() => onActivePoiChange(null)}
onClick={() => onClick={() => handlePoiClick(poi.name)}
onActivePoiChange(
activePoi === poi.name ? null : poi.name
)
}
> >
<span>{poi.name}</span> <span>{poi.name}</span>
<span>{poi.distance} km</span> <span>{poi.distance} km</span>