Skip to content

Commit abd93c2

Browse files
authored
test: nextjs integration (#6014)
1 parent 053a4b6 commit abd93c2

File tree

11 files changed

+488
-217
lines changed

11 files changed

+488
-217
lines changed

integrations/next-js-app/.gitignore

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.js
7+
8+
# testing
9+
/coverage
10+
11+
# next.js
12+
/.next/
13+
/out/
14+
15+
# production
16+
/build
17+
18+
# misc
19+
.DS_Store
20+
*.pem
21+
22+
# debug
23+
npm-debug.log*
24+
yarn-debug.log*
25+
yarn-error.log*
26+
27+
# local env files
28+
.env*.local
29+
30+
# vercel
31+
.vercel
32+
33+
# typescript
34+
*.tsbuildinfo
35+
next-env.d.ts

integrations/next-js-app/README.md

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
2+
3+
## Getting Started
4+
5+
First, run the development server:
6+
7+
```bash
8+
npm run dev
9+
# or
10+
yarn dev
11+
# or
12+
pnpm dev
13+
```
14+
15+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
16+
17+
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
18+
19+
This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
20+
21+
## Learn More
22+
23+
To learn more about Next.js, take a look at the following resources:
24+
25+
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
26+
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
27+
28+
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
29+
30+
## Deploy on Vercel
31+
32+
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
33+
34+
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
'use client'
2+
3+
import { useQuery } from '@tanstack/react-query'
4+
5+
export function ClientComponent() {
6+
const query = useQuery({
7+
queryKey: ['test'],
8+
queryFn: async () => {
9+
await new Promise((r) => setTimeout(r, 1000))
10+
return 'Success'
11+
},
12+
})
13+
14+
if (query.isPending) {
15+
return <div>Loading...</div>
16+
}
17+
18+
if (query.isError) {
19+
return <div>An error has occurred!</div>
20+
}
21+
22+
return <div>{query.data}</div>
23+
}
25.3 KB
Binary file not shown.
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import type { Metadata } from 'next'
2+
import Providers from './providers'
3+
4+
export const metadata: Metadata = {
5+
title: 'Create Next App',
6+
description: 'Generated by create next app',
7+
}
8+
9+
export default function RootLayout({
10+
children,
11+
}: {
12+
children: React.ReactNode
13+
}) {
14+
return (
15+
<html lang="en">
16+
<body>
17+
<Providers>{children}</Providers>
18+
</body>
19+
</html>
20+
)
21+
}

integrations/next-js-app/app/page.tsx

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { ClientComponent } from '@/app/client-component'
2+
import { queryOptions } from '@tanstack/react-query'
3+
4+
const options = queryOptions({
5+
queryKey: ['foo'],
6+
})
7+
8+
export default function Home() {
9+
return (
10+
<main>
11+
<ClientComponent />
12+
Key: {JSON.stringify(options.queryKey)}
13+
</main>
14+
)
15+
}
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
'use client'
2+
import * as React from 'react'
3+
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
4+
5+
export default function Providers({ children }: { children: React.ReactNode }) {
6+
const [queryClient] = React.useState(() => new QueryClient())
7+
8+
return (
9+
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
10+
)
11+
}
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
/** @type {import('next').NextConfig} */
2+
const nextConfig = {
3+
eslint: {
4+
ignoreDuringBuilds: true,
5+
},
6+
}
7+
8+
module.exports = nextConfig

integrations/next-js-app/package.json

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"name": "next-js-app",
3+
"version": "0.1.0",
4+
"private": true,
5+
"scripts": {
6+
"test:bundle": "next build",
7+
"dev": "next dev"
8+
},
9+
"dependencies": {
10+
"@tanstack/react-query": "workspace:*",
11+
"@tanstack/react-query-devtools": "workspace:*",
12+
"@types/node": "20.4.5",
13+
"@types/react": "^18.2.4",
14+
"@types/react-dom": "^18.2.4",
15+
"next": "13.4.19",
16+
"react": "18.2.0",
17+
"react-dom": "18.2.0",
18+
"typescript": "5.1.6"
19+
}
20+
}
Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"compilerOptions": {
3+
"target": "es5",
4+
"lib": ["dom", "dom.iterable", "esnext"],
5+
"allowJs": true,
6+
"skipLibCheck": true,
7+
"strict": true,
8+
"forceConsistentCasingInFileNames": true,
9+
"noEmit": true,
10+
"esModuleInterop": true,
11+
"module": "esnext",
12+
"moduleResolution": "bundler",
13+
"resolveJsonModule": true,
14+
"isolatedModules": true,
15+
"jsx": "preserve",
16+
"incremental": true,
17+
"plugins": [
18+
{
19+
"name": "next"
20+
}
21+
],
22+
"paths": {
23+
"@/*": ["./*"]
24+
}
25+
},
26+
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
27+
"exclude": ["node_modules"]
28+
}

0 commit comments

Comments
 (0)