Convert custom-server-hapi Example to Typescript (#34507)

In the contributing doc, it mentions "Examples should be TypeScript first, if possible" so I thought about converting some examples to be typescript along with updating a couple in my free time. Let me know if that would be an issue.

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `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`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [X] Make sure the linting passes by running `yarn lint`

examples/custom-server-hapi/next-env.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="next" />
+/// <reference types="next/image-types/global" />
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.

examples/custom-server-hapi/nodemon.json

@@ -0,0 +1,5 @@
+{
+  "watch": ["server"],
+  "exec": "ts-node --project tsconfig.server.json server/server.ts",
+  "ext": "js ts"
+}

examples/custom-server-hapi/package.json

@@ -1,15 +1,24 @@
 {
   "private": true,
   "scripts": {
-    "dev": "node server.js",
-    "build": "next build",
-    "start": "cross-env NODE_ENV=production node server.js"
+    "dev": "nodemon",
+    "build": "next build && tsc --project tsconfig.server.json",
+    "start": "cross-env NODE_ENV=production node dist/server.js"
   },
   "dependencies": {
-    "@hapi/hapi": "^18.3.1",
-    "cross-env": "^5.2.0",
+    "@hapi/hapi": "^20.2.1",
+    "cross-env": "^7.0.3",
     "next": "latest",
     "react": "^17.0.2",
     "react-dom": "^17.0.2"
+  },
+  "devDependencies": {
+    "@types/hapi__hapi": "^20.0.10",
+    "@types/node": "^16.11.25",
+    "@types/react": "^17.0.39",
+    "@types/react-dom": "^17.0.11",
+    "nodemon": "^2.0.15",
+    "ts-node": "^10.5.0",
+    "typescript": "^4.5.5"
   }
 }

examples/custom-server-hapi/server/next-wrapper.ts

@@ -0,0 +1,16 @@
+import type { NextServer } from 'next/dist/server/next'
+import type { Lifecycle } from '@hapi/hapi'
+import type { NextUrlWithParsedQuery } from 'next/dist/server/request-meta'
+
+const nextHandlerWrapper = (app: NextServer): Lifecycle.Method => {
+  const handler = app.getRequestHandler()
+
+  return async ({ raw, url, query }, h) => {
+    const nextUrl = url as unknown as NextUrlWithParsedQuery
+    nextUrl.query = query
+    await handler(raw.req, raw.res, nextUrl)
+    return h.close
+  }
+}
+
+export { nextHandlerWrapper }

examples/custom-server-hapi/server.js → examples/custom-server-hapi/server/server.ts

@@ -1,6 +1,6 @@
-const next = require('next')
-const Hapi = require('@hapi/hapi')
-const { /* pathWrapper, */ nextHandlerWrapper } = require('./next-wrapper')
+import next from 'next'
+import Hapi from '@hapi/hapi'
+import { nextHandlerWrapper } from './next-wrapper'
 
 const port = parseInt(process.env.PORT, 10) || 3000
 const dev = process.env.NODE_ENV !== 'production'

examples/custom-server-hapi/tsconfig.json

@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "baseUrl": ".",
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": false,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "incremental": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve"
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}

examples/custom-server-hapi/tsconfig.server.json

@@ -0,0 +1,12 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "module": "commonjs",
+    "outDir": "dist",
+    "lib": ["es2019"],
+    "target": "es2019",
+    "isolatedModules": false,
+    "noEmit": false
+  },
+  "include": ["server/**/*.ts"]
+}