diff --git a/superset-frontend/src/SqlLab/components/ResultSet.tsx b/superset-frontend/src/SqlLab/components/ResultSet.tsx index 9dc08a435e7f..f0c3d47de26f 100644 --- a/superset-frontend/src/SqlLab/components/ResultSet.tsx +++ b/superset-frontend/src/SqlLab/components/ResultSet.tsx @@ -27,7 +27,7 @@ import shortid from 'shortid'; import rison from 'rison'; import { styled, t, makeApi } from '@superset-ui/core'; import { debounce } from 'lodash'; - +import Icon from 'src/components/Icon'; import ErrorMessageWithStackTrace from 'src/components/ErrorMessage/ErrorMessageWithStackTrace'; import { SaveDatasetModal } from 'src/SqlLab/components/SaveDatasetModal'; import { put as updateDatset } from 'src/api/dataset'; @@ -100,11 +100,23 @@ const MonospaceDiv = styled.div` white-space: pre-wrap; `; +const ReturnedRows = styled.div` + font-size: 13px; + line-height: 24px; + .returnedRowsImage { + color: ${({ theme }) => theme.colors.warning.base}; + vertical-align: bottom; + margin-right: ${({ theme }) => theme.gridUnit * 2}px; + } + .limitMessage { + color: ${({ theme }) => theme.colors.secondary.light1}; + margin-left: ${({ theme }) => theme.gridUnit * 2}px; + } +`; const ResultSetControls = styled.div` display: flex; justify-content: space-between; padding: ${({ theme }) => 2 * theme.gridUnit}px 0; - position: fixed; `; const ResultSetButtons = styled.div` @@ -498,6 +510,28 @@ export default class ResultSet extends React.PureComponent< return
; } + renderRowsReturned() { + const { results, rows } = this.props.query; + const limitReached = results?.displayLimitReached; + const limitWarning = ; + return ( + + {limitReached && limitWarning} + {t(`%s rows returned`, rows)} + {limitReached && ( + + {t( + `It appears that the number of rows in the query results displayed + was limited on the server side to + the %s limit.`, + rows, + )} + + )} + + ); + } + render() { const { query } = this.props; const height = Math.max( @@ -587,6 +621,7 @@ export default class ResultSet extends React.PureComponent< return ( <> {this.renderControls()} + {this.renderRowsReturned()} {sql} theme.gridUnit * 2}px; } diff --git a/superset-frontend/src/SqlLab/components/SqlEditor.jsx b/superset-frontend/src/SqlLab/components/SqlEditor.jsx index fb85482cf15a..c355a5a6add5 100644 --- a/superset-frontend/src/SqlLab/components/SqlEditor.jsx +++ b/superset-frontend/src/SqlLab/components/SqlEditor.jsx @@ -30,9 +30,6 @@ import debounce from 'lodash/debounce'; import throttle from 'lodash/throttle'; import StyledModal from 'src/common/components/Modal'; import Mousetrap from 'mousetrap'; - -import { Tooltip } from 'src/common/components/Tooltip'; -import Label from 'src/components/Label'; import Button from 'src/components/Button'; import Timer from 'src/components/Timer'; import { @@ -563,23 +560,6 @@ class SqlEditor extends React.PureComponent { renderEditorBottomBar() { const { queryEditor: qe } = this.props; - let limitWarning = null; - if (this.props.latestQuery?.results?.displayLimitReached) { - limitWarning = ( - - - - ); - } const { allow_ctas: allowCTAS, allow_cvas: allowCVAS } = this.props.database || {}; @@ -650,7 +630,6 @@ class SqlEditor extends React.PureComponent { /> )} - {limitWarning} @@ -690,7 +669,6 @@ class SqlEditor extends React.PureComponent { - {limitWarning} diff --git a/superset-frontend/src/SqlLab/main.less b/superset-frontend/src/SqlLab/main.less index af08c64b8e0b..4bb4507f13dc 100644 --- a/superset-frontend/src/SqlLab/main.less +++ b/superset-frontend/src/SqlLab/main.less @@ -55,7 +55,8 @@ body { height: 100%; position: relative; background-color: @lightest; - overflow: auto; + overflow-x: auto; + overflow-y: hidden; > .ant-tabs-tabpane { position: absolute; diff --git a/superset-frontend/src/SqlLab/types.ts b/superset-frontend/src/SqlLab/types.ts index 4189a297579c..415c6144927c 100644 --- a/superset-frontend/src/SqlLab/types.ts +++ b/superset-frontend/src/SqlLab/types.ts @@ -38,6 +38,7 @@ export type Query = { link?: string; progress: number; results: { + displayLimitReached: boolean; columns: Column[]; data: Record[]; expanded_columns: Column[]; @@ -60,4 +61,6 @@ export type Query = { tempTable: string; trackingUrl: string | null; templateParams: any; + rows: number; + queryLimit: number; }; diff --git a/superset-frontend/src/components/FilterableTable/FilterableTable.tsx b/superset-frontend/src/components/FilterableTable/FilterableTable.tsx index 0a86c5e0ea57..86dca4357594 100644 --- a/superset-frontend/src/components/FilterableTable/FilterableTable.tsx +++ b/superset-frontend/src/components/FilterableTable/FilterableTable.tsx @@ -84,7 +84,7 @@ const JSON_TREE_THEME = { const StyledFilterableTable = styled.div` overflow-x: auto; - margin-top: ${({ theme }) => theme.gridUnit * 12}px; + margin-top: ${({ theme }) => theme.gridUnit * 2}px; `; // when more than MAX_COLUMNS_FOR_TABLE are returned, switch from table to grid view