From ac671110a3d5b6d7eed26e3c94a787ae32d833bd Mon Sep 17 00:00:00 2001
From: Ali BARIN <ali.barin53@gmail.com>
Date: Tue, 3 Jan 2023 21:04:01 +0100
Subject: [PATCH] fix: wrap lines when showing error details

---
 packages/web/src/components/AddAppConnection/index.tsx | 6 +++++-
 packages/web/src/components/TestSubstep/index.tsx      | 2 +-
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/packages/web/src/components/AddAppConnection/index.tsx b/packages/web/src/components/AddAppConnection/index.tsx
index e1581b3b..bf5c3b7b 100644
--- a/packages/web/src/components/AddAppConnection/index.tsx
+++ b/packages/web/src/components/AddAppConnection/index.tsx
@@ -116,7 +116,11 @@ export default function AddAppConnection(
           sx={{ mt: 1, fontWeight: 500, wordBreak: 'break-all' }}
         >
           {error.message}
-          {error.details && <pre>{JSON.stringify(error.details, null, 2)}</pre>}
+          {error.details && (
+            <pre style={{ whiteSpace: 'pre-wrap' }}>
+              {JSON.stringify(error.details, null, 2)}
+            </pre>
+          )}
         </Alert>
       )}
 
diff --git a/packages/web/src/components/TestSubstep/index.tsx b/packages/web/src/components/TestSubstep/index.tsx
index b7c3c764..f76f2f3a 100644
--- a/packages/web/src/components/TestSubstep/index.tsx
+++ b/packages/web/src/components/TestSubstep/index.tsx
@@ -32,7 +32,7 @@ function serializeErrors(graphQLErrors: any) {
       return {
         ...error,
         message: (
-          <pre style={{ margin: 0 }}>
+          <pre style={{ margin: 0, whiteSpace: 'pre-wrap' }}>
             {JSON.stringify(JSON.parse(error.message as string), null, 2)}
           </pre>
         ),