feat(SW-498): added sitewide alert

components/SitewideAlert/index.tsx

@@ -0,0 +1,33 @@
+import { getSiteConfig } from "@/lib/trpc/memoizedRequests"
+
+import Alert from "../TempDesignSystem/Alert"
+
+import styles from "./sitewideAlert.module.css"
+
+export function preload() {
+  void getSiteConfig()
+}
+
+export default async function SitewideAlert() {
+  const siteConfig = await getSiteConfig()
+
+  if (!siteConfig?.sitewideAlert) {
+    return null
+  }
+
+  const { sitewideAlert } = siteConfig
+  return (
+    <div className={`${styles.sitewideAlert} ${styles[sitewideAlert.type]}`}>
+      <Alert
+        variant="banner"
+        type={sitewideAlert.type}
+        link={sitewideAlert.link}
+        phoneContact={sitewideAlert.phoneContact}
+        sidepeekCtaText={sitewideAlert.sidepeekButton?.cta_text}
+        sidepeekContent={sitewideAlert.sidepeekContent}
+        heading={sitewideAlert.heading}
+        text={sitewideAlert.text}
+      />
+    </div>
+  )
+}

components/SitewideAlert/sitewideAlert.module.css

@@ -0,0 +1,9 @@
+.sitewideAlert {
+  width: 100%;
+}
+
+.alarm {
+  position: sticky;
+  top: 0;
+  z-index: calc(var(--header-z-index) + 1);
+}