[superset] branch master updated: fix: [explore][mixed time series chart] when user change size of view query window, query B part will disappear (#20750)

[yongjiezhao]

This is an automated email from the ASF dual-hosted git repository.

yongjiezhao pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/superset.git


The following commit(s) were added to refs/heads/master by this push:
     new 6e0ddcf848 fix: [explore][mixed time series chart] when user change 
size of view query window, query B part will disappear (#20750)
6e0ddcf848 is described below

commit 6e0ddcf84839eecb19c694f66460ffb8aa5453dd
Author: Diego Medina <diegomedin...@gmail.com>
AuthorDate: Fri Jul 22 09:39:13 2022 -0300

    fix: [explore][mixed time series chart] when user change size of view query 
window, query B part will disappear (#20750)
---
 .../src/explore/components/controls/ViewQuery.tsx           |  4 +++-
 .../src/explore/components/controls/ViewQueryModal.tsx      | 13 ++++++++++---
 2 files changed, 13 insertions(+), 4 deletions(-)

diff --git a/superset-frontend/src/explore/components/controls/ViewQuery.tsx 
b/superset-frontend/src/explore/components/controls/ViewQuery.tsx
index 5c0613195c..a8ebd975d3 100644
--- a/superset-frontend/src/explore/components/controls/ViewQuery.tsx
+++ b/superset-frontend/src/explore/components/controls/ViewQuery.tsx
@@ -45,10 +45,12 @@ interface ViewQueryProps {
 
 const StyledSyntaxContainer = styled.div`
   height: 100%;
+  display: flex;
+  flex-direction: column;
 `;
 
 const StyledSyntaxHighlighter = styled(SyntaxHighlighter)`
-  height: calc(100% - 26px); // 100% - clipboard height
+  flex: 1;
 `;
 
 const ViewQuery: React.FC<ViewQueryProps> = props => {
diff --git 
a/superset-frontend/src/explore/components/controls/ViewQueryModal.tsx 
b/superset-frontend/src/explore/components/controls/ViewQueryModal.tsx
index 6a1a36fa39..023c1e3551 100644
--- a/superset-frontend/src/explore/components/controls/ViewQueryModal.tsx
+++ b/superset-frontend/src/explore/components/controls/ViewQueryModal.tsx
@@ -17,7 +17,7 @@
  * under the License.
  */
 import React, { useEffect, useState } from 'react';
-import { ensureIsArray, t } from '@superset-ui/core';
+import { styled, ensureIsArray, t } from '@superset-ui/core';
 import Loading from 'src/components/Loading';
 import { getClientErrorObject } from 'src/utils/getClientErrorObject';
 import { getChartDataRequest } from 'src/components/Chart/chartAction';
@@ -32,6 +32,12 @@ type Result = {
   language: string;
 };
 
+const ViewQueryModalContainer = styled.div`
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+`;
+
 const ViewQueryModal: React.FC<Props> = props => {
   const [result, setResult] = useState<Result[]>([]);
   const [isLoading, setIsLoading] = useState(false);
@@ -71,14 +77,15 @@ const ViewQueryModal: React.FC<Props> = props => {
   if (error) {
     return <pre>{error}</pre>;
   }
+
   return (
-    <>
+    <ViewQueryModalContainer>
       {result.map(item =>
         item.query ? (
           <ViewQuery sql={item.query} language={item.language || undefined} />
         ) : null,
       )}
-    </>
+    </ViewQueryModalContainer>
   );
 };