pkg: Update next to v16 (#3579)

* pkg: Update `next` to v16

* fix: Nextjs 16 upgrade needs

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Nathaniel Tucker <me@ntucker.me>

Author: renovate[bot]

examples/nextjs/app/[userId]/layout.tsx

@@ -4,7 +4,7 @@ import UserSelection from '@/components/todo/UserSelection';
 
 export default async function TodoLayout(props: {
   children: React.ReactNode;
-  params?: Promise<{ userId: number }>;
+  params?: Promise<{ userId: string }>;
 }) {
   const params = await props.params;
   const { children } = props;
@@ -17,7 +17,9 @@ export default async function TodoLayout(props: {
         content="NextJS integration with Reactive Data Client"
       />
 
-      <UserSelection userId={params?.userId} />
+      <UserSelection
+        userId={params?.userId ? Number(params.userId) : undefined}
+      />
 
       {children}
 

examples/nextjs/app/[userId]/page.tsx

@@ -1,7 +1,8 @@
 import TodoList from '@/components/todo/TodoList';
 
 export default async function TodoPage(props: {
-  params: Promise<{ userId: number }>;
+  params: Promise<{ userId: string }>;
 }) {
-  return <TodoList {...await props.params} />;
+  const params = await props.params;
+  return <TodoList userId={Number(params.userId)} />;
 }

examples/nextjs/app/page.tsx

@@ -3,8 +3,8 @@ import TodoPage from './[userId]/page';
 
 export default function Home() {
   return (
-    <TodoLayout params={{ userId: 1 }}>
-      <TodoPage params={{ userId: 1 }} />
+    <TodoLayout params={Promise.resolve({ userId: '1' })}>
+      <TodoPage params={Promise.resolve({ userId: '1' })} />
     </TodoLayout>
   );
 }

examples/nextjs/next.config.js

@@ -1,6 +1,9 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   reactStrictMode: true,
+  turbopack: {
+    root: __dirname,
+  },
 };
 
 module.exports = nextConfig;