846fd904a6
feat(SW-2859): Create trpc package * Add isEdge, safeTry and dataCache to new common package * Add eslint and move prettier config * Clean up tests * Create trpc package and move initialization * Move errors and a few procedures * Move telemetry to common package * Move tokenManager to common package * Add Sentry to procedures * Clean up procedures * Fix self-referencing imports * Add exports to packages and lint rule to prevent relative imports * Add env to trpc package * Add eslint to trpc package * Apply lint rules * Use direct imports from trpc package * Add lint-staged config to trpc * Move lang enum to common * Restructure trpc package folder structure * Fix lang imports Approved-by: Linus Flood
100 lines
3.0 KiB
TypeScript
100 lines
3.0 KiB
TypeScript
/* eslint-disable formatjs/no-literal-string-in-jsx */
|
|
|
|
import { Lang } from "@scandic-hotels/common/constants/language"
|
|
|
|
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, idx) => {
|
|
switch (section.__typename) {
|
|
case Section.ContactBlockSectionsExtraInfo:
|
|
return <p>{section.extra_info.text}</p>
|
|
case Section.ContactBlockSectionsMailingAddress:
|
|
return (
|
|
<p key={`section-mail-${idx}`}>
|
|
{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}
|
|
key={`section-phone-${idx}`}
|
|
>
|
|
<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} key={`section-heading-${idx}`}>
|
|
{section.title.text}
|
|
</h2>
|
|
)
|
|
case Section.ContactBlockSectionsVisitingAddress:
|
|
return (
|
|
<p key={`section-visiting-address-${idx}`}>
|
|
{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 ""
|
|
}
|
|
}
|