import Subtitle from "@scandic-hotels/design-system/Subtitle"
import { JoinLoyaltyContactEnums } from "@scandic-hotels/trpc/types/joinLoyaltyContact"

import { getIntl } from "@/i18n"

import ContactRow from "./ContactRow"

import styles from "./contact.module.css"

import type { ContactProps } from "@/types/components/sidebar/joinLoyaltyContact"

export default async function Contact({ contactBlock }: ContactProps) {
  const intl = await getIntl()
  return (
    <article className={styles.contactContainer}>
      <Subtitle>
        {intl.formatMessage({
          defaultMessage: "Contact us",
        })}
      </Subtitle>
      <section className={styles.contact}>
        {contactBlock.map((contact, i) => {
          switch (contact.typename) {
            case JoinLoyaltyContactEnums.contact.Contact:
              return (
                <ContactRow
                  key={`${contact.display_text}-${i}`}
                  contact={contact}
                />
              )
            default:
              return null
          }
        })}
      </section>
    </article>
  )
}