From b7d79c4226b0a8fec446d3a918d7ca983b17e33a Mon Sep 17 00:00:00 2001 From: Tony Date: Wed, 7 Apr 2021 15:47:10 -0700 Subject: [PATCH 1/6] Added selected state to web chat log items --- .../WebChatLog/WebChatLogContent.tsx | 37 ++++++++++++++++--- .../src/recoilModel/dispatchers/webchat.ts | 12 +++++- Composer/packages/types/src/server.ts | 3 ++ 3 files changed, 44 insertions(+), 8 deletions(-) diff --git a/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx b/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx index ac1dd52c3b..bcbe7394f7 100644 --- a/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx +++ b/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx @@ -42,6 +42,10 @@ const logPane = css` box-sizing: border-box; `; +const itemIsSelected = (item: ConversationTrafficItem, currentInspectionData: WebChatInspectionData | undefined) => { + return item.id === currentInspectionData?.item?.id; +}; + // R12: We are showing Errors from the root bot only. export const WebChatLogContent: React.FC = ({ isActive }) => { const currentProjectId = useRecoilValue(rootBotProjectIdSelector); @@ -80,16 +84,37 @@ export const WebChatLogContent: React.FC = ({ isActive ); const renderLogItem = useCallback( - (item: ConversationTrafficItem, index: number) => { + (item: ConversationTrafficItem, index: number, inspectionData: WebChatInspectionData | undefined) => { switch (item.trafficType) { case 'activity': - return ; + return ( + + ); case 'network': - return ; + return ( + + ); case 'networkError': - return ; + return ( + + ); default: return null; @@ -101,10 +126,10 @@ export const WebChatLogContent: React.FC = ({ isActive const displayedTraffic = useMemo(() => { const sortedTraffic = [...rawWebChatTraffic] .sort((t1, t2) => t1.timestamp - t2.timestamp) - .map((t, i) => renderLogItem(t, i)); + .map((t, i) => renderLogItem(t, i, inspectionData)); setLogItemCount(sortedTraffic.length); return sortedTraffic; - }, [rawWebChatTraffic, renderLogItem]); + }, [inspectionData, rawWebChatTraffic, renderLogItem]); const setInspectionData = (data: WebChatInspectionData) => { if (currentProjectId) { diff --git a/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts b/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts index 4e1b5e350a..b475f5be94 100644 --- a/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts +++ b/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts @@ -4,10 +4,18 @@ import { ConversationTrafficItem } from '@botframework-composer/types'; import { useRecoilCallback, CallbackInterface } from 'recoil'; +import { v4 as uuid } from 'uuid'; import { webChatTrafficState, webChatInspectionDataState, isWebChatPanelVisibleState } from '../atoms'; import { WebChatInspectionData } from '../types'; +const addIdToTrafficItem = (item: ConversationTrafficItem) => { + if (!item.id) { + item.id = uuid(); + } + return item; +}; + export const webChatLogDispatcher = () => { const clearWebChatLogs = useRecoilCallback((callbackHelpers: CallbackInterface) => (projectId: string) => { const { set } = callbackHelpers; @@ -27,9 +35,9 @@ export const webChatLogDispatcher = () => { const { set } = callbackHelpers; set(webChatTrafficState(projectId), (currentTraffic) => { if (Array.isArray(traffic)) { - return [...currentTraffic, ...traffic]; + return [...currentTraffic, ...traffic.map((item) => addIdToTrafficItem(item))]; } else { - return [...currentTraffic, traffic]; + return [...currentTraffic, addIdToTrafficItem(traffic)]; } }); } diff --git a/Composer/packages/types/src/server.ts b/Composer/packages/types/src/server.ts index 7a932e745d..67fb4244c5 100644 --- a/Composer/packages/types/src/server.ts +++ b/Composer/packages/types/src/server.ts @@ -65,6 +65,7 @@ export type NetworkTrafficResponse = { }; export type ConversationNetworkTrafficItem = { + id?: string; request: NetworkTrafficRequest; response: NetworkTrafficResponse; timestamp: number; @@ -78,11 +79,13 @@ export type ConversationActivityTraffic = { export type ConversationActivityTrafficItem = { activity: Activity; + id?: string; timestamp: number; trafficType: 'activity'; }; export type ConversationNetworkErrorItem = { + id?: string; error: { message: string; details?: string; From 689c4df376764ebd90268bd48dfcb7e38de80a96 Mon Sep 17 00:00:00 2001 From: Tony Date: Thu, 8 Apr 2021 10:19:04 -0700 Subject: [PATCH 2/6] Latest item in log now selected if nothing is selected. --- .../WebChatLog/WebChatLogContent.tsx | 26 +++++++++++++++++++ .../src/recoilModel/dispatchers/webchat.ts | 1 + 2 files changed, 27 insertions(+) diff --git a/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx b/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx index bcbe7394f7..74a7c6e861 100644 --- a/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx +++ b/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx @@ -7,6 +7,7 @@ import React, { useMemo, useEffect, useState, useRef, useCallback } from 'react' import { useRecoilValue } from 'recoil'; import { ConversationTrafficItem } from '@botframework-composer/types/src'; import formatMessage from 'format-message'; +import debounce from 'lodash/debounce'; import { dispatcherState, @@ -63,9 +64,34 @@ export const WebChatLogContent: React.FC = ({ isActive } }; + const performInspection = useRef( + debounce((trafficItem: ConversationTrafficItem) => { + if (currentProjectId) { + if (trafficItem?.trafficType === 'network') { + // default to inspecting the request body + setWebChatInspectionData(currentProjectId, { item: trafficItem, mode: 'request' }); + } else { + setWebChatInspectionData(currentProjectId, { item: trafficItem }); + } + } + }, 500) + ).current; + + const inspectLatestLogMessage = () => { + // inspect latest log message if nothing is being inspected + if (!inspectionData && currentProjectId) { + const sortedTraffic = [...rawWebChatTraffic].sort((t1, t2) => t1.timestamp - t2.timestamp); + const latestTrafficItem = sortedTraffic.pop(); + if (latestTrafficItem) { + performInspection(latestTrafficItem); + } + } + }; + useEffect(() => { if (navigateToLatestEntry && isActive) { navigateToNewestLogEntry(); + inspectLatestLogMessage(); navigateToLatestEntryWhenActive(false); } }, [isActive, navigateToLatestEntry]); diff --git a/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts b/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts index b475f5be94..79933d0c00 100644 --- a/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts +++ b/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts @@ -20,6 +20,7 @@ export const webChatLogDispatcher = () => { const clearWebChatLogs = useRecoilCallback((callbackHelpers: CallbackInterface) => (projectId: string) => { const { set } = callbackHelpers; set(webChatTrafficState(projectId), []); + set(webChatInspectionDataState(projectId), undefined); // clear the inspection panel }); const setWebChatPanelVisibility = useRecoilCallback((callbackHelpers: CallbackInterface) => (value: boolean) => { From 0c1e433b500dd861ccb9a237ed63baf72fb0cd14 Mon Sep 17 00:00:00 2001 From: Tony Date: Thu, 8 Apr 2021 13:47:51 -0700 Subject: [PATCH 3/6] Moved log entry sorting to dispatcher --- .../TabExtensions/WebChatLog/WebChatLogContent.tsx | 11 ++++------- .../client/src/recoilModel/dispatchers/webchat.ts | 6 ++++-- 2 files changed, 8 insertions(+), 9 deletions(-) diff --git a/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx b/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx index 74a7c6e861..e2ee4773a2 100644 --- a/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx +++ b/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx @@ -80,8 +80,7 @@ export const WebChatLogContent: React.FC = ({ isActive const inspectLatestLogMessage = () => { // inspect latest log message if nothing is being inspected if (!inspectionData && currentProjectId) { - const sortedTraffic = [...rawWebChatTraffic].sort((t1, t2) => t1.timestamp - t2.timestamp); - const latestTrafficItem = sortedTraffic.pop(); + const latestTrafficItem = [...rawWebChatTraffic].pop(); if (latestTrafficItem) { performInspection(latestTrafficItem); } @@ -150,11 +149,9 @@ export const WebChatLogContent: React.FC = ({ isActive ); const displayedTraffic = useMemo(() => { - const sortedTraffic = [...rawWebChatTraffic] - .sort((t1, t2) => t1.timestamp - t2.timestamp) - .map((t, i) => renderLogItem(t, i, inspectionData)); - setLogItemCount(sortedTraffic.length); - return sortedTraffic; + const renderedTraffic = [...rawWebChatTraffic].map((t, i) => renderLogItem(t, i, inspectionData)); + setLogItemCount(renderedTraffic.length); + return renderedTraffic; }, [inspectionData, rawWebChatTraffic, renderLogItem]); const setInspectionData = (data: WebChatInspectionData) => { diff --git a/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts b/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts index 79933d0c00..d167b85175 100644 --- a/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts +++ b/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts @@ -36,9 +36,11 @@ export const webChatLogDispatcher = () => { const { set } = callbackHelpers; set(webChatTrafficState(projectId), (currentTraffic) => { if (Array.isArray(traffic)) { - return [...currentTraffic, ...traffic.map((item) => addIdToTrafficItem(item))]; + return [...currentTraffic, ...traffic.map((item) => addIdToTrafficItem(item))].sort( + (t1, t2) => t1.timestamp - t2.timestamp + ); } else { - return [...currentTraffic, addIdToTrafficItem(traffic)]; + return [...currentTraffic, addIdToTrafficItem(traffic)].sort((t1, t2) => t1.timestamp - t2.timestamp); } }); } From 33cb931b0d9df758187dd97248c1db0b33e377e7 Mon Sep 17 00:00:00 2001 From: Tony Date: Fri, 9 Apr 2021 10:33:56 -0700 Subject: [PATCH 4/6] Made `id` property mandatory --- .../packages/client/src/components/WebChat/WebChatPanel.tsx | 3 +++ .../TabExtensions/WebChatLog/WebChatLogContent.tsx | 4 ++-- .../packages/server/src/middleware/logNetworkTraffic.ts | 2 ++ Composer/packages/types/src/server.ts | 6 +++--- 4 files changed, 10 insertions(+), 5 deletions(-) diff --git a/Composer/packages/client/src/components/WebChat/WebChatPanel.tsx b/Composer/packages/client/src/components/WebChat/WebChatPanel.tsx index 022ef29975..fb66cd27f2 100644 --- a/Composer/packages/client/src/components/WebChat/WebChatPanel.tsx +++ b/Composer/packages/client/src/components/WebChat/WebChatPanel.tsx @@ -79,6 +79,7 @@ export const WebChatPanel: React.FC = ({ projectId, data.activities.map((a) => ({ activity: a, + id: '', timestamp: new Date(a.timestamp || Date.now()).getTime(), trafficType: data.trafficType, })) @@ -104,6 +105,7 @@ export const WebChatPanel: React.FC = ({ error: { message: formatMessage('An error occurred connecting initializing the DirectLine server'), }, + id: '', request: { route: 'conversations/ws/port', method: 'GET', payload: {} }, response: { payload: response.data, statusCode: response.status }, timestamp: Date.now(), @@ -211,6 +213,7 @@ export const WebChatPanel: React.FC = ({ error: { message: formatMessage('An error occurred saving transcripts'), }, + id: '', request: { route: 'saveTranscripts/', method: '', payload: {} }, response: { payload: ex, statusCode: 400 }, timestamp: Date.now(), diff --git a/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx b/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx index e2ee4773a2..b4d7e27aec 100644 --- a/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx +++ b/Composer/packages/client/src/pages/design/DebugPanel/TabExtensions/WebChatLog/WebChatLogContent.tsx @@ -43,7 +43,7 @@ const logPane = css` box-sizing: border-box; `; -const itemIsSelected = (item: ConversationTrafficItem, currentInspectionData: WebChatInspectionData | undefined) => { +const itemIsSelected = (item: ConversationTrafficItem, currentInspectionData?: WebChatInspectionData) => { return item.id === currentInspectionData?.item?.id; }; @@ -109,7 +109,7 @@ export const WebChatLogContent: React.FC = ({ isActive ); const renderLogItem = useCallback( - (item: ConversationTrafficItem, index: number, inspectionData: WebChatInspectionData | undefined) => { + (item: ConversationTrafficItem, index: number, inspectionData?: WebChatInspectionData) => { switch (item.trafficType) { case 'activity': return ( diff --git a/Composer/packages/server/src/middleware/logNetworkTraffic.ts b/Composer/packages/server/src/middleware/logNetworkTraffic.ts index b9126cb977..7bf8c6deac 100644 --- a/Composer/packages/server/src/middleware/logNetworkTraffic.ts +++ b/Composer/packages/server/src/middleware/logNetworkTraffic.ts @@ -25,6 +25,7 @@ export function logNetworkTraffic(req: Request, res: Response, next?: NextFuncti details: error.details, message: error.message, }, + id: '', request: { method: req.method, payload: req.body, route: req.originalUrl }, response: { payload: JSON.parse((res as any).sentData || '{}'), @@ -36,6 +37,7 @@ export function logNetworkTraffic(req: Request, res: Response, next?: NextFuncti } else { // a successful response was sent to the client data = { + id: '', request: { method: req.method, payload: req.body, route: req.originalUrl }, response: { payload: JSON.parse((res as any).sentData || '{}'), diff --git a/Composer/packages/types/src/server.ts b/Composer/packages/types/src/server.ts index 67fb4244c5..6ee8b1a508 100644 --- a/Composer/packages/types/src/server.ts +++ b/Composer/packages/types/src/server.ts @@ -65,7 +65,7 @@ export type NetworkTrafficResponse = { }; export type ConversationNetworkTrafficItem = { - id?: string; + id: string; request: NetworkTrafficRequest; response: NetworkTrafficResponse; timestamp: number; @@ -79,13 +79,13 @@ export type ConversationActivityTraffic = { export type ConversationActivityTrafficItem = { activity: Activity; - id?: string; + id: string; timestamp: number; trafficType: 'activity'; }; export type ConversationNetworkErrorItem = { - id?: string; + id: string; error: { message: string; details?: string; From 68c6db3bc5c84d5868427170ace5414b493e8773 Mon Sep 17 00:00:00 2001 From: Tony Date: Fri, 9 Apr 2021 11:04:53 -0700 Subject: [PATCH 5/6] Fixed tests --- .../src/pages/design/__tests__/WebChatLogContent.test.tsx | 6 ++++-- .../pages/design/__tests__/WebChatLogItemHeader.test.tsx | 3 +++ .../src/recoilModel/dispatchers/__tests__/webchat.test.tsx | 4 ++++ 3 files changed, 11 insertions(+), 2 deletions(-) diff --git a/Composer/packages/client/src/pages/design/__tests__/WebChatLogContent.test.tsx b/Composer/packages/client/src/pages/design/__tests__/WebChatLogContent.test.tsx index 67ed5f93c9..5558e43809 100644 --- a/Composer/packages/client/src/pages/design/__tests__/WebChatLogContent.test.tsx +++ b/Composer/packages/client/src/pages/design/__tests__/WebChatLogContent.test.tsx @@ -31,8 +31,9 @@ describe('', () => { }); set(webChatTrafficState(rootBotId), [ { - trafficType: 'activity', activity: {} as any, + id: '', + trafficType: 'activity', timestamp: Date.now(), }, ]); @@ -49,8 +50,9 @@ describe('', () => { }); set(webChatTrafficState(rootBotId), [ { - trafficType: 'activity', activity: {} as any, + id: '', + trafficType: 'activity', timestamp: Date.now(), }, ]); diff --git a/Composer/packages/client/src/pages/design/__tests__/WebChatLogItemHeader.test.tsx b/Composer/packages/client/src/pages/design/__tests__/WebChatLogItemHeader.test.tsx index 7ceede00bf..69240c6892 100644 --- a/Composer/packages/client/src/pages/design/__tests__/WebChatLogItemHeader.test.tsx +++ b/Composer/packages/client/src/pages/design/__tests__/WebChatLogItemHeader.test.tsx @@ -35,6 +35,7 @@ describe('', () => { error: { message: 'Error validating Microsoft App ID and Password', }, + id: '', timestamp: Date.now(), trafficType: 'networkError', request: { @@ -61,6 +62,7 @@ describe('', () => { error: { message: 'Error validating Microsoft App ID and Password', }, + id: '', timestamp: Date.now(), trafficType: 'networkError', request: { @@ -88,6 +90,7 @@ describe('', () => { error: { message: 'Error validating Microsoft App ID and Password', }, + id: '', timestamp: Date.now(), trafficType: 'networkError', request: { diff --git a/Composer/packages/client/src/recoilModel/dispatchers/__tests__/webchat.test.tsx b/Composer/packages/client/src/recoilModel/dispatchers/__tests__/webchat.test.tsx index 6a433e6de6..db6b95706a 100644 --- a/Composer/packages/client/src/recoilModel/dispatchers/__tests__/webchat.test.tsx +++ b/Composer/packages/client/src/recoilModel/dispatchers/__tests__/webchat.test.tsx @@ -51,6 +51,7 @@ describe('web chat dispatcher', () => { it('should append a single web chat traffic item to the log', async () => { const trafficItem = { activity: {} as any, + id: '', timestamp: Date.now(), trafficType: 'activity' as 'activity', }; @@ -64,11 +65,13 @@ describe('web chat dispatcher', () => { it('should append multiple web chat traffic items to the log', async () => { const trafficItem1 = { activity: {} as any, + id: '', timestamp: Date.now(), trafficType: 'activity' as 'activity', }; const trafficItem2 = { activity: {} as any, + id: '', timestamp: Date.now() + 5, trafficType: 'activity' as 'activity', }; @@ -82,6 +85,7 @@ describe('web chat dispatcher', () => { it('should clear traffic from the log', async () => { const trafficItem = { activity: {} as any, + id: '', timestamp: Date.now(), trafficType: 'activity' as 'activity', }; From 0b34b5e2c5a040b6e1620f2d836f7d42f35a7a75 Mon Sep 17 00:00:00 2001 From: Tony Date: Fri, 9 Apr 2021 14:03:29 -0700 Subject: [PATCH 6/6] Moved Web Chat log item ID generation to instantiation --- .../client/src/components/WebChat/WebChatPanel.tsx | 7 ++++--- .../client/src/recoilModel/dispatchers/webchat.ts | 14 ++------------ .../server/src/middleware/logNetworkTraffic.ts | 5 +++-- 3 files changed, 9 insertions(+), 17 deletions(-) diff --git a/Composer/packages/client/src/components/WebChat/WebChatPanel.tsx b/Composer/packages/client/src/components/WebChat/WebChatPanel.tsx index fb66cd27f2..a96fe143c0 100644 --- a/Composer/packages/client/src/components/WebChat/WebChatPanel.tsx +++ b/Composer/packages/client/src/components/WebChat/WebChatPanel.tsx @@ -10,6 +10,7 @@ import { } from '@botframework-composer/types'; import { AxiosResponse } from 'axios'; import formatMessage from 'format-message'; +import { v4 as uuid } from 'uuid'; import TelemetryClient from '../../telemetry/TelemetryClient'; import { BotStatus } from '../../constants'; @@ -79,7 +80,7 @@ export const WebChatPanel: React.FC = ({ projectId, data.activities.map((a) => ({ activity: a, - id: '', + id: uuid(), timestamp: new Date(a.timestamp || Date.now()).getTime(), trafficType: data.trafficType, })) @@ -105,7 +106,7 @@ export const WebChatPanel: React.FC = ({ error: { message: formatMessage('An error occurred connecting initializing the DirectLine server'), }, - id: '', + id: uuid(), request: { route: 'conversations/ws/port', method: 'GET', payload: {} }, response: { payload: response.data, statusCode: response.status }, timestamp: Date.now(), @@ -213,7 +214,7 @@ export const WebChatPanel: React.FC = ({ error: { message: formatMessage('An error occurred saving transcripts'), }, - id: '', + id: uuid(), request: { route: 'saveTranscripts/', method: '', payload: {} }, response: { payload: ex, statusCode: 400 }, timestamp: Date.now(), diff --git a/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts b/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts index d167b85175..7d9f02d82d 100644 --- a/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts +++ b/Composer/packages/client/src/recoilModel/dispatchers/webchat.ts @@ -4,18 +4,10 @@ import { ConversationTrafficItem } from '@botframework-composer/types'; import { useRecoilCallback, CallbackInterface } from 'recoil'; -import { v4 as uuid } from 'uuid'; import { webChatTrafficState, webChatInspectionDataState, isWebChatPanelVisibleState } from '../atoms'; import { WebChatInspectionData } from '../types'; -const addIdToTrafficItem = (item: ConversationTrafficItem) => { - if (!item.id) { - item.id = uuid(); - } - return item; -}; - export const webChatLogDispatcher = () => { const clearWebChatLogs = useRecoilCallback((callbackHelpers: CallbackInterface) => (projectId: string) => { const { set } = callbackHelpers; @@ -36,11 +28,9 @@ export const webChatLogDispatcher = () => { const { set } = callbackHelpers; set(webChatTrafficState(projectId), (currentTraffic) => { if (Array.isArray(traffic)) { - return [...currentTraffic, ...traffic.map((item) => addIdToTrafficItem(item))].sort( - (t1, t2) => t1.timestamp - t2.timestamp - ); + return [...currentTraffic, ...traffic].sort((t1, t2) => t1.timestamp - t2.timestamp); } else { - return [...currentTraffic, addIdToTrafficItem(traffic)].sort((t1, t2) => t1.timestamp - t2.timestamp); + return [...currentTraffic, traffic].sort((t1, t2) => t1.timestamp - t2.timestamp); } }); } diff --git a/Composer/packages/server/src/middleware/logNetworkTraffic.ts b/Composer/packages/server/src/middleware/logNetworkTraffic.ts index 7bf8c6deac..175cd5a552 100644 --- a/Composer/packages/server/src/middleware/logNetworkTraffic.ts +++ b/Composer/packages/server/src/middleware/logNetworkTraffic.ts @@ -3,6 +3,7 @@ import { NextFunction, Request, Response } from 'express'; import { ConversationNetworkErrorItem, ConversationNetworkTrafficItem } from '@botframework-composer/types'; +import { v4 as uuid } from 'uuid'; import { WebSocketServer } from '../directline/utils/webSocketServer'; @@ -25,7 +26,7 @@ export function logNetworkTraffic(req: Request, res: Response, next?: NextFuncti details: error.details, message: error.message, }, - id: '', + id: uuid(), request: { method: req.method, payload: req.body, route: req.originalUrl }, response: { payload: JSON.parse((res as any).sentData || '{}'), @@ -37,7 +38,7 @@ export function logNetworkTraffic(req: Request, res: Response, next?: NextFuncti } else { // a successful response was sent to the client data = { - id: '', + id: uuid(), request: { method: req.method, payload: req.body, route: req.originalUrl }, response: { payload: JSON.parse((res as any).sentData || '{}'),