Files
web/components/Current/Aside/Contacts/Contact.tsx
Michael Zetterberg 14e93eba7c chore: lint fix
2024-04-23 14:43:17 +02:00

91 lines
2.7 KiB
TypeScript

import { Lang } from "@/constants/languages"
import styles from "./contact.module.css"
import { type ContactNode, Section } from "@/types/requests/asides/contact"
export default function Contact({ sections, system: { locale } }: ContactNode) {
if (!sections.length) {
return null
}
const visitingAddressMessage = getVisitingAddressMessage(locale)
return (
<section>
{sections.map((section) => {
switch (section.__typename) {
case Section.ContactBlockSectionsExtraInfo:
return <p>{section.extra_info.text}</p>
case Section.ContactBlockSectionsMailingAddress:
return (
<p>
{section.mailing_address.name}
<br />
{section.mailing_address.street}
<br />
{section.mailing_address.zip} {section.mailing_address.city}
<br />
{section.mailing_address.country}
</p>
)
case Section.ContactBlockSectionsPhone:
return (
<div className={styles.highlightBlock}>
<h3>{section.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={`tel:+${section.phone.number}`}
itemProp="telephone"
className={styles.phoneNumberLink}
>
+{section.phone.number}
</a>
</div>
</div>
)
case Section.ContactBlockSectionsTitle:
return <h2 className={styles.heading}>{section.title.text}</h2>
case Section.ContactBlockSectionsVisitingAddress:
return (
<p>
{visitingAddressMessage}: {section.visiting_address.street}{" "}
</p>
)
default:
return null
}
})}
</section>
)
}
function getVisitingAddressMessage(lang: Lang) {
switch (lang) {
case Lang.sv:
return "Besöksadress"
case Lang.en:
return "Visiting address"
case Lang.da:
return "Besøgsadresse"
case Lang.de:
return "Besuchsadresse"
case Lang.fi:
return "Vierailuosoite"
case Lang.no:
return "Besøksadresse"
default:
return ""
}
}