feat(BOOK-116): Added better alt text to static map on hotel pages
Approved-by: Bianca Widstam
This commit is contained in:
@@ -8,11 +8,23 @@ import { calculateLatWithOffset } from "@/utils/map"
|
||||
|
||||
import styles from "./staticMap.module.css"
|
||||
|
||||
import type { StaticMapProps } from "@/types/components/hotelPage/map/staticMap"
|
||||
import type { MarkerInfo } from "@scandic-hotels/design-system/Map/types"
|
||||
import type { HotelAddress } from "@scandic-hotels/trpc/types/hotel"
|
||||
|
||||
import type { Coordinates } from "@/types/components/maps/coordinates"
|
||||
|
||||
type StaticMapProps = {
|
||||
coordinates: Coordinates
|
||||
hotelName: string
|
||||
address: HotelAddress
|
||||
zoomLevel?: number
|
||||
markerInfo: MarkerInfo
|
||||
}
|
||||
|
||||
export default async function StaticMap({
|
||||
coordinates,
|
||||
hotelName,
|
||||
address,
|
||||
markerInfo,
|
||||
zoomLevel = 14,
|
||||
}: StaticMapProps) {
|
||||
@@ -25,6 +37,7 @@ export default async function StaticMap({
|
||||
lat: calculateLatWithOffset(coordinates.lat, mapLatitudeInPx, zoomLevel),
|
||||
lng: coordinates.lng,
|
||||
}
|
||||
const addressString = `${address.streetAddress}, ${address.city}`
|
||||
|
||||
return (
|
||||
<div className={styles.staticMap}>
|
||||
@@ -35,10 +48,10 @@ export default async function StaticMap({
|
||||
zoomLevel={zoomLevel}
|
||||
altText={intl.formatMessage(
|
||||
{
|
||||
id: "hotel.staticMap.mapOfHotelName",
|
||||
defaultMessage: "Map of {hotelName}",
|
||||
id: "hotel.staticMap.mapOfHotelNameAndAddress",
|
||||
defaultMessage: "Map of {hotelName}, {address}",
|
||||
},
|
||||
{ hotelName }
|
||||
{ hotelName, address: addressString }
|
||||
)}
|
||||
mapId={mapId}
|
||||
/>
|
||||
|
||||
@@ -236,6 +236,7 @@ export default async function HotelPage({
|
||||
<StaticMap
|
||||
coordinates={coordinates}
|
||||
hotelName={name}
|
||||
address={address}
|
||||
markerInfo={{ hotelType: hotelType as HotelType, hotelId }} // TODO: Update hotel attributes schema instead
|
||||
/>
|
||||
</Link>
|
||||
|
||||
@@ -1,10 +0,0 @@
|
||||
import type { MarkerInfo } from "@scandic-hotels/design-system/Map/types"
|
||||
|
||||
import type { Coordinates } from "../../maps/coordinates"
|
||||
|
||||
export type StaticMapProps = {
|
||||
coordinates: Coordinates
|
||||
hotelName: string
|
||||
zoomLevel?: number
|
||||
markerInfo: MarkerInfo
|
||||
}
|
||||
Reference in New Issue
Block a user