cleanup

2025-07-25 11:11:24 +00:00 · 2023-11-12 17:11:15 +09:00
parent 1575bb6ccf
commit 6374869de8
40 changed files with 191 additions and 223 deletions
--- a/app/[locale]/about/page.tsx
+++ b/app/[locale]/about/page.tsx
@@ -5,6 +5,7 @@ import Navbar from 'components/layout/navbar';
 import { getCart, getPage, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';
 import AboutNaraiDetail from './about-narai-detail';

 const { SITE_NAME } = process.env;
@@ -35,9 +36,11 @@ export default async function Page({ params }: { params: { locale?: SupportedLoc
  return (
    <div>
      <Navbar cart={cart} locale={params?.locale} compact promotedItem={promotedItem} />
-      <div className="pt-24 md:pt-32">
-        <AboutNaraiDetail awards={awardsPage.body} />
-      </div>
+      <Suspense fallback={null}>
+        <div className="pt-24 md:pt-32">
+          <AboutNaraiDetail awards={awardsPage.body} />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>
--- a/app/[locale]/bar/page.tsx
+++ b/app/[locale]/bar/page.tsx
@@ -5,6 +5,7 @@ import Navbar from 'components/layout/navbar';
 import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';
 import SagyobarDetail from './sagyobar-detail';

 const { SITE_NAME } = process.env;
@@ -33,9 +34,11 @@ export default async function Page({ params }: { params: { locale?: SupportedLoc
  return (
    <div>
      <Navbar cart={cart} locale={params?.locale} compact promotedItem={promotedItem} />
-      <div className="pt-12">
-        <SagyobarDetail />
-      </div>
+      <Suspense fallback={null}>
+        <div className="pt-12">
+          <SagyobarDetail />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>
--- a/app/[locale]/company/page.tsx
+++ b/app/[locale]/company/page.tsx
@@ -5,6 +5,7 @@ import Navbar from 'components/layout/navbar';
 import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';
 import CompanyDetail from './company-detail';

 const { SITE_NAME } = process.env;
@@ -33,9 +34,11 @@ export default async function Page({ params }: { params: { locale?: SupportedLoc
  return (
    <div>
      <Navbar cart={cart} locale={params?.locale} compact promotedItem={promotedItem} />
-      <div className="pt-12">
-        <CompanyDetail />
-      </div>
+      <Suspense fallback={null}>
+        <div className="pt-12">
+          <CompanyDetail />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>
--- a/app/[locale]/concept/page.tsx
+++ b/app/[locale]/concept/page.tsx
@@ -5,6 +5,7 @@ import Navbar from 'components/layout/navbar';
 import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';
 import ConceptDetail from './concept-detail';

 const { SITE_NAME } = process.env;
@@ -33,9 +34,11 @@ export default async function Page({ params }: { params: { locale?: SupportedLoc
  return (
    <div>
      <Navbar cart={cart} locale={params?.locale} compact promotedItem={promotedItem} />
-      <div className="pt-12">
-        <ConceptDetail />
-      </div>
+      <Suspense fallback={null}>
+        <div className="pt-12">
+          <ConceptDetail />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>
--- a/app/[locale]/disclosures/page.tsx
+++ b/app/[locale]/disclosures/page.tsx
@@ -5,6 +5,7 @@ import Navbar from 'components/layout/navbar';
 import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';
 import Disclosures from './disclosures';

 const { SITE_NAME } = process.env;
@@ -37,9 +38,11 @@ export default async function DisclosuresPage({
  return (
    <div>
      <Navbar cart={cart} locale={locale} compact promotedItem={promotedItem} />
-      <div className="py-24 md:py-48">
-        <Disclosures />
-      </div>
+      <Suspense fallback={null}>
+        <div className="py-24 md:py-48">
+          <Disclosures />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>
--- a/app/[locale]/layout.tsx
+++ b/app/[locale]/layout.tsx
@@ -1,10 +1,9 @@
 import { Lato, Noto_Serif_JP } from 'next/font/google';
 import localFont from 'next/font/local';
-import { ReactNode } from 'react';
+import { ReactNode, Suspense } from 'react';

 import { SupportedLocale } from 'components/layout/navbar/language-control';
 import { NextIntlClientProvider } from 'next-intl';
-import { notFound } from 'next/navigation';
 import Analytics from './analytics';
 import './globals.css';

@@ -81,12 +80,7 @@ export default async function RootLayout({
  children: ReactNode;
  params: { locale?: SupportedLocale };
 }) {
-  let messages;
-  try {
-    messages = (await import(`../../messages/${params?.locale}.json`)).default;
-  } catch (error) {
-    notFound();
-  }
+  const messages = (await import(`../../messages/${params?.locale}.json`)).default;

  return (
    <html
@@ -95,7 +89,9 @@ export default async function RootLayout({
    >
      <body className="bg-dark text-white selection:bg-green-800 selection:text-green-400">
        <NextIntlClientProvider locale={params?.locale} messages={messages}>
-          <Analytics />
+          <Suspense fallback={null}>
+            <Analytics />
+          </Suspense>
          <main>{children}</main>
        </NextIntlClientProvider>
      </body>
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -24,6 +24,7 @@ import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
 import Image from 'next/image';
+import { Suspense } from 'react';

 const { SITE_NAME } = process.env;

@@ -59,7 +60,9 @@ export default async function HomePage({
        <HomepageProducts lang={locale} />
      </div>
      <div className="py-24 md:py-48">
-        <NewsletterSignup />
+        <Suspense fallback={null}>
+          <NewsletterSignup />
+        </Suspense>
      </div>
      <div className="relative mx-auto max-w-screen-xl">
        <Image
@@ -70,7 +73,9 @@ export default async function HomePage({
        />
      </div>
      <div className="py-24">
-        <Shoplist />
+        <Suspense fallback={null}>
+          <Shoplist />
+        </Suspense>
      </div>

      <div className="relative pb-48">
--- a/app/[locale]/privacy/page.tsx
+++ b/app/[locale]/privacy/page.tsx
@@ -5,6 +5,7 @@ import Navbar from 'components/layout/navbar';
 import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';
 import PrivacyPolicy from './privacy-policy';

 const { SITE_NAME } = process.env;
@@ -37,9 +38,11 @@ export default async function PrivacyPage({
  return (
    <div>
      <Navbar cart={cart} locale={locale} compact promotedItem={promotedItem} />
-      <div className="py-24 md:py-48">
-        <PrivacyPolicy />
-      </div>
+      <Suspense fallback={null}>
+        <div className="py-24 md:py-48">
+          <PrivacyPolicy />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>
--- a/app/[locale]/products/page.tsx
+++ b/app/[locale]/products/page.tsx
@@ -6,6 +6,7 @@ import Navbar from 'components/layout/navbar';
 import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';

 const { SITE_NAME } = process.env;

@@ -37,9 +38,11 @@ export default async function ProductPage({
  return (
    <div>
      <Navbar cart={cart} locale={locale} compact promotedItem={promotedItem} />
-      <div className="py-24 md:py-48">
-        <ProductGrid lang={locale} />
-      </div>
+      <Suspense fallback={null}>
+        <div className="py-24 md:py-48">
+          <ProductGrid lang={locale} />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>
--- a/app/[locale]/shop-list/page.tsx
+++ b/app/[locale]/shop-list/page.tsx
@@ -3,12 +3,12 @@ import type { Metadata } from 'next';
 import Footer from 'components/layout/footer';
 import Navbar from 'components/layout/navbar';
 import { SupportedLocale } from 'components/layout/navbar/language-control';
-import Prose from 'components/prose';
 import { getCart, getPage, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
 import { notFound } from 'next/navigation';
 import { Suspense } from 'react';
+import ShopListDetail from './shop-list-detail';
 import ShopsNav from './shops-nav';

 export async function generateMetadata({
@@ -16,7 +16,10 @@ export async function generateMetadata({
 }: {
  params: { locale?: SupportedLocale };
 }): Promise<Metadata> {
-  const page = await getPage({ handle: 'shop-list', language: params?.locale?.toUpperCase() });
+  const page = await getPage({
+    handle: 'shop-list',
+    language: params?.locale?.toUpperCase() || 'JA'
+  });

  if (!page) return notFound();

@@ -39,26 +42,21 @@ export default async function Page({ params }: { params: { locale?: SupportedLoc
    cart = await getCart(cartId);
  }

-  const page = await getPage({ handle: 'shop-list', language: params?.locale?.toUpperCase() });
-
-  if (!page) return notFound();
-
  const promotedItem: Product | undefined = await getProduct({
    handle: 'gift-bag-and-postcard-set',
-    language: params?.locale?.toUpperCase()
+    language: params?.locale?.toUpperCase() || 'JA'
  });

  return (
    <div>
      <Navbar cart={cart} locale={params?.locale} compact showTop promotedItem={promotedItem} />
      <div className="mx-auto max-w-xl px-6 pb-24 pt-12 md:pb-48 md:pt-24">
-        <Suspense>
-          <div className="pb-12">
-            <ShopsNav />
-          </div>
+        <div className="pb-12">
+          <ShopsNav />
+        </div>
+        <Suspense fallback={null}>
+          <ShopListDetail language={params?.locale?.toUpperCase()} />
        </Suspense>
-        {/* <h2 className="font-multilingual mb-8 text-3xl font-medium">{page.title}</h2> */}
-        <Prose html={page.body as string} />
      </div>

      <Footer cart={cart} />
--- a/app/[locale]/shop-list/shop-list-detail.tsx
+++ b/app/[locale]/shop-list/shop-list-detail.tsx
@@ -0,0 +1,13 @@
+'use server';
+
+import Prose from 'components/prose';
+import { getPage } from 'lib/shopify';
+import { notFound } from 'next/navigation';
+
+export default async function ShopListDetail({ language }: { language?: string }) {
+  const page = await getPage({ handle: 'shop-list', language });
+
+  if (!page) return notFound();
+
+  return <Prose html={page.body as string} />;
+}
--- a/app/[locale]/stories/page.tsx
+++ b/app/[locale]/stories/page.tsx
@@ -7,6 +7,7 @@ import { BLOG_HANDLE } from 'lib/constants';
 import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';

 const { SITE_NAME } = process.env;

@@ -38,9 +39,11 @@ export default async function StoriesPage({
  return (
    <div>
      <Navbar cart={cart} locale={locale} compact promotedItem={promotedItem} />
-      <div className="py-24 md:py-48">
-        <StoriesDetail handle={BLOG_HANDLE} locale={locale} />
-      </div>
+      <Suspense fallback={null}>
+        <div className="py-24 md:py-48">
+          <StoriesDetail handle={BLOG_HANDLE} locale={locale} />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>
--- a/app/[locale]/terms/page.tsx
+++ b/app/[locale]/terms/page.tsx
@@ -5,6 +5,7 @@ import Navbar from 'components/layout/navbar';
 import { getCart, getProduct } from 'lib/shopify';
 import { Product } from 'lib/shopify/types';
 import { cookies } from 'next/headers';
+import { Suspense } from 'react';
 import TermsOfUse from './terms-of-use';

 const { SITE_NAME } = process.env;
@@ -37,9 +38,11 @@ export default async function TermsPage({
  return (
    <div>
      <Navbar cart={cart} locale={locale} compact promotedItem={promotedItem} />
-      <div className="py-24 md:py-48">
-        <TermsOfUse />
-      </div>
+      <Suspense fallback={null}>
+        <div className="py-24 md:py-48">
+          <TermsOfUse />
+        </div>
+      </Suspense>

      <Footer cart={cart} />
    </div>