feat(SW-1012): format opening hours

2024-12-11 13:35:31 +01:00
parent c47523df96
commit abebfb1feb
8 changed files with 109 additions and 22 deletions
--- a/components/ContentType/HotelPage/SidePeeks/RestaurantBar/OpeningHours/index.tsx
+++ b/components/ContentType/HotelPage/SidePeeks/RestaurantBar/OpeningHours/index.tsx
@@ -1,37 +1,66 @@
 import Body from "@/components/TempDesignSystem/Text/Body"
+import { getIntl } from "@/i18n"

-import { RestaurantBarOpeningHoursProps } from "@/types/components/hotelPage/sidepeek/restaurantBar"
-import { RestaurantOpeningHoursDay } from "@/types/hotel"
+import {
+  Days,
+  type RestaurantBarOpeningHoursProps,
+} from "@/types/components/hotelPage/sidepeek/restaurantBar"
+import type { RestaurantOpeningHoursDay } from "@/types/hotel"

-export default function OpeningHours({
+export default async function OpeningHours({
  openingHours,
-  alternateOpeningHours,
 }: RestaurantBarOpeningHoursProps) {
+  const intl = await getIntl()
+
+  const closed = intl.formatMessage({ id: "Closed" })
+  const alwaysOpen = intl.formatMessage({ id: "Always open" })
+
  const days: (keyof typeof openingHours)[] = [
-    "monday",
-    "tuesday",
-    "wednesday",
-    "thursday",
-    "friday",
-    "saturday",
-    "sunday",
+    Days.Monday,
+    Days.Tuesday,
+    Days.Wednesday,
+    Days.Thursday,
+    Days.Friday,
+    Days.Saturday,
+    Days.Sunday,
  ]

+  function dayInterval(days: string[]) {
+    if (days.length === 1) return days[0]
+    return `${days[0]}-${days[days.length - 1]}`
+  }
+  const groups: { [key: string]: string[] } = {}
+
+  days.forEach((day) => {
+    const today = openingHours[day] as RestaurantOpeningHoursDay
+    let key: string
+
+    if (today.isClosed) {
+      key = closed
+    } else if (today.alwaysOpen) {
+      key = alwaysOpen
+    } else {
+      key = `${today.openingTime}-${today.closingTime}`
+    }
+
+    if (!groups[key]) {
+      groups[key] = []
+    }
+    const formattedDay = day.charAt(0).toUpperCase() + day.slice(1)
+    groups[key].push(intl.formatMessage({ id: formattedDay }))
+  })
+
+  console.log("Loooooop", groups)
+
  return (
    <div>
      <Body textTransform="bold">{openingHours.name}</Body>
-      {days.map((day) => {
-        const today = openingHours[day] as RestaurantOpeningHoursDay
-        return today ? (
-          <Body color="uiTextHighContrast">
-            {day}:{" "}
-            {today.isClosed
-              ? "Closed"
-              : today.alwaysOpen
-                ? "Always open"
-                : `${today.openingTime}-${today.closingTime}`}
+      {Object.entries(groups).map(([time, days]) => {
+        return (
+          <Body color="uiTextHighContrast" key={time}>
+            {`${dayInterval(days)}: ${time}`}
          </Body>
-        ) : null
+        )
      })}
    </div>
  )