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

import { langEnum } from "@/types/lang"
import type { Lang } from "@/types/lang"
import type { ContactNode } from "@/types/requests/asides/contact"

export default function Contact({
  title,
  mailing_address,
  visiting_address,
  phone,
  system: { locale },
}: ContactNode) {
  const visitingAddressMessage = getVisitingAddressMessage(locale)
  return (
    <div>
      <div>
        <div>
          <div>
            <h2 className={styles.heading}>{title}</h2>
            <p>
              {mailing_address.name}
              <br />
              {mailing_address.street}
              <br />
              {mailing_address.zip} {mailing_address.city}
              <br />
              {mailing_address.country}
            </p>
            <p>
              {visitingAddressMessage}: {visiting_address.street}{" "}
            </p>
          </div>
        </div>
        <div>
          <div className={styles.highlightBlock}>
            <h3>{phone.title}</h3>
            <div className={styles.phoneContainer}>
              <svg
                focusable="false"
                className={styles.phoneIcon}
                viewBox="0 0 32 32"
              >
                <use
                  xmlnsXlink="http://www.w3.org/1999/xlink"
                  xlinkHref="/_static/img/icons/sprites.svg#icon-phone"
                ></use>
              </svg>

              <a
                href={phone.number}
                itemProp="telephone"
                className={styles.phoneNumberLink}
              >
                {phone.number}
              </a>
            </div>
          </div>
        </div>
      </div>
    </div>
  )
}

function getVisitingAddressMessage(lang: Lang) {
  switch (lang) {
    case langEnum.sv:
      return "Besöksadress"
    case langEnum.en:
      return "Visiting address"
    case langEnum.da:
      return "Besøgsadresse"
    case langEnum.de:
      return "Besuchsadresse"
    case langEnum.fi:
      return "Vierailuosoite"
    case langEnum.no:
      return "Besøksadresse"
    default:
      return ""
  }
}
