feat(SW-1907): Not rendering preamble when at least one filter is active on destination pages
Approved-by: Fredrik Thorsson Approved-by: Matilda Landström
This commit is contained in:
@@ -6,7 +6,6 @@ import { getDestinationCityPage } from "@/lib/trpc/memoizedRequests"
|
||||
|
||||
import Blocks from "@/components/Blocks"
|
||||
import Breadcrumbs from "@/components/Breadcrumbs"
|
||||
import Body from "@/components/TempDesignSystem/Text/Body"
|
||||
|
||||
import ExperienceList from "../ExperienceList"
|
||||
import HotelDataContainer, { preload } from "../HotelDataContainer"
|
||||
@@ -60,8 +59,7 @@ export default async function DestinationCityPage() {
|
||||
{blocks && <Blocks blocks={blocks} />}
|
||||
</main>
|
||||
<aside className={styles.sidebar}>
|
||||
<SidebarContentWrapper location={city.name}>
|
||||
<Body color="uiTextMediumContrast">{preamble}</Body>
|
||||
<SidebarContentWrapper location={city.name} preamble={preamble}>
|
||||
<ExperienceList experiences={experiences} />
|
||||
{has_sidepeek && sidepeek_content && (
|
||||
<DestinationPageSidePeek
|
||||
|
||||
@@ -5,7 +5,6 @@ import { getDestinationCountryPage } from "@/lib/trpc/memoizedRequests"
|
||||
import Blocks from "@/components/Blocks"
|
||||
import Breadcrumbs from "@/components/Breadcrumbs"
|
||||
import BreadcrumbsSkeleton from "@/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton"
|
||||
import Body from "@/components/TempDesignSystem/Text/Body"
|
||||
|
||||
import CityDataContainer, { preload } from "../CityDataContainer"
|
||||
import CityListing from "../CityListing"
|
||||
@@ -64,8 +63,10 @@ export default async function DestinationCountryPage() {
|
||||
{blocks && <Blocks blocks={blocks} />}
|
||||
</main>
|
||||
<aside className={styles.sidebar}>
|
||||
<SidebarContentWrapper location={translatedCountry}>
|
||||
<Body color="uiTextMediumContrast">{preamble}</Body>
|
||||
<SidebarContentWrapper
|
||||
location={translatedCountry}
|
||||
preamble={preamble}
|
||||
>
|
||||
<ExperienceList experiences={experiences} />
|
||||
{has_sidepeek && sidepeek_content && (
|
||||
<DestinationPageSidePeek
|
||||
|
||||
@@ -3,10 +3,11 @@
|
||||
import { useRef } from "react"
|
||||
import { useIntl } from "react-intl"
|
||||
|
||||
import { Typography } from "@scandic-hotels/design-system/Typography"
|
||||
|
||||
import { useDestinationDataStore } from "@/stores/destination-data"
|
||||
import { StickyElementNameEnum } from "@/stores/sticky-position"
|
||||
|
||||
import Title from "@/components/TempDesignSystem/Text/Title"
|
||||
import useStickyPosition from "@/hooks/useStickyPosition"
|
||||
|
||||
import { getHeadingText } from "../utils"
|
||||
@@ -15,10 +16,12 @@ import styles from "./sidebarContentWrapper.module.css"
|
||||
|
||||
interface SidebarContentWrapperProps extends React.PropsWithChildren {
|
||||
location: string
|
||||
preamble: string
|
||||
}
|
||||
|
||||
export default function SidebarContentWrapper({
|
||||
location,
|
||||
preamble,
|
||||
children,
|
||||
}: SidebarContentWrapperProps) {
|
||||
const intl = useIntl()
|
||||
@@ -34,9 +37,16 @@ export default function SidebarContentWrapper({
|
||||
|
||||
return (
|
||||
<div ref={sidebarRef} className={styles.sidebarContent}>
|
||||
<Title level="h1" as="h2">
|
||||
{getHeadingText(intl, location, allFilters, activeFilters[0])}
|
||||
</Title>
|
||||
<Typography variant="Title/md">
|
||||
<h1 className={styles.heading}>
|
||||
{getHeadingText(intl, location, allFilters, activeFilters[0])}
|
||||
</h1>
|
||||
</Typography>
|
||||
{!activeFilters.length && (
|
||||
<Typography variant="Body/Paragraph/mdRegular">
|
||||
<p className={styles.text}>{preamble}</p>
|
||||
</Typography>
|
||||
)}
|
||||
{children}
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -5,6 +5,13 @@
|
||||
padding: var(--Spacing-x4);
|
||||
}
|
||||
|
||||
.heading {
|
||||
color: var(--Text-Heading);
|
||||
}
|
||||
.text {
|
||||
color: var(--Text-Default);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1367px) {
|
||||
.sidebarContent {
|
||||
position: sticky;
|
||||
|
||||
Reference in New Issue
Block a user