Added suspense and restructured layout AND pages

This commit is contained in:
Henrik Larsson
2023-08-09 14:19:27 +02:00
parent 5524d91da4
commit a16807c8d8
10 changed files with 30 additions and 149 deletions

View File

@@ -3,6 +3,7 @@ import { pageQuery } from 'lib/sanity/queries';
import { clientFetch } from 'lib/sanity/sanity.client';
import type { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { Suspense } from 'react';
export const runtime = 'edge';
@@ -73,5 +74,12 @@ export default async function Page({ params }: PageParams) {
if (!page) return notFound();
return <DynamicContentManager content={page?.content} />;
return (
<>
<DynamicContentManager content={page?.content} />
<Suspense>
<Footer locale={params.locale} />
</Suspense>
</>
);
}

View File

@@ -1,8 +1,10 @@
import Footer from '@/components/layout/footer/footer';
import Text from 'components/ui/text/text';
import { categoryQuery } from 'lib/sanity/queries';
import { clientFetch } from 'lib/sanity/sanity.client';
import { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { Suspense } from 'react';
export async function generateMetadata({
params
@@ -36,6 +38,9 @@ export default async function ProductPage({ params }: CategoryPageParams) {
return (
<div className="mb-8 flex w-full flex-col px-4 lg:my-16 lg:px-8 2xl:px-16">
<Text variant={'pageHeading'}>{title}</Text>
<Suspense>
<Footer locale={params.locale} />
</Suspense>
</div>
);
}

View File

@@ -1,9 +1,8 @@
import Footer from 'components/layout/footer/footer';
import Header from 'components/layout/header/header';
import { NextIntlClientProvider } from 'next-intl';
import { Inter } from 'next/font/google';
import { notFound } from 'next/navigation';
import { ReactNode } from 'react';
import { ReactNode, Suspense } from 'react';
import { supportedLanguages } from '../../i18n-config';
import './globals.css';
@@ -58,9 +57,9 @@ export default async function LocaleLayout({ children, params: { locale } }: Loc
<body className="flex min-h-screen flex-col">
<NextIntlClientProvider locale={locale} messages={messages}>
<Header locale={locale} />
<main className="flex-1">{children}</main>
{/* @ts-expect-error Server Component (https://github.com/vercel/next.js/issues/42292) */}
<Footer locale={locale} />
<Suspense>
<main className="flex-1">{children}</main>
</Suspense>
</NextIntlClientProvider>
</body>
</html>

View File

@@ -1,8 +1,10 @@
import Footer from '@/components/layout/footer/footer';
import DynamicContentManager from 'components/layout/dynamic-content-manager/dynamic-content-manager';
import { homePageQuery } from 'lib/sanity/queries';
import { clientFetch } from 'lib/sanity/sanity.client';
import { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { Suspense } from 'react';
export const runtime = 'edge';
export async function generateMetadata({
@@ -32,6 +34,9 @@ export default async function HomePage({ params }: HomePageParams) {
return (
<>
<DynamicContentManager content={data?.content} />
<Suspense>
<Footer locale={params.locale} />
</Suspense>
</>
);
}

View File

@@ -1,8 +1,10 @@
import Footer from '@/components/layout/footer/footer';
import ProductView from 'components/product/product-view';
import { productQuery } from 'lib/sanity/queries';
import { clientFetch } from 'lib/sanity/sanity.client';
import type { Metadata } from 'next';
import { notFound } from 'next/navigation';
import { Suspense } from 'react';
interface ProductPageParams {
params: {
@@ -83,7 +85,10 @@ export default async function ProductPage({ params }: ProductPageParams) {
__html: JSON.stringify(productJsonLd)
}}
/>
<ProductView product={product} relatedProducts={[]} />;
<ProductView product={product} relatedProducts={[]} />
<Suspense>
<Footer locale={params.locale} />
</Suspense>
</>
);
}