feat: add language switcher parallel route

This commit is contained in:
Christel Westerberg
2024-05-27 16:42:13 +02:00
parent dd930688fc
commit a83bdb21fe
11 changed files with 194 additions and 5 deletions

View File

@@ -0,0 +1 @@
export { default } from "../page"

View File

@@ -0,0 +1,17 @@
.desktop {
display: none;
}
.mobile {
display: block;
}
@media (min-width: 950px) {
.desktop {
display: block;
}
.mobile {
display: none;
}
}

View File

@@ -0,0 +1,54 @@
import { batchRequest } from "@/lib/graphql/batchRequest"
import {
GetDaDeEnUrls,
GetFiNoSvUrls,
} from "@/lib/graphql/Query/LanguageSwitcherCurrent.graphql"
import Desktop from "@/components/Current/Header/LanguageSwitcher/Desktop"
import Mobile from "@/components/Current/Header/LanguageSwitcher/Mobile"
import styles from "./page.module.css"
import { LangParams, PageArgs } from "@/types/params"
import { LanguageSwitcherData } from "@/types/requests/languageSwitcher"
export default async function LanguageSwitcher({
params,
searchParams,
}: PageArgs<
LangParams,
{
uid: string
uri: string
}
>) {
if (!searchParams.uid) {
return null
}
const variables = {
uid: searchParams.uid,
}
const { data: urls } = await batchRequest<LanguageSwitcherData>([
{
document: GetDaDeEnUrls,
variables,
},
{
document: GetFiNoSvUrls,
variables,
},
])
return (
<>
<section className={styles.desktop}>
<Desktop currentLanguage={params.lang} urls={urls} />
</section>
<section className={styles.mobile}>
<Mobile currentLanguage={params.lang} urls={urls} />
</section>
</>
)
}

View File

@@ -60,7 +60,6 @@ export default async function CurrentContentPage({
return (
<>
<Header lang={params.lang} />
<ContentPage data={response.data} />
<Tracking pageData={trackingData} />
</>

View File

@@ -22,7 +22,10 @@ export const metadata: Metadata = {
export default function RootLayout({
children,
params,
}: React.PropsWithChildren<LayoutArgs<LangParams>>) {
languageSwitcher,
}: React.PropsWithChildren<
LayoutArgs<LangParams> & { languageSwitcher: React.ReactNode }
>) {
return (
<html lang={params.lang}>
<head>
@@ -76,7 +79,7 @@ export default function RootLayout({
<body className="theme-00Corecolours theme-X0Oldcorecolours">
<LangPopup lang={params.lang} />
<SkipToMainContent lang={params.lang} />
<Header lang={params.lang} />
<Header lang={params.lang} languageSwitcher={languageSwitcher} />
{children}
<Footer lang={params.lang} />
<Script id="page-tracking">{`