From c1fe43fe64beb88bae7572cff909ead83e167ffb Mon Sep 17 00:00:00 2001
From: Mateusz Kwasniewski <kwasniewski.mateusz@gmail.com>
Date: Fri, 11 Aug 2023 12:31:23 +0200
Subject: [PATCH] fix: diff no changes (#4480)

---
 .../ChangeRequest/SegmentTooltipLink.tsx      |  6 +--
 .../events/EventDiff/EventDiff.test.tsx       | 49 +++++++++++++++++++
 .../component/events/EventDiff/EventDiff.tsx  |  4 +-
 3 files changed, 54 insertions(+), 5 deletions(-)
 create mode 100644 frontend/src/component/events/EventDiff/EventDiff.test.tsx

diff --git a/frontend/src/component/changeRequest/ChangeRequest/SegmentTooltipLink.tsx b/frontend/src/component/changeRequest/ChangeRequest/SegmentTooltipLink.tsx
index dab7c7a826..8c77f90303 100644
--- a/frontend/src/component/changeRequest/ChangeRequest/SegmentTooltipLink.tsx
+++ b/frontend/src/component/changeRequest/ChangeRequest/SegmentTooltipLink.tsx
@@ -27,15 +27,15 @@ export const SegmentDiff: FC<{
     change: IChangeRequestUpdateSegment | IChangeRequestDeleteSegment;
     currentSegment?: ISegment;
 }> = ({ change, currentSegment }) => {
-    const changeRequestStrategy =
+    const changeRequestSegment =
         change.action === 'deleteSegment' ? undefined : change.payload;
 
     return (
         <StyledCodeSection>
             <EventDiff
                 entry={{
-                    preData: omit(currentSegment, 'sortOrder'),
-                    data: changeRequestStrategy,
+                    preData: omit(currentSegment, ['createdAt', 'createdBy']),
+                    data: changeRequestSegment,
                 }}
             />
         </StyledCodeSection>
diff --git a/frontend/src/component/events/EventDiff/EventDiff.test.tsx b/frontend/src/component/events/EventDiff/EventDiff.test.tsx
new file mode 100644
index 0000000000..d4d0ea0b79
--- /dev/null
+++ b/frontend/src/component/events/EventDiff/EventDiff.test.tsx
@@ -0,0 +1,49 @@
+import { render } from 'utils/testRenderer';
+import React from 'react';
+import { screen } from '@testing-library/react';
+import EventDiff from './EventDiff';
+
+test('Show no changes', async () => {
+    render(<EventDiff entry={{ preData: [], data: [] }} />);
+
+    expect(screen.getByText('(no changes)')).toBeInTheDocument();
+});
+
+test('Show new data added diff', async () => {
+    render(<EventDiff entry={{ preData: {}, data: { segments: [] } }} />);
+
+    expect(screen.getByText('+ segments: []')).toBeInTheDocument();
+});
+
+test('Show new data removed diff', async () => {
+    render(<EventDiff entry={{ preData: { segments: [] }, data: {} }} />);
+
+    expect(screen.getByText('- segments (deleted)')).toBeInTheDocument();
+});
+
+test('Show new data changes diff', async () => {
+    render(
+        <EventDiff
+            entry={{ preData: { segments: 'a' }, data: { segments: 'b' } }}
+        />
+    );
+
+    expect(screen.getByText('- segments: "a"')).toBeInTheDocument();
+    expect(screen.getByText('+ segments: "b"')).toBeInTheDocument();
+});
+
+test('Show new data only', async () => {
+    render(
+        <EventDiff entry={{ preData: undefined, data: { segments: [] } }} />
+    );
+
+    expect(screen.getByText('{ "segments": [] }')).toBeInTheDocument();
+});
+
+test('Show old data only', async () => {
+    render(
+        <EventDiff entry={{ preData: { segments: [] }, data: undefined }} />
+    );
+
+    expect(screen.getByText('{ "segments": [] }')).toBeInTheDocument();
+});
diff --git a/frontend/src/component/events/EventDiff/EventDiff.tsx b/frontend/src/component/events/EventDiff/EventDiff.tsx
index ac9424dcf0..1e9da03a1a 100644
--- a/frontend/src/component/events/EventDiff/EventDiff.tsx
+++ b/frontend/src/component/events/EventDiff/EventDiff.tsx
@@ -96,14 +96,14 @@ const EventDiff = ({
         };
     };
 
-    let changes;
+    let changes: any[] = [];
 
     if (diffs) {
         changes = diffs
             .map(buildDiff)
             .sort(sort)
             .map(({ value }) => value);
-    } else {
+    } else if (entry.data == null || entry.preData == null) {
         // Just show the data if there is no diff yet.
         const data = entry.data || entry.preData;
         changes = [