From a2e3b27dfc91c09850a5db13499c31a53237d8e1 Mon Sep 17 00:00:00 2001 From: Arian <46089900+ariannargesi@users.noreply.github.com> Date: Tue, 19 Mar 2024 00:58:29 +0330 Subject: [PATCH] Migrate the with-jotai example from page router to app router (#63390) ## Migrate the with-jotai example from page router to app router Please if it needs further updates, Let me know! Happy to contribute --------- Co-authored-by: Sam Ko --- examples/with-jotai/app/layout.tsx | 20 +++++++++++++++++++ .../{pages/index.tsx => app/page.tsx} | 13 ++++++------ examples/with-jotai/components/Canvas.tsx | 2 ++ examples/with-jotai/package.json | 3 ++- examples/with-jotai/pages/_app.tsx | 11 ---------- examples/with-jotai/pages/api/hello.ts | 13 ------------ examples/with-jotai/tsconfig.json | 12 ++++++++--- 7 files changed, 40 insertions(+), 34 deletions(-) create mode 100644 examples/with-jotai/app/layout.tsx rename examples/with-jotai/{pages/index.tsx => app/page.tsx} (78%) delete mode 100644 examples/with-jotai/pages/_app.tsx delete mode 100644 examples/with-jotai/pages/api/hello.ts 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"] }