From b841604e5eedae2a763af9e14fba3290357d5197 Mon Sep 17 00:00:00 2001 From: Fredrik Thorsson Date: Thu, 24 Oct 2024 15:08:23 +0200 Subject: [PATCH] feat(SW-281): refactor --- .../HotelListing/hotelListingTempData.json | 8 --- components/Blocks/HotelListing/index.tsx | 62 ----------------- .../HotelListing/hotelListing.module.css | 0 .../ContentPage/HotelListing/index.tsx | 66 +++++++++++++++++++ types/components/contentPage/hotelListing.ts | 9 +++ 5 files changed, 75 insertions(+), 70 deletions(-) delete mode 100644 components/Blocks/HotelListing/hotelListingTempData.json delete mode 100644 components/Blocks/HotelListing/index.tsx rename components/{Blocks => ContentType/ContentPage}/HotelListing/hotelListing.module.css (100%) create mode 100644 components/ContentType/ContentPage/HotelListing/index.tsx create mode 100644 types/components/contentPage/hotelListing.ts diff --git a/components/Blocks/HotelListing/hotelListingTempData.json b/components/Blocks/HotelListing/hotelListingTempData.json deleted file mode 100644 index 4b1bc0039..000000000 --- a/components/Blocks/HotelListing/hotelListingTempData.json +++ /dev/null @@ -1,8 +0,0 @@ -{ - "title": "Downtown Camper", - "image": "https://test3.scandichotels.com/imagevault/publishedmedia/ehdsd3e3ceoe4ezin6cs/downtown-camper-by-scandic-lobby-reception-desk-ch.jpg", - "adress": "Brunkebergstorg 9", - "distance": "0", - "description": "There is plenty of space for meetings, conferences and parties in our large, modern event room. We offer the ideal conditions for a grand function, good transport possibilities for the event guests, and rooms with large capacity.", - "button": "Book now" -} diff --git a/components/Blocks/HotelListing/index.tsx b/components/Blocks/HotelListing/index.tsx deleted file mode 100644 index 9149b817b..000000000 --- a/components/Blocks/HotelListing/index.tsx +++ /dev/null @@ -1,62 +0,0 @@ -import { ScandicLogoIcon } from "@/components/Icons" -import Image from "@/components/Image" -import Button from "@/components/TempDesignSystem/Button" -import Divider from "@/components/TempDesignSystem/Divider" -import Link from "@/components/TempDesignSystem/Link" -import Body from "@/components/TempDesignSystem/Text/Body" -import Caption from "@/components/TempDesignSystem/Text/Caption" -import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" -import { getIntl } from "@/i18n" - -import hotelListingTempData from "./hotelListingTempData.json" - -import styles from "./hotelListing.module.css" - -export default async function HotelListing() { - // TODO: Fetch and consume data from correct endpoint, when it is decided where the data shall come form. - const { adress, button, description, distance, title, image } = - hotelListingTempData - - const intl = await getIntl() - - return ( -
-
- -
-
-
- - {title} -
- {adress} -
- -
- - {`${distance} ${intl.formatMessage({ id: "km to city center" })}`} - -
-
- {description} - -
-
- ) -} diff --git a/components/Blocks/HotelListing/hotelListing.module.css b/components/ContentType/ContentPage/HotelListing/hotelListing.module.css similarity index 100% rename from components/Blocks/HotelListing/hotelListing.module.css rename to components/ContentType/ContentPage/HotelListing/hotelListing.module.css diff --git a/components/ContentType/ContentPage/HotelListing/index.tsx b/components/ContentType/ContentPage/HotelListing/index.tsx new file mode 100644 index 000000000..f206ba242 --- /dev/null +++ b/components/ContentType/ContentPage/HotelListing/index.tsx @@ -0,0 +1,66 @@ +import { ScandicLogoIcon } from "@/components/Icons" +import Image from "@/components/Image" +import Button from "@/components/TempDesignSystem/Button" +import Divider from "@/components/TempDesignSystem/Divider" +import Link from "@/components/TempDesignSystem/Link" +import Body from "@/components/TempDesignSystem/Text/Body" +import Caption from "@/components/TempDesignSystem/Text/Caption" +import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" +import { getIntl } from "@/i18n" + +import styles from "./hotelListing.module.css" + +import { HotelListingProps } from "@/types/components/contentPage/hotelListing" + +export default async function HotelListing({ + image, + name, + address, + distance, + description, +}: HotelListingProps) { + const intl = await getIntl() + + return ( +
  • +
    +
    + +
    +
    +
    + + {name} +
    + {address} +
    + +
    + + {`${distance} ${intl.formatMessage({ id: "km to city center" })}`} + +
    +
    + {description} + +
    +
    +
    • + ) +} diff --git a/types/components/contentPage/hotelListing.ts b/types/components/contentPage/hotelListing.ts new file mode 100644 index 000000000..2559137a4 --- /dev/null +++ b/types/components/contentPage/hotelListing.ts @@ -0,0 +1,9 @@ +import { Hotel } from "@/types/hotel" + +export type HotelListingProps = { + image: Hotel["hotelContent"]["images"]["imageSizes"]["large"] + name: Hotel["name"] + address: Hotel["address"]["streetAddress"] + distance: Hotel["location"]["distanceToCentre"] + description: Hotel["hotelContent"]["texts"]["descriptions"]["medium"] +}