Fix build errors with DIO

app/[page]/loading.tsx

@@ -0,0 +1,5 @@
+export default function Loading() {
+  // Provide a proper skeleton here if the params are high cardinality, and
+  // fallback shells are preferred over route shells.
+  return null;
+}

app/product/[handle]/loading.tsx

@@ -0,0 +1,5 @@
+export default function Loading() {
+  // Provide a proper skeleton here if the params are high cardinality, and
+  // fallback shells are preferred over route shells.
+  return null;
+}

app/search/[collection]/page.tsx

@@ -27,8 +27,6 @@ export default async function CategoryPage(props: {
   params: Promise<{ collection: string }>;
   searchParams?: Promise<{ [key: string]: string | string[] | undefined }>;
 }) {
-  'use cache';
-
   const searchParams = await props.searchParams;
   const params = await props.params;
   const { sort } = searchParams as { [key: string]: string };

components/layout/navbar/index.tsx

@@ -53,7 +53,9 @@ export async function Navbar() {
           </Suspense>
         </div>
         <div className="flex justify-end md:w-1/3">
-          <CartModal />
+          <Suspense>
+            <CartModal />
+          </Suspense>
         </div>
       </div>
     </nav>

components/opengraph-image.tsx

@@ -1,12 +1,20 @@
+import { readFile } from 'fs/promises';
 import { ImageResponse } from 'next/og';
-import LogoIcon from './icons/logo';
 import { join } from 'path';
-import { readFile } from 'fs/promises';
+import LogoIcon from './icons/logo';
 
 export type Props = {
   title?: string;
 };
 
+async function getFont() {
+  'use cache';
+
+  const file = await readFile(join(process.cwd(), './fonts/Inter-Bold.ttf'));
+
+  return Uint8Array.from(file).buffer;
+}
+
 export default async function OpengraphImage(
   props?: Props
 ): Promise<ImageResponse> {
@@ -17,8 +25,7 @@ export default async function OpengraphImage(
     ...props
   };
 
-  const file = await readFile(join(process.cwd(), './fonts/Inter-Bold.ttf'));
-  const font = Uint8Array.from(file).buffer;
+  const font = await getFont();
 
   return new ImageResponse(
     (

next.config.ts

@@ -1,9 +1,12 @@
-export default {
+import { NextConfig } from 'next';
+
+const nextConfig: NextConfig = {
   experimental: {
     ppr: true,
     dynamicIO: true,
     inlineCss: true,
-    useCache: true
+    useCache: true,
+    prerenderEarlyExit: false
   },
   images: {
     formats: ['image/avif', 'image/webp'],
@@ -16,3 +19,5 @@ export default {
     ]
   }
 };
+
+export default nextConfig;

package.json

@@ -13,7 +13,7 @@
     "@heroicons/react": "^2.2.0",
     "clsx": "^2.1.1",
     "geist": "^1.4.2",
-    "next": "15.4.0-canary.31",
+    "next": "https://vercel-packages.vercel.app/next/commits/3de4e9a1bd5755f8b69035716a69d444672306e8/next",
     "react": "19.1.0",
     "react-dom": "19.1.0",
     "sonner": "^2.0.3"
@@ -30,5 +30,6 @@
     "prettier-plugin-tailwindcss": "^0.6.11",
     "tailwindcss": "^4.1.6",
     "typescript": "5.8.3"
-  }
+  },
+  "packageManager": "[email protected]+sha512.b2dc20e2fc72b3e18848459b37359a32064663e5627a51e4c74b2c29dd8e8e0491483c3abb40789cfd578bf362fb6ba8261b05f0387d76792ed6e23ea3b1b6a0"
 }