feat: Add RequestContext util for API routes

Author: codinsonn

apps/next/app/(main)/api/health/route.ts

@@ -1,21 +1,25 @@
 import { NextRequest, NextResponse } from 'next/server'
 import { healthCheck } from '@app/core/resolvers/healthCheck'
+import { createRequestContext } from '@app/core/middleware/createRequestContext'
 
 /* --- Types ----------------------------------------------------------------------------------- */
 
-type RequestContext<T = Record<string, unknown>> = {
+type NextRequestContext<T = Record<string, unknown>> = {
     params: T
 }
 
 /* --- Handlers -------------------------------------------------------------------------------- */
 
-const handler = async (req: NextRequest, context: RequestContext) => {
+const handler = async (req: NextRequest, nextRequestContext: NextRequestContext) => {
     // Input
     const searchParams = req.nextUrl.searchParams
     const echo = searchParams.get('echo') || null
 
+    // Build Context
+    const context = await createRequestContext({ req, ...nextRequestContext })
+
     // Run Resolver
-    const serverHealth = await healthCheck({ echo, req })
+    const serverHealth = await healthCheck({ args: { echo }, context })
 
     // Respond
     return NextResponse.json(serverHealth)

features/app-core/middleware/createRequestContext.ts

@@ -0,0 +1,46 @@
+import { NextRequest, NextResponse } from 'next/server'
+
+/* --- Types ----------------------------------------------------------------------------------- */
+
+export type RequestContext = {
+    // -i- Next.js app API router request and response objects
+    req: NextRequest,
+    res: NextResponse,
+    // -i- GraphQL context properties
+    parent?: unknown,
+    info?: unknown,
+    // -i- Anything else you might want to attach as context through middleware, e.g.
+    // user: ...
+    // permissions: ...
+}
+
+export type CreateRequestContextArgs = Partial<Omit<RequestContext, 'req' | 'res'>> & {
+    req: NextRequest,
+    res?: NextResponse,
+}
+
+/** --- createRequestContext() ----------------------------------------------------------------- */
+/** -i- Server-only util for Next.js API routes and graphql to add more context to requests for resolvers to use */
+export const createRequestContext = async (baseContext: CreateRequestContextArgs): Promise<RequestContext> => {
+    // Inputs
+    const { req, res = new NextResponse(), ...restContext } = baseContext
+
+    // -- Custom context retrieval --
+
+    // TODO: Add custom context retrieval here
+    // e.g. Parse header info
+    // e.g. Verify JWT / user session
+
+    // -- Return --
+
+    return {
+        // -i- Next.js app API router request and response objects
+        req,
+        res,
+        // -i- GraphQL context properties?
+        ...restContext,
+        // -i- Anything else you might want to attach as context through middleware, e.g.
+        // user: ...
+        // permissions: ...
+    }
+}

features/app-core/resolvers/healthCheck.ts

@@ -1,5 +1,6 @@
-import type { NextApiRequest } from 'next'
 import * as OS from 'os'
+import type { NextRequest } from 'next/server'
+import type { RequestContext } from '../middleware/createRequestContext'
 
 /* --- Constants ------------------------------------------------------------------------------- */
 
@@ -9,25 +10,30 @@ const ALIVE_SINCE = new Date()
 
 type HealthCheckArgs = {
   echo: string
-  req: Request | NextApiRequest
+}
+
+type HealthCheckInputs = {
+  args: HealthCheckArgs,
+  context: RequestContext
 }
 
 /** --- healthCheck() -------------------------------------------------------------------------- */
 /** -i- Check the health status of the server. Includes relevant urls, server time(zone), versions and more */
-export const healthCheck = async (args: HealthCheckArgs) => {
-    // Input
-    const { echo, req } = args
+export const healthCheck = async ({ args, context }: HealthCheckInputs) => {
+    // Inputs
+    const { echo } = args
+    const { req } = context
 
     // Vars
     const now = new Date()
     const aliveTime = now.getTime() - ALIVE_SINCE.getTime()
 
     // Urls
     const r = req as Request
-    const rn = req as NextApiRequest
-    const reqHost = rn?.headers?.host
-    const reqProtocol = rn?.headers?.['x-forwarded-proto'] ?? 'http'
-    const requestURL = r?.url ?? `${reqProtocol}://${reqHost}/api/health`
+    const rn = req as NextRequest
+    const requestHost = rn?.headers?.get?.('host')
+    const requestProtocol = rn?.headers?.get?.['x-forwarded-proto'] ?? 'http'
+    const requestURL = r?.url ?? `${requestProtocol}://${requestHost}/api/health`
     const baseURL = process.env.BACKEND_URL || requestURL?.split('/api/')[0]
     const apiURL = baseURL ? `${baseURL}/api` : null
 
@@ -46,6 +52,8 @@ export const healthCheck = async (args: HealthCheckArgs) => {
         aliveSince: ALIVE_SINCE.toISOString(),
         serverTimezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
         // URLS
+        requestHost,
+        requestProtocol,
         requestURL,
         baseURL,
         apiURL,

features/app-core/screens/SlugScreen.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 import { StyleSheet, Text, View } from 'react-native'
-import { useRouteParams } from '@app/core/navigation/useRouteParams'
+import { useRouteParams } from '../navigation/useRouteParams'
 import { Link } from '../navigation/Link'
 import { useRouter } from '../navigation/useRouter'
 

features/app-core/tsconfig.json

@@ -20,8 +20,11 @@
   "include": [
     "next-env.d.ts",
     "**/*.ts",
-    "**/*.tsx"
-, "../../apps/expo/app/ExpoRootLayout.tsx", "../../apps/next/app/NextRootLayout.tsx../../apps/next/app/ServerStylesProvider.tsx.tsx"  ],
+    "**/*.tsx",
+    "../../apps/expo/app/ExpoRootLayout.tsx",
+    "../../apps/next/app/NextRootLayout.tsx",
+    "../../apps/next/app/ServerStylesProvider.tsx.tsx",
+  ],
   "exclude": [
     "node_modules"
   ],