Server code refactoring and minor docs updates (#668)

Co-authored-by: Kent C. Dodds <[email protected]>

Author: rustworthy

docs/monitoring.md

@@ -45,16 +45,19 @@ under "Tokens", and copy that to secure location (this becomes
 organization slug (`SENTRY_ORG`), and the slug name for your project too
 (`SENTRY_PROJECT`).
 
-Uncomment the sentry-vite plugin in `vite.config` and the build command in the
-'build' section of the Dockerfile, which shows how to pass the
-`SENTRY_AUTH_TOKEN` (below) as a docker secret, so it is available to the vite
-config when `npm run build` is run (you will need to do the same for
-`SENTRY_ORG` and `SENTRY_PROJECT`). Note that these do not need to be added to
-the `env.server` env vars schema, as they are only used during the build and not
-the runtime.
-
-The plugin will create sentry releases for you and automatically associate
-commits during the vite build once you set the `SENTRY_AUTH_TOKEN` in
-[your GitHub action secrets](https://docs.github.com/en/actions/security-guides/using-secrets-in-github-actions).
+In the 'build' section of the [Dockerfile](../other/Dockerfile), there is an
+example of how to pass (mount) the `SENTRY_AUTH_TOKEN` as a docker secret, so it
+is available to Vite when `npm run build` is run. You can do the same for
+`SENTRY_ORG` and `SENTRY_PROJECT` or actually any other secret (environment
+variable) you need at build time, just make sure those secrets (variables) are
+available on the CI runner: see the 'deploy' job from
+[`deploy`](../.github/workflows/deploy.yml) workflow. Note that these do not
+need to be added to the [`env.server`](../app/utils/env.server.ts) env vars
+schema, as they are only used during the build and not the runtime.
+
+The Sentry Vite plugin in [`vite.config.ts`](../vite.config.ts) will create
+sentry releases for you and automatically associate commits during the vite
+build once the `SENTRY_AUTH_TOKEN` is set, which in our set-up is done via
+[GitHub Actions secrets](https://docs.github.com/en/actions/security-guides/using-secrets-in-github-actions).
 In this setup we have utilized a simple strategy for naming releases of using
 the commit sha, passed in as a build arg via the GitHub action workflow.

index.js

@@ -1,6 +1,5 @@
 import 'dotenv/config'
 import * as fs from 'fs'
-import { installGlobals } from '@remix-run/node'
 import chalk from 'chalk'
 import closeWithGrace from 'close-with-grace'
 import sourceMapSupport from 'source-map-support'
@@ -19,8 +18,6 @@ sourceMapSupport.install({
 	},
 })
 
-installGlobals()
-
 closeWithGrace(async ({ err }) => {
 	if (err) {
 		console.error(chalk.red(err))

server/index.ts

@@ -15,20 +15,19 @@ import morgan from 'morgan'
 installGlobals()
 
 const MODE = process.env.NODE_ENV ?? 'development'
+const IS_PROD = MODE === 'production'
 
-const createRequestHandler =
-	MODE === 'production'
-		? Sentry.wrapExpressCreateRequestHandler(_createRequestHandler)
-		: _createRequestHandler
+const createRequestHandler = IS_PROD
+	? Sentry.wrapExpressCreateRequestHandler(_createRequestHandler)
+	: _createRequestHandler
 
-const viteDevServer =
-	MODE === 'production'
-		? undefined
-		: await import('vite').then(vite =>
-				vite.createServer({
-					server: { middlewareMode: true },
-				}),
-			)
+const viteDevServer = IS_PROD
+	? undefined
+	: await import('vite').then(vite =>
+			vite.createServer({
+				server: { middlewareMode: true },
+			}),
+		)
 
 const app = express()
 
@@ -84,7 +83,7 @@ if (viteDevServer) {
 	app.use(express.static('build/client', { maxAge: '1h' }))
 }
 
-app.get(['/img/*', '/favicons/*'], (req, res) => {
+app.get(['/img/*', '/favicons/*'], (_req, res) => {
 	// if we made it past the express.static for these, then we're missing something.
 	// So we'll just send a 404 and won't bother calling other middleware.
 	return res.status(404).send('Not found')
@@ -108,6 +107,7 @@ app.use((_, res, next) => {
 
 app.use(
 	helmet({
+		xPoweredBy: false,
 		referrerPolicy: { policy: 'same-origin' },
 		crossOriginEmbedderPolicy: false,
 		contentSecurityPolicy: {
@@ -142,7 +142,7 @@ app.use(
 // rate limiting because playwright tests are very fast and we don't want to
 // have to wait for the rate limit to reset between tests.
 const maxMultiple =
-	MODE !== 'production' || process.env.PLAYWRIGHT_TEST_BASE_URL ? 10_000 : 1
+	!IS_PROD || process.env.PLAYWRIGHT_TEST_BASE_URL ? 10_000 : 1
 const rateLimitDefault = {
 	windowMs: 60 * 1000,
 	max: 1000 * maxMultiple,
@@ -212,8 +212,7 @@ app.all(
 			serverBuild: getBuild(),
 		}),
 		mode: MODE,
-		// @sentry/remix needs to be updated to handle the function signature
-		build: MODE === 'production' ? await getBuild() : getBuild,
+		build: getBuild,
 	}),
 )
 
@@ -224,29 +223,25 @@ const portToUse = await getPort({
 
 const server = app.listen(portToUse, () => {
 	const addy = server.address()
-	const portUsed =
-		desiredPort === portToUse
-			? desiredPort
-			: addy && typeof addy === 'object'
-				? addy.port
-				: 0
+	const portActuallyUsed =
+		addy === null || typeof addy === 'string' ? 0 : addy.port
 
-	if (portUsed !== desiredPort) {
+	if (portActuallyUsed !== desiredPort) {
 		console.warn(
 			chalk.yellow(
-				`⚠️  Port ${desiredPort} is not available, using ${portUsed} instead.`,
+				`⚠️  Port ${desiredPort} is not available, using ${portActuallyUsed} instead.`,
 			),
 		)
 	}
 	console.log(`🚀  We have liftoff!`)
-	const localUrl = `http://localhost:${portUsed}`
+	const localUrl = `http://localhost:${portActuallyUsed}`
 	let lanUrl: string | null = null
 	const localIp = ipAddress() ?? 'Unknown'
 	// Check if the address is a private ip
 	// https://en.wikipedia.org/wiki/Private_network#Private_IPv4_address_spaces
 	// https://github.com/facebook/create-react-app/blob/d960b9e38c062584ff6cfb1a70e1512509a966e7/packages/react-dev-utils/WebpackDevServerUtils.js#LL48C9-L54C10
 	if (/^10[.]|^172[.](1[6-9]|2[0-9]|3[0-1])[.]|^192[.]168[.]/.test(localIp)) {
-		lanUrl = `http://${localIp}:${portUsed}`
+		lanUrl = `http://${localIp}:${portActuallyUsed}`
 	}
 
 	console.log(