Save Transformed payload in logs

Author: dcodesdev

apps/backend/prisma/migrations/20250621175427_add_transformed_payload_to_webhook_logs/migration.sql

@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "WebhookLog" ADD COLUMN     "transformedPayload" JSONB;

apps/backend/prisma/schema.prisma

@@ -358,11 +358,12 @@ model WebhookLog {
   webhookId String
   Webhook   Webhook @relation(fields: [webhookId], references: [id], onDelete: Cascade)
 
-  requestBody  Json
-  responseCode Int?
-  responseBody String? @db.Text
-  error        String? @db.Text
-  duration     Int? // in milliseconds
+  requestBody        Json
+  transformedPayload Json?
+  responseCode       Int?
+  responseBody       String? @db.Text
+  error              String? @db.Text
+  duration           Int? // in milliseconds
 
   createdAt DateTime @default(now())
 

apps/backend/src/webhook/handler.ts

@@ -20,6 +20,7 @@ export const handleWebhook = async (
   let responseCode: number | undefined
   let responseBody: string | undefined
   let errorMessage: string | undefined
+  let transformResult: any = null
 
   try {
     const webhookId = req.params.webhookId
@@ -58,7 +59,7 @@ export const handleWebhook = async (
     }
 
     // Transform the payload
-    const transformResult = await transformPayload(webhook, req, webhookId)
+    transformResult = await transformPayload(webhook, req, webhookId)
     if (!transformResult.success) {
       responseCode = transformResult.status || 500
       responseBody = JSON.stringify({ error: transformResult.error })
@@ -93,6 +94,7 @@ export const handleWebhook = async (
         data: {
           webhookId: req.params.webhookId!,
           requestBody: req.body,
+          transformedPayload: transformResult?.data || null,
           responseCode,
           responseBody,
           error: errorMessage,

apps/web/src/pages/dashboard/settings/webhook-details.tsx

@@ -215,6 +215,7 @@ export function WebhookDetails() {
                     <TableHead>Timestamp</TableHead>
                     <TableHead>Duration</TableHead>
                     <TableHead>Request Body</TableHead>
+                    <TableHead>Transformed Payload</TableHead>
                     <TableHead>Response</TableHead>
                   </TableRow>
                 </TableHeader>
@@ -254,6 +255,22 @@ export function WebhookDetails() {
                           </pre>
                         </details>
                       </TableCell>
+                      <TableCell>
+                        {log.transformedPayload ? (
+                          <details className="cursor-pointer">
+                            <summary className="text-sm text-muted-foreground hover:text-foreground">
+                              View transformed
+                            </summary>
+                            <pre className="mt-2 max-w-[300px] overflow-auto rounded bg-muted p-2 text-xs">
+                              {JSON.stringify(log.transformedPayload, null, 2)}
+                            </pre>
+                          </details>
+                        ) : (
+                          <span className="text-sm text-muted-foreground">
+                            -
+                          </span>
+                        )}
+                      </TableCell>
                       <TableCell>
                         {log.error ? (
                           <details className="cursor-pointer">

package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.9.20-beta.6",
+  "version": "0.9.20-beta.7",
   "name": "letterspace",
   "private": true,
   "scripts": {