Skip to content

Commit 5b268be

Browse files
valentinpolitovbalazsorban44
valentinpolitov
and
balazsorban44
authored
examples: migrate with-elasticsearch to TypeScript (#44842)
## Bug - [ ] Related issues linked using `fixes #number` - [ ] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Feature - [ ] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR. - [ ] Related issues linked using `fixes #number` - [ ] [e2e](https://github.com/vercel/next.js/blob/canary/contributing/core/testing.md#writing-tests-for-nextjs) tests added - [ ] Documentation added - [ ] Telemetry added. In case of a feature if it's used or not. - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md) ## Documentation / Examples - [x] Make sure the linting passes by running `pnpm build && pnpm lint` - [x] The "examples guidelines" are followed from [our contributing doc](https://github.com/vercel/next.js/blob/canary/contributing/examples/adding-examples.md) Co-authored-by: Balázs Orbán <[email protected]>
1 parent b09bbad commit 5b268be

File tree

13 files changed

+539
-186
lines changed

13 files changed

+539
-186
lines changed

‎examples/with-elasticsearch/lib/elasticsearch.js‎ renamed to ‎examples/with-elasticsearch/lib/elasticsearch.ts‎

File renamed without changes.

‎examples/with-elasticsearch/package.json‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,15 @@
77
"lint": "next lint"
88
},
99
"dependencies": {
10-
"@elastic/elasticsearch": "^8.1.0",
10+
"@elastic/elasticsearch": "^8.6.0",
1111
"next": "latest",
1212
"react": "^18.2.0",
1313
"react-dom": "^18.2.0"
14+
},
15+
"devDependencies": {
16+
"@types/node": "^18.11.18",
17+
"@types/react": "^18.0.26",
18+
"@types/react-dom": "^18.0.10",
19+
"typescript": "^4.8.2"
1420
}
1521
}

‎examples/with-elasticsearch/pages/_app.js‎

Lines changed: 0 additions & 7 deletions
This file was deleted.

‎examples/with-elasticsearch/pages/_app.tsx‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import type { AppProps } from 'next/app'
2+
import '@/styles/globals.css'
3+
4+
export default function App({ Component, pageProps }: AppProps) {
5+
return <Component {...pageProps} />
6+
}

‎examples/with-elasticsearch/pages/index.js‎

Lines changed: 0 additions & 92 deletions
This file was deleted.

‎examples/with-elasticsearch/pages/index.tsx‎

Lines changed: 158 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
import type { InferGetServerSidePropsType } from 'next'
2+
import Head from 'next/head'
3+
import Image from 'next/image'
4+
import styles from '@/styles/Home.module.css'
5+
import { Inter } from 'next/font/google'
6+
import { connectToElasticsearch } from '@/lib/elasticsearch'
7+
8+
const inter = Inter({ subsets: ['latin'] })
9+
10+
type HomePageProps = InferGetServerSidePropsType<typeof getServerSideProps>
11+
12+
export default function Home({ isConnected }: HomePageProps) {
13+
const connectionStatus = isConnected ? (
14+
<p>You are connected to Elasticsearch</p>
15+
) : (
16+
<p>
17+
You are NOT connected to Elasticsearch. Check the{' '}
18+
<code className={styles.code}>README.md</code> for instructions.
19+
</p>
20+
)
21+
22+
return (
23+
<>
24+
<Head>
25+
<title>Create Next App</title>
26+
<meta name="description" content="Generated by create next app" />
27+
<meta name="viewport" content="width=device-width, initial-scale=1" />
28+
<link rel="icon" href="/favicon.ico" />
29+
</Head>
30+
<main className={styles.main}>
31+
<div className={styles.description}>
32+
<p>
33+
Get started by editing&nbsp;
34+
<code className={styles.code}>pages/index.tsx</code>
35+
</p>
36+
<div>
37+
<a
38+
href="https://vercel.com?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
39+
target="_blank"
40+
rel="noopener noreferrer"
41+
>
42+
By{' '}
43+
<Image
44+
src="/vercel.svg"
45+
alt="Vercel Logo"
46+
className={styles.vercelLogo}
47+
width={100}
48+
height={24}
49+
priority
50+
/>
51+
</a>
52+
</div>
53+
</div>
54+
55+
<div className={styles.center} style={{ paddingBottom: 0 }}>
56+
<Image
57+
className={styles.logo}
58+
src="/next.svg"
59+
alt="Next.js Logo"
60+
width={180}
61+
height={37}
62+
priority
63+
/>
64+
<div className={styles.thirteen}>
65+
<Image
66+
src="/thirteen.svg"
67+
alt="13"
68+
width={40}
69+
height={31}
70+
priority
71+
/>
72+
</div>
73+
</div>
74+
75+
<div
76+
className={`${styles.center} ${inter.className}`}
77+
style={{ paddingBlock: 20 }}
78+
>
79+
<h2>with Elasticsearch</h2>
80+
</div>
81+
82+
<div className={`${styles.center} ${styles.status}`}>
83+
{connectionStatus}
84+
</div>
85+
86+
<div className={styles.grid}>
87+
<a
88+
href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
89+
className={styles.card}
90+
target="_blank"
91+
rel="noopener noreferrer"
92+
>
93+
<h2 className={inter.className}>
94+
Docs <span>-&gt;</span>
95+
</h2>
96+
<p className={inter.className}>
97+
Find in-depth information about Next.js features and&nbsp;API.
98+
</p>
99+
</a>
100+
101+
<a
102+
href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
103+
className={styles.card}
104+
target="_blank"
105+
rel="noopener noreferrer"
106+
>
107+
<h2 className={inter.className}>
108+
Learn <span>-&gt;</span>
109+
</h2>
110+
<p className={inter.className}>
111+
Learn about Next.js in an interactive course with&nbsp;quizzes!
112+
</p>
113+
</a>
114+
115+
<a
116+
href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
117+
className={styles.card}
118+
target="_blank"
119+
rel="noopener noreferrer"
120+
>
121+
<h2 className={inter.className}>
122+
Templates <span>-&gt;</span>
123+
</h2>
124+
<p className={inter.className}>
125+
Discover and deploy boilerplate example Next.js&nbsp;projects.
126+
</p>
127+
</a>
128+
129+
<a
130+
href="https://vercel.com/new?utm_source=create-next-app&utm_medium=default-template&utm_campaign=create-next-app"
131+
className={styles.card}
132+
target="_blank"
133+
rel="noopener noreferrer"
134+
>
135+
<h2 className={inter.className}>
136+
Deploy <span>-&gt;</span>
137+
</h2>
138+
<p className={inter.className}>
139+
Instantly deploy your Next.js site to a shareable URL
140+
with&nbsp;Vercel.
141+
</p>
142+
</a>
143+
</div>
144+
</main>
145+
</>
146+
)
147+
}
148+
149+
export const getServerSideProps = async () => {
150+
let isConnected: boolean = false
151+
const client = await connectToElasticsearch()
152+
if (client !== 'ERR_ENV_NOT_DEFINED') {
153+
isConnected = true
154+
}
155+
return {
156+
props: { isConnected },
157+
}
158+
}

‎examples/with-elasticsearch/public/favicon.ico‎

10.6 KB
Binary file not shown.

‎examples/with-elasticsearch/public/next.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎examples/with-elasticsearch/public/thirteen.svg‎

Lines changed: 1 addition & 0 deletions
Loading

‎examples/with-elasticsearch/public/vercel.svg‎

Lines changed: 1 addition & 4 deletions
Loading

0 commit comments

Comments
 (0)