fix(@kampus/relay): attach ssr next-auth cookies to fetch req

apps/gql/app/graphql/route.ts

@@ -1,6 +1,5 @@
 import { readFileSync } from "node:fs";
 import { join } from "node:path";
-import { type NextApiRequest, type NextApiResponse } from "next";
 import { createSchema, createYoga } from "graphql-yoga";
 
 import { getServerSession } from "@kampus/next-auth";
@@ -14,16 +13,14 @@ import { type KampusGQLContext } from "~/schema/types";
 const typeDefs = readFileSync(join(process.cwd(), "schema/schema.graphql"), "utf8").toString();
 const clients = createClients();
 
-type ServerContext = { req: NextApiRequest; res: NextApiResponse } & KampusGQLContext;
-
-const { handleRequest } = createYoga<ServerContext>({
-  schema: createSchema<ServerContext>({ typeDefs, resolvers }),
+const { handleRequest } = createYoga<KampusGQLContext>({
+  schema: createSchema<KampusGQLContext>({ typeDefs, resolvers }),
   logging: "debug",
   graphiql: true,
-  context: async ({ req, res }) => {
+  context: async () => {
     const loaders = createLoaders(clients);
     const actions = createActions(clients);
-    const session = await getServerSession(req, res);
+    const session = await getServerSession();
 
     return {
       loaders,

packages/relay/environment.ts

@@ -1,3 +1,4 @@
+import { type ReadonlyRequestCookies } from "next/dist/server/web/spec-extension/adapters/request-cookies";
 import {
   Environment,
   Network,
@@ -10,6 +11,8 @@ import {
   type Variables,
 } from "relay-runtime";
 
+import { type Dictionary } from "@kampus/std";
+
 const IS_SERVER = typeof window === typeof undefined;
 const CACHE_TTL = 5 * 1000; // 5 seconds, to resolve preloaded results
 
@@ -19,12 +22,24 @@ export async function networkFetch(
   request: RequestParameters,
   variables: Variables
 ): Promise<GraphQLResponse> {
+  const headers: Dictionary<string> = {
+    Accept: "application/json",
+    "Content-Type": "application/json",
+  };
+
+  // pasaport wraps next-auth and uses its cookie auth mechanism to validate sessions.
+  // on browsers, fetch request automatically attaches the existing cookies
+  // but on next.js servers, `fetch` is pollyfilled, and does not pick up cookies
+  // we use `next/header`'s cookies() helper here
+  if (IS_SERVER) {
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    const nextHeaders = require("next/headers") as { cookies: () => ReadonlyRequestCookies };
+    headers.Cookie = nextHeaders.cookies().toString();
+  }
+
   const resp = await fetch(HTTP_ENDPOINT, {
     method: "POST",
-    headers: {
-      Accept: "application/json",
-      "Content-Type": "application/json",
-    },
+    headers,
     body: JSON.stringify({
       query: request.text,
       variables,

packages/relay/package.json

@@ -11,6 +11,7 @@
     "extends": "../../package.json"
   },
   "dependencies": {
+    "@kampus/std": "*",
     "react-relay": "15.0.0",
     "relay-runtime": "15.0.0"
   },

packages/std/index.ts

@@ -1 +1,2 @@
 export * from "./assert-never";
+export * from "./dictionary";