From e4009a42a1d893ab1fa24ccd3bfc3fe2e8ed5e7b Mon Sep 17 00:00:00 2001
From: alexandra vargas <alexa1866@gmail.com>
Date: Thu, 8 Jan 2026 14:41:27 +0100
Subject: [PATCH] fix issue with raw results in the modal

---
 .../dashgrid/DashboardLibrary/CompatibilityModal.tsx | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/public/app/features/dashboard/dashgrid/DashboardLibrary/CompatibilityModal.tsx b/public/app/features/dashboard/dashgrid/DashboardLibrary/CompatibilityModal.tsx
index e0bd0d50701..68fba5eb028 100644
--- a/public/app/features/dashboard/dashgrid/DashboardLibrary/CompatibilityModal.tsx
+++ b/public/app/features/dashboard/dashgrid/DashboardLibrary/CompatibilityModal.tsx
@@ -128,7 +128,7 @@ export const CompatibilityModal = ({ isOpen, onDismiss, dashboardJson, datasourc
               </Text>
 
               <Text element="p">
-                <pre>{JSON.stringify(result, null, 2)}</pre>
+                <pre className={styles.jsonPreview}>{JSON.stringify(result, null, 2)}</pre>
               </Text>
             </div>
 
@@ -186,5 +186,15 @@ function getStyles(theme: GrafanaTheme2) {
       alignItems: 'center',
       justifyContent: 'center',
     }),
+    jsonPreview: css({
+      maxHeight: '400px',
+      overflow: 'auto',
+      padding: theme.spacing(2),
+      backgroundColor: theme.colors.background.secondary,
+      borderRadius: theme.shape.radius.default,
+      fontSize: theme.typography.bodySmall.fontSize,
+      whiteSpace: 'pre-wrap',
+      wordBreak: 'break-word',
+    }),
   };
 }