scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(SW-325): added additional poi groups

Browse Source
This commit is contained in:
Erik Tiekstra
2024-09-26 15:20:22 +02:00
parent 947ceb1736
commit fe607f640c
17 changed files with 254 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
components/ContentType/HotelPage/Map/DynamicMap/Map/index.tsx
View File

@@ -80,7 +80,8 @@ export default function MapContent({
className={`${styles.poi} ${activePoi === poi.name ? styles.active : ""}`}
>
<PoiMarker
category={poi.category}
group={poi.group}
categoryName={poi.categoryName}
className={styles.poiMarker}
size={activePoi === poi.name ? 20 : 16}
/>

18
components/ContentType/HotelPage/Map/DynamicMap/Sidebar/index.tsx
View File

@@ -20,12 +20,10 @@ export default function Sidebar({
}: SidebarProps) {
const intl = useIntl()
const [isFullScreenSidebar, setIsFullScreenSidebar] = useState(false)
const poiCategories = new Set(
pointsOfInterest.map(({ category }) => category)
)
const poisInCategories = Array.from(poiCategories).map((category) => ({
category,
pois: pointsOfInterest.filter((poi) => poi.category === category),
const poiGroups = new Set(pointsOfInterest.map(({ group }) => group))
const poisInGroups = Array.from(poiGroups).map((group) => ({
group,
pois: pointsOfInterest.filter((poi) => poi.group === group),
}))
function toggleFullScreenSidebar() {
@@ -60,9 +58,9 @@ export default function Sidebar({
)}
</Title>
{poisInCategories.map(({ category, pois }) =>
{poisInGroups.map(({ group, pois }) =>
pois.length ? (
<div key={category} className={styles.poiGroup}>
<div key={group} className={styles.poiGroup}>
<Body
color="black"
textTransform="bold"
@@ -70,8 +68,8 @@ export default function Sidebar({
asChild
>
<h3>
<PoiMarker category={category} />
{intl.formatMessage({ id: category })}
<PoiMarker group={group} />
{intl.formatMessage({ id: group })}
</h3>
</Body>
<ul className={styles.poiList}>

7
components/ContentType/HotelPage/Map/MapCard/index.tsx
View File

@@ -39,7 +39,12 @@ export default function MapCard({ hotelName, pois }: MapCardProps) {
<ul className={styles.poiList}>
{pois.map((poi) => (
<li key={poi.name} className={styles.poiItem}>
<PoiMarker category={poi.category} skipBackground size={20} />
<PoiMarker
group={poi.group}
categoryName={poi.categoryName}
skipBackground
size={20}
/>
<Body color="black">{poi.name}</Body>
<Caption>{poi.distance} km</Caption>
</li>