diff --git a/examples/with-jotai/app/layout.tsx b/examples/with-jotai/app/layout.tsx
new file mode 100644
index 0000000000000..51f3d835719b9
--- /dev/null
+++ b/examples/with-jotai/app/layout.tsx
@@ -0,0 +1,20 @@
+import { Provider } from "jotai";
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+ icons: "/favicon.ico",
+};
+
+export default function RootLayout({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+
+
+ {children}
+
+
+ );
+}
diff --git a/examples/with-jotai/pages/index.tsx b/examples/with-jotai/app/page.tsx
similarity index 78%
rename from examples/with-jotai/pages/index.tsx
rename to examples/with-jotai/app/page.tsx
index df98778f030b8..41a3d0e9860cd 100644
--- a/examples/with-jotai/pages/index.tsx
+++ b/examples/with-jotai/app/page.tsx
@@ -1,16 +1,17 @@
-import Head from "next/head";
import Image from "next/image";
import styles from "../styles/Home.module.css";
+import "../styles/globals.css";
import Canvas from "../components/Canvas";
+import { Metadata } from "next";
+
+export const metadata: Metadata = {
+ title: "with-jotai",
+ description: "Generated by create next app",
+};
export default function Home() {
return (
-
-
with-jotai
-
-
-
With Jotai example
diff --git a/examples/with-jotai/components/Canvas.tsx b/examples/with-jotai/components/Canvas.tsx
index c87cba3dc84b0..f4a6602e2b1b3 100644
--- a/examples/with-jotai/components/Canvas.tsx
+++ b/examples/with-jotai/components/Canvas.tsx
@@ -1,3 +1,5 @@
+"use client";
+
import { atom, useAtom } from "jotai";
type Point = [number, number];
diff --git a/examples/with-jotai/package.json b/examples/with-jotai/package.json
index d66058245fe33..d51ed0a2df26a 100644
--- a/examples/with-jotai/package.json
+++ b/examples/with-jotai/package.json
@@ -6,12 +6,13 @@
"start": "next start"
},
"dependencies": {
- "jotai": "1.7.3",
+ "jotai": "2.7.1",
"next": "latest",
"react": "18.2.0",
"react-dom": "18.2.0"
},
"devDependencies": {
+ "@types/node": "20.11.28",
"@types/react": "17.0.16",
"eslint": "7.32.0",
"eslint-config-next": "11.0.1",
diff --git a/examples/with-jotai/pages/_app.tsx b/examples/with-jotai/pages/_app.tsx
deleted file mode 100644
index 8a2c747230d7d..0000000000000
--- a/examples/with-jotai/pages/_app.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import "../styles/globals.css";
-import type { AppProps } from "next/app";
-import { Provider } from "jotai";
-
-export default function MyApp({ Component, pageProps }: AppProps) {
- return (
-
-
-
- );
-}
diff --git a/examples/with-jotai/pages/api/hello.ts b/examples/with-jotai/pages/api/hello.ts
deleted file mode 100644
index ea77e8f35b382..0000000000000
--- a/examples/with-jotai/pages/api/hello.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
-import type { NextApiRequest, NextApiResponse } from "next";
-
-type Data = {
- name: string;
-};
-
-export default function handler(
- req: NextApiRequest,
- res: NextApiResponse,
-) {
- res.status(200).json({ name: "John Doe" });
-}
diff --git a/examples/with-jotai/tsconfig.json b/examples/with-jotai/tsconfig.json
index 4fa631c261428..6b98f2247f52d 100644
--- a/examples/with-jotai/tsconfig.json
+++ b/examples/with-jotai/tsconfig.json
@@ -1,19 +1,25 @@
{
"compilerOptions": {
- "target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noEmit": true,
+ "incremental": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
- "jsx": "preserve"
+ "jsx": "preserve",
+ "plugins": [
+ {
+ "name": "next"
+ }
+ ],
+ "strictNullChecks": true
},
- "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+ "include": ["next-env.d.ts", ".next/types/**/*.ts", "**/*.ts", "**/*.tsx"],
"exclude": ["node_modules"]
}