crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-25 11:11:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

Locale switcher updates

Browse Source
This commit is contained in:
Henrik Larsson
2023-07-07 12:56:33 +02:00
parent 4327a10dc9
commit 5c2f3d5e3e
5 changed files with 92 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
app/[locale]/[[...slug]]/page.tsx
View File

@@ -15,6 +15,9 @@ import ProductPage from './product-page';
import ProductPagePreview from './product-page-preview';
import SinglePage from './single-page';
import SinglePagePreview from './single-page-preview';
// Chrome
import Footer from 'components/layout/footer';
import Header from 'components/layout/header';
/**
* Render pages depending on type.
@@ -30,24 +33,40 @@ export default async function Page({ params }: { params: { slug: string[]; local
const data = filterDataToSingleItem(pageData, isEnabled);
if (isEnabled) {
return (
<PreviewSuspense fallback="Loading...">
{docType === 'home' && <HomePagePreview query={query} queryParams={queryParams} />}
{docType === 'page' && <SinglePagePreview query={query} queryParams={queryParams} />}
{docType === 'product' && <ProductPagePreview query={query} queryParams={queryParams} />}
{docType === 'category' && <CategoryPagePreview query={query} queryParams={queryParams} />}
</PreviewSuspense>
);
}
const localeData = {
type: data._type,
locale: data.locale,
translations: data.translations
};
return (
<>
{docType === 'home' && <HomePage data={data} />}
{docType === 'product' && <ProductPage data={data} />}
{docType === 'category' && <CategoryPage data={data} />}
{docType === 'page' && <SinglePage data={data} />}
</>
<div className="flex flex-col">
<Header localeData={localeData} />
<main className="flex-1">
<article>
{isEnabled ? (
<PreviewSuspense fallback="Loading...">
{docType === 'home' && <HomePagePreview query={query} queryParams={queryParams} />}
{docType === 'page' && <SinglePagePreview query={query} queryParams={queryParams} />}
{docType === 'product' && (
<ProductPagePreview query={query} queryParams={queryParams} />
)}
{docType === 'category' && (
<CategoryPagePreview query={query} queryParams={queryParams} />
)}
</PreviewSuspense>
) : (
<>
{docType === 'home' && <HomePage data={data} />}
{docType === 'product' && <ProductPage data={data} />}
{docType === 'category' && <CategoryPage data={data} />}
{docType === 'page' && <SinglePage data={data} />}
</>
)}
</article>
</main>
<Footer />
</div>
);
}

18
app/[locale]/layout.tsx
View File

@@ -1,5 +1,3 @@
import Footer from 'components/layout/footer';
import Header from 'components/layout/header';
import { NextIntlClientProvider } from 'next-intl';
import { Inter } from 'next/font/google';
import { notFound } from 'next/navigation';
@@ -10,8 +8,6 @@ const SITE_NAME = 'KM Storefront';
const SITE_DESCRIPTION = 'Webb och digitalbyrå från Göteborg';
const TWITTER_CREATOR = '@kodamera.se';
const TWITTER_SITE = 'https://kodamera.se';
const OG_IMAGE_URL = '/og-image.jpg';
const OG_IMAGE_ALT = 'Kodamera';
export const metadata = {
title: {
@@ -19,16 +15,6 @@ export const metadata = {
template: `%s | ${SITE_NAME}`
},
description: SITE_DESCRIPTION,
openGraph: {
images: [
{
url: OG_IMAGE_URL,
width: 1200,
height: 630,
alt: OG_IMAGE_ALT
}
]
},
robots: {
follow: true,
index: true
@@ -73,9 +59,7 @@ export default async function LocaleLayout({ children, params: { locale } }: Loc
<html lang={locale} className={inter.variable}>
<body className="flex min-h-screen flex-col">
<NextIntlClientProvider locale={locale} messages={messages}>
<Header />
<main className="flex-1">{children}</main>
<Footer />
{children}
</NextIntlClientProvider>
</body>
</html>