fix(logging): add tRPC context to propagate URL params into logs

app/backend/src/acceptVisualChanges.ts

@@ -10,17 +10,21 @@ import {
 import { findReasonToPreventVisualChangeAcceptance } from './findReasonToPreventVisualChangeAcceptance';
 import { TRPCError } from '@trpc/server';
 import { AcceptVisualChangesInput } from './schema';
+import type { Context } from './context';
 import { getKeysFromS3 } from './getKeysFromS3';
 import { updateCommitStatus } from './updateCommitStatus';
 
-export const acceptVisualChanges = async ({
-  commitHash,
-  diffId,
-  useBaseImages,
-  bucket,
-  owner,
-  repo
-}: AcceptVisualChangesInput) => {
+export const acceptVisualChanges = async (
+  {
+    commitHash,
+    diffId,
+    useBaseImages,
+    bucket,
+    owner,
+    repo
+  }: AcceptVisualChangesInput,
+  ctx: Context
+) => {
   const reasonToPreventUpdate =
     commitHash &&
     (await findReasonToPreventVisualChangeAcceptance(owner, repo, commitHash));
@@ -58,10 +62,7 @@ export const acceptVisualChanges = async ({
   }
   logEvent('INFO', {
     event: 'VISUAL_CHANGES_ACCEPTED',
-    owner,
-    repo,
-    hash,
-    baseImagesUpdated: useBaseImages
+    ...ctx.urlParams
   });
 };
 

app/backend/src/context.ts

@@ -0,0 +1,14 @@
+import type { FetchCreateContextFnOptions } from '@trpc/server/adapters/fetch';
+
+export type Context = {
+  urlParams: Record<string, string | undefined>;
+};
+
+export const createContext = ({
+  req
+}: FetchCreateContextFnOptions): Context => {
+  const referer = req.headers.get('referer');
+  return {
+    urlParams: referer ? Object.fromEntries(new URL(referer).searchParams) : {}
+  };
+};

app/backend/src/router.ts

@@ -5,16 +5,17 @@ import {
 } from './schema';
 import { fetchCurrentPage } from './fetchCurrentPage';
 import { acceptVisualChanges } from './acceptVisualChanges';
+import type { Context } from './context';
 
-const t = initTRPC.create();
+const t = initTRPC.context<Context>().create();
 
 export const router = t.router({
   fetchCurrentPage: t.procedure
     .input(fetchCurrentPageInputSchema)
     .query(({ input }) => fetchCurrentPage(input)),
   acceptVisualChanges: t.procedure
     .input(acceptVisualChangesInputSchema)
-    .mutation(({ input }) => acceptVisualChanges(input))
+    .mutation(({ input, ctx }) => acceptVisualChanges(input, ctx))
 });
 
 export type AppRouter = typeof router;

app/backend/test/acceptVisualChanges.test.ts

@@ -146,13 +146,16 @@ describe('acceptVisualChanges', () => {
 
       const expectedBucket = 'expected-bucket-name';
       expect(
-        acceptVisualChanges({
-          commitHash: '030928b2c4b48ab4d3b57c8e0b0f7a56db768ef5',
-          bucket: expectedBucket,
-          useBaseImages: true,
-          repo: 'repo',
-          owner: 'owner'
-        })
+        acceptVisualChanges(
+          {
+            commitHash: '030928b2c4b48ab4d3b57c8e0b0f7a56db768ef5',
+            bucket: expectedBucket,
+            useBaseImages: true,
+            repo: 'repo',
+            owner: 'owner'
+          },
+          { urlParams: {} }
+        )
       ).rejects.toThrow();
 
       expect(listObjectsV2Mock).not.toHaveBeenCalled();
@@ -162,13 +165,16 @@ describe('acceptVisualChanges', () => {
 
     it('should update commit status but not base images if useBaseImages is false', async () => {
       const expectedBucket = 'expected-bucket-name';
-      await acceptVisualChanges({
-        commitHash: '030928b2c4b48ab4d3b57c8e0b0f7a56db768ef5',
-        bucket: expectedBucket,
-        useBaseImages: false,
-        repo: 'repo',
-        owner: 'owner'
-      });
+      await acceptVisualChanges(
+        {
+          commitHash: '030928b2c4b48ab4d3b57c8e0b0f7a56db768ef5',
+          bucket: expectedBucket,
+          useBaseImages: false,
+          repo: 'repo',
+          owner: 'owner'
+        },
+        { urlParams: {} }
+      );
 
       expect(listObjectsV2Mock).not.toHaveBeenCalled();
       expect(copyObjectMock).not.toHaveBeenCalled();
@@ -181,13 +187,16 @@ describe('acceptVisualChanges', () => {
         Contents: [{ Key: `${originalPathPrefix}/SMALL/pdpPage/new.png` }]
       }));
 
-      await acceptVisualChanges({
-        commitHash: '030928b2c4b48ab4d3b57c8e0b0f7a56db768ef5',
-        bucket: expectedBucket,
-        useBaseImages: true,
-        repo: 'repo',
-        owner: 'owner'
-      });
+      await acceptVisualChanges(
+        {
+          commitHash: '030928b2c4b48ab4d3b57c8e0b0f7a56db768ef5',
+          bucket: expectedBucket,
+          useBaseImages: true,
+          repo: 'repo',
+          owner: 'owner'
+        },
+        { urlParams: {} }
+      );
 
       expect(copyObjectMock).toHaveBeenCalledTimes(1);
       expect(copyObjectMock).toHaveBeenCalledWith({
@@ -209,13 +218,16 @@ describe('acceptVisualChanges', () => {
           ]
         }));
 
-      await acceptVisualChanges({
-        commitHash: '030928b2c4b48ab4d3b57c8e0b0f7a56db768ef5',
-        bucket: expectedBucket,
-        useBaseImages: true,
-        repo: 'repo',
-        owner: 'owner'
-      });
+      await acceptVisualChanges(
+        {
+          commitHash: '030928b2c4b48ab4d3b57c8e0b0f7a56db768ef5',
+          bucket: expectedBucket,
+          useBaseImages: true,
+          repo: 'repo',
+          owner: 'owner'
+        },
+        { urlParams: {} }
+      );
 
       expect(copyObjectMock).toHaveBeenCalledTimes(1);
       expect(copyObjectMock).toHaveBeenCalledWith({

app/server.ts

@@ -1,5 +1,6 @@
 import { router } from './backend/src/router';
 import { logEvent } from './backend/src/logger';
+import { createContext } from './backend/src/context';
 import { createBunHttpHandler } from 'trpc-bun-adapter';
 import { serve, file } from 'bun';
 import { join } from 'path';
@@ -11,12 +12,9 @@ const DIST_DIR = join(import.meta.dir, 'dist');
 const trpcHandler = createBunHttpHandler({
   router,
   endpoint: '/trpc',
-  onError: ({ error: { code, message, cause }, path, req }) => {
-    const referer = req.headers.get('referer');
-    const urlParams = referer
-      ? Object.fromEntries(new URL(referer).searchParams)
-      : {};
-    logEvent('ERROR', { path, code, message, cause, ...urlParams });
+  createContext,
+  onError: ({ error: { code, message, cause }, path, ctx }) => {
+    logEvent('ERROR', { path, code, message, cause, ...ctx?.urlParams });
   }
 });