From f084dc36a1a5809a6b83f73c7797739af932c13f Mon Sep 17 00:00:00 2001
From: Denys Malofeiev <77440017+Dekshut@users.noreply.github.com>
Date: Wed, 16 Feb 2022 09:10:36 +0200
Subject: [PATCH] [FIXED issue/1544] Resolved bug with export of JSON message
 to clipboard/file (#1592)

* issue/1544

* added additional data check in copyToClipboard

Co-authored-by: Roman Zabaluev <rzabaluev@provectus.com>
---
 .../lib/hooks/__tests__/useDataSaver.spec.tsx | 36 +++++++++++++------
 .../src/lib/hooks/useDataSaver.ts             |  3 +-
 2 files changed, 28 insertions(+), 11 deletions(-)

diff --git a/kafka-ui-react-app/src/lib/hooks/__tests__/useDataSaver.spec.tsx b/kafka-ui-react-app/src/lib/hooks/__tests__/useDataSaver.spec.tsx
index bc2cc9b66c..937095bcb1 100644
--- a/kafka-ui-react-app/src/lib/hooks/__tests__/useDataSaver.spec.tsx
+++ b/kafka-ui-react-app/src/lib/hooks/__tests__/useDataSaver.spec.tsx
@@ -70,7 +70,7 @@ describe('useDataSaver hook', () => {
     });
   });
 
-  it('copies the data to the clipboard', () => {
+  describe('copies the data to the clipboard', () => {
     Object.assign(navigator, {
       clipboard: {
         writeText: jest.fn(),
@@ -78,15 +78,31 @@ describe('useDataSaver hook', () => {
     });
     jest.spyOn(navigator.clipboard, 'writeText');
 
-    const HookWrapper: React.FC = () => {
-      const { copyToClipboard } = useDataSaver('topic', content);
-      useEffect(() => copyToClipboard(), []);
-      return null;
-    };
+    it('data with type Object', () => {
+      const HookWrapper: React.FC = () => {
+        const { copyToClipboard } = useDataSaver('topic', content);
+        useEffect(() => copyToClipboard(), []);
+        return null;
+      };
+      render(<HookWrapper />);
+      expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
+        JSON.stringify(content)
+      );
+    });
 
-    render(<HookWrapper />);
-    expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
-      JSON.stringify(content)
-    );
+    it('data with type String', () => {
+      const HookWrapper: React.FC = () => {
+        const { copyToClipboard } = useDataSaver(
+          'topic',
+          '{ title: "title", }'
+        );
+        useEffect(() => copyToClipboard(), []);
+        return null;
+      };
+      render(<HookWrapper />);
+      expect(navigator.clipboard.writeText).toHaveBeenCalledWith(
+        String('{ title: "title", }')
+      );
+    });
   });
 });
diff --git a/kafka-ui-react-app/src/lib/hooks/useDataSaver.ts b/kafka-ui-react-app/src/lib/hooks/useDataSaver.ts
index 25c42602f1..f39bac3205 100644
--- a/kafka-ui-react-app/src/lib/hooks/useDataSaver.ts
+++ b/kafka-ui-react-app/src/lib/hooks/useDataSaver.ts
@@ -11,7 +11,8 @@ const useDataSaver = (
   const dispatch = useAppDispatch();
   const copyToClipboard = () => {
     if (navigator.clipboard) {
-      const str = JSON.stringify(data);
+      const str =
+        typeof data === 'string' ? String(data) : JSON.stringify(data);
       navigator.clipboard.writeText(str);
       dispatch(
         alertAdded({