From b089b150d395be965c92c899031abc8c703f6cd5 Mon Sep 17 00:00:00 2001
From: SpiderMan <codemaster08240328@gmail.com>
Date: Thu, 17 Feb 2022 15:15:37 -0500
Subject: [PATCH 1/2] fix: Monospacing errors in dashboards & charts

---
 superset-frontend/src/chart/Chart.jsx            | 10 +++++++++-
 superset-frontend/src/components/Modal/Modal.tsx |  8 ++++++++
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/superset-frontend/src/chart/Chart.jsx b/superset-frontend/src/chart/Chart.jsx
index 14657cc2ddeb7..aa3637b3a11b5 100644
--- a/superset-frontend/src/chart/Chart.jsx
+++ b/superset-frontend/src/chart/Chart.jsx
@@ -113,6 +113,14 @@ const RefreshOverlayWrapper = styled.div`
   justify-content: center;
 `;
 
+const MonospaceDiv = styled.div`
+  font-family: ${({ theme }) => theme.typography.families.monospace};
+  white-space: pre;
+  word-break: break-word;
+  overflow-x: auto;
+  white-space: pre-wrap;
+`;
+
 class Chart extends React.PureComponent {
   constructor(props) {
     super(props);
@@ -222,7 +230,7 @@ class Chart extends React.PureComponent {
       <ChartErrorMessage
         chartId={chartId}
         error={error}
-        subtitle={message}
+        subtitle={<MonospaceDiv>{message}</MonospaceDiv>}
         copyText={message}
         link={queryResponse ? queryResponse.link : null}
         source={dashboardId ? 'dashboard' : 'explore'}
diff --git a/superset-frontend/src/components/Modal/Modal.tsx b/superset-frontend/src/components/Modal/Modal.tsx
index a885538204529..c12ad794db17a 100644
--- a/superset-frontend/src/components/Modal/Modal.tsx
+++ b/superset-frontend/src/components/Modal/Modal.tsx
@@ -124,6 +124,14 @@ export const StyledModal = styled(BaseModal)<StyledModalProps>`
     padding: ${({ theme }) => theme.gridUnit * 4}px;
     overflow: auto;
     ${({ resizable, height }) => !resizable && height && `height: ${height};`}
+
+    p:first-child {
+      font-family: ${({ theme }) => theme.typography.families.monospace};
+      white-space: pre;
+      word-break: break-word;
+      overflow-x: auto;
+      white-space: pre-wrap;
+    }
   }
   .ant-modal-footer {
     border-top: ${({ theme }) => theme.gridUnit / 4}px solid

From 93b3f7da03a9559dd91fad20370af5b00b54da69 Mon Sep 17 00:00:00 2001
From: SpiderMan <codemaster08240328@gmail.com>
Date: Thu, 17 Feb 2022 15:27:16 -0500
Subject: [PATCH 2/2] removed unnecessary styling

---
 superset-frontend/src/components/Modal/Modal.tsx | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/superset-frontend/src/components/Modal/Modal.tsx b/superset-frontend/src/components/Modal/Modal.tsx
index c12ad794db17a..a885538204529 100644
--- a/superset-frontend/src/components/Modal/Modal.tsx
+++ b/superset-frontend/src/components/Modal/Modal.tsx
@@ -124,14 +124,6 @@ export const StyledModal = styled(BaseModal)<StyledModalProps>`
     padding: ${({ theme }) => theme.gridUnit * 4}px;
     overflow: auto;
     ${({ resizable, height }) => !resizable && height && `height: ${height};`}
-
-    p:first-child {
-      font-family: ${({ theme }) => theme.typography.families.monospace};
-      white-space: pre;
-      word-break: break-word;
-      overflow-x: auto;
-      white-space: pre-wrap;
-    }
   }
   .ant-modal-footer {
     border-top: ${({ theme }) => theme.gridUnit / 4}px solid