Next.js Discord

Discord Forum

The server could not finish this Suspense boundary, likely due to an error during server rendering.

Unanswered
Rex posted this in #help-forum
Open in Discord
RexOP
Can you help me solve the error in the title? I think the error is due to my implementation of GA4.

"use client";

import Script from "next/script";
import { useEffect } from "react";
import { usePathname, useSearchParams } from "next/navigation";
import { pageview } from "@/lib/ga4/gtagHelper";

export default function GoogleAnalytics({ GA_MEASUREMENT_ID }) {
  const pathname = usePathname();
  const searchParams = useSearchParams();

  useEffect(() => {
    const url = pathname + searchParams.toString();

    pageview(GA_MEASUREMENT_ID, url);
  }, [pathname, searchParams, GA_MEASUREMENT_ID]);

  return (
    <>
      <Script src={`https://www.googletagmanager.com/gtag/js?id=${GA_MEASUREMENT_ID}`} />
      <Script
        id="google-analytics"
        dangerouslySetInnerHTML={{
          __html: `
                window.dataLayer = window.dataLayer || [];
                function gtag(){dataLayer.push(arguments);}
                gtag('js', new Date());

                gtag('consent', 'default', {
                    'analytics_storage': 'denied'
                });
                
                gtag('config', '${GA_MEASUREMENT_ID}', {
                    page_path: window.location.pathname,
                });
                `,
        }}
      />
    </>
  );
}


The GoogleAnalytics component is imported to my root layout:

export default async function RootLayout({ children }) {
  const categories = await getCategories();

  return (
    <html lang="en">
      <Suspense fallback={null}>
        <GoogleAnalytics GA_MEASUREMENT_ID={"G-RANDOM"} />
      </Suspense>
      <body className={poppins.className}>
        <Providers>
          <Header categories={categories} />
          {children}
          <Suspense fallback={null}>
            <CookieBanner />
          </Suspense>
          <Footer categories={categories} />
        </Providers>
      </body>
    </html>
  );
}

0 Replies