scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in feat/SW-1430-cta-button (pull request #1290)

Browse Source 
Feat(SW-1430): Add header button on static pages

Approved-by: Erik Tiekstra
This commit is contained in:
Matilda Landström
2025-02-11 14:10:13 +00:00
parent 3d11cfb50a
commit f43ee4a0e6
8 changed files with 177 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
components/ContentType/StaticPages/index.tsx
View File

@@ -1,9 +1,11 @@
import Link from "next/link"
import { Suspense } from "react"
import Blocks from "@/components/Blocks"
import Hero from "@/components/Hero"
import Sidebar from "@/components/Sidebar"
import SidebarSkeleton from "@/components/Sidebar/SidebarSkeleton"
import Button from "@/components/TempDesignSystem/Button"
import LinkChips from "@/components/TempDesignSystem/LinkChips"
import Preamble from "@/components/TempDesignSystem/Text/Preamble"
import Title from "@/components/TempDesignSystem/Text/Title"
@@ -33,6 +35,19 @@ export default function StaticPage({
<Title as="h2">{header.heading}</Title>
<Preamble>{header.preamble}</Preamble>
</div>
{header.top_primary_button?.url ? (
<Button
size="medium"
intent="tertiary"
theme="base"
asChild
className={styles.button}
>
<Link href={header.top_primary_button.url}>
{header.top_primary_button.title}
</Link>
</Button>
) : null}
{header.navigation_links ? (
<LinkChips chips={header.navigation_links} />
) : null}

4
components/ContentType/StaticPages/staticPage.module.css
View File

@@ -58,6 +58,10 @@
grid-area: main;
}
.button {
width: fit-content;
}
@media (min-width: 768px) {
.contentContainer {
padding: var(--Spacing-x4) 0;

62
lib/graphql/Fragments/CollectionPage/TopPrimaryButton.graphql Normal file
View File

@@ -0,0 +1,62 @@
#import "../PageLink/AccountPageLink.graphql"
#import "../PageLink/CollectionPageLink.graphql"
#import "../PageLink/ContentPageLink.graphql"
#import "../PageLink/DestinationCityPageLink.graphql"
#import "../PageLink/DestinationCountryPageLink.graphql"
#import "../PageLink/DestinationOverviewPageLink.graphql"
#import "../PageLink/HotelPageLink.graphql"
#import "../PageLink/LoyaltyPageLink.graphql"
#import "../PageLink/StartPageLink.graphql"
#import "../AccountPage/Ref.graphql"
#import "../CollectionPage/Ref.graphql"
#import "../ContentPage/Ref.graphql"
#import "../DestinationCityPage/Ref.graphql"
#import "../DestinationCountryPage/Ref.graphql"
#import "../DestinationOverviewPage/Ref.graphql"
#import "../HotelPage/Ref.graphql"
#import "../LoyaltyPage/Ref.graphql"
#import "../StartPage/Ref.graphql"
fragment TopPrimaryButton_CollectionPage on CollectionPageHeader {
top_primary_button {
title
linkConnection {
edges {
node {
__typename
...AccountPageLink
...CollectionPageLink
...ContentPageLink
...DestinationCityPageLink
...DestinationCountryPageLink
...DestinationOverviewPageLink
...HotelPageLink
...LoyaltyPageLink
...StartPageLink
}
}
}
}
}
fragment TopPrimaryButtonRef_CollectionPage on CollectionPageHeader {
top_primary_button {
linkConnection {
edges {
node {
__typename
...AccountPageRef
...CollectionPageRef
...ContentPageRef
...DestinationCityPageRef
...DestinationCountryPageRef
...DestinationOverviewPageRef
...HotelPageRef
...LoyaltyPageRef
...StartPageRef
}
}
}
}
}

62
lib/graphql/Fragments/ContentPage/TopPrimaryButton.graphql Normal file
View File

@@ -0,0 +1,62 @@
#import "../PageLink/AccountPageLink.graphql"
#import "../PageLink/CollectionPageLink.graphql"
#import "../PageLink/ContentPageLink.graphql"
#import "../PageLink/DestinationCityPageLink.graphql"
#import "../PageLink/DestinationCountryPageLink.graphql"
#import "../PageLink/DestinationOverviewPageLink.graphql"
#import "../PageLink/HotelPageLink.graphql"
#import "../PageLink/LoyaltyPageLink.graphql"
#import "../PageLink/StartPageLink.graphql"
#import "../AccountPage/Ref.graphql"
#import "../CollectionPage/Ref.graphql"
#import "../ContentPage/Ref.graphql"
#import "../DestinationCityPage/Ref.graphql"
#import "../DestinationCountryPage/Ref.graphql"
#import "../DestinationOverviewPage/Ref.graphql"
#import "../HotelPage/Ref.graphql"
#import "../LoyaltyPage/Ref.graphql"
#import "../StartPage/Ref.graphql"
fragment TopPrimaryButton_ContentPage on ContentPageHeader {
top_primary_button {
title
linkConnection {
edges {
node {
__typename
...AccountPageLink
...CollectionPageLink
...ContentPageLink
...DestinationCityPageLink
...DestinationCountryPageLink
...DestinationOverviewPageLink
...HotelPageLink
...LoyaltyPageLink
...StartPageLink
}
}
}
}
}
fragment TopPrimaryButtonRef_ContentPage on ContentPageHeader {
top_primary_button {
linkConnection {
edges {
node {
__typename
...AccountPageRef
...CollectionPageRef
...ContentPageRef
...DestinationCityPageRef
...DestinationCountryPageRef
...DestinationOverviewPageRef
...HotelPageRef
...LoyaltyPageRef
...StartPageRef
}
}
}
}
}

3
lib/graphql/Query/CollectionPage/CollectionPage.graphql
View File

@@ -6,6 +6,7 @@
#import "../../Fragments/Blocks/UspGrid.graphql"
#import "../../Fragments/CollectionPage/NavigationLinks.graphql"
#import "../../Fragments/CollectionPage/TopPrimaryButton.graphql"
query GetCollectionPage($locale: String!, $uid: String!) {
collection_page(uid: $uid, locale: $locale) {
@@ -14,6 +15,7 @@ query GetCollectionPage($locale: String!, $uid: String!) {
header {
heading
preamble
...TopPrimaryButton_CollectionPage
...NavigationLinks_CollectionPage
}
blocks {
@@ -37,6 +39,7 @@ query GetCollectionPage($locale: String!, $uid: String!) {
query GetCollectionPageRefs($locale: String!, $uid: String!) {
collection_page(locale: $locale, uid: $uid) {
header {
...TopPrimaryButtonRef_CollectionPage
...NavigationLinksRef_CollectionPage
}
blocks {

3
lib/graphql/Query/ContentPage/ContentPage.graphql
View File

@@ -10,6 +10,7 @@
#import "../../Fragments/Blocks/TextCols.graphql"
#import "../../Fragments/Blocks/UspGrid.graphql"
#import "../../Fragments/ContentPage/NavigationLinks.graphql"
#import "../../Fragments/ContentPage/TopPrimaryButton.graphql"
#import "../../Fragments/Sidebar/Content.graphql"
#import "../../Fragments/Sidebar/DynamicContent.graphql"
@@ -25,6 +26,7 @@ query GetContentPage($locale: String!, $uid: String!) {
header {
heading
preamble
...TopPrimaryButton_ContentPage
...NavigationLinks_ContentPage
}
blocks {
@@ -79,6 +81,7 @@ query GetContentPageRefs($locale: String!, $uid: String!) {
content_page(locale: $locale, uid: $uid) {
header {
...NavigationLinksRef_ContentPage
...TopPrimaryButtonRef_ContentPage
}
sidebar {
__typename

14
server/routers/contentstack/collectionPage/output.ts
View File

@@ -74,6 +74,18 @@ const navigationLinksSchema = z
}))
})
const topPrimaryButtonSchema = linkAndTitleSchema
.nullable()
.transform((data) => {
if (!data?.link) {
return null
}
return {
url: data.link.url,
title: data.title || data.link.title || null,
}
})
// Content Page Schema and types
export const collectionPageSchema = z.object({
collection_page: z.object({
@@ -83,6 +95,7 @@ export const collectionPageSchema = z.object({
header: z.object({
heading: z.string(),
preamble: z.string(),
top_primary_button: topPrimaryButtonSchema,
navigation_links: navigationLinksSchema,
}),
system: systemSchema.merge(
@@ -133,6 +146,7 @@ const collectionPageBlockRefsItem = z.discriminatedUnion("__typename", [
const collectionPageHeaderRefs = z.object({
navigation_links: z.array(linkConnectionRefs),
top_primary_button: linkConnectionRefs.nullable(),
})
export const collectionPageRefsSchema = z.object({

14
server/routers/contentstack/contentPage/output.ts
View File

@@ -186,6 +186,18 @@ const navigationLinksSchema = z
}))
})
const topPrimaryButtonSchema = linkAndTitleSchema
.nullable()
.transform((data) => {
if (!data?.link) {
return null
}
return {
url: data.link.url,
title: data.title || data.link.title || null,
}
})
// Content Page Schema and types
export const contentPageSchema = z.object({
content_page: z.object({
@@ -196,6 +208,7 @@ export const contentPageSchema = z.object({
header: z.object({
heading: z.string(),
preamble: z.string(),
top_primary_button: topPrimaryButtonSchema,
navigation_links: navigationLinksSchema,
}),
system: systemSchema.merge(
@@ -305,6 +318,7 @@ const contentPageSidebarRefsItem = z.discriminatedUnion("__typename", [
const contentPageHeaderRefs = z.object({
navigation_links: z.array(linkConnectionRefs),
top_primary_button: linkConnectionRefs.nullable(),
})
export const contentPageRefsSchema = z.object({