pt
/
superset
mirror of https://github.com/apache/superset.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(sqllab): misplaced limit warning alert (#25306)

This commit is contained in:
JUST.in DO IT 2023-09-27 08:25:46 -07:00 committed by GitHub
parent 1716b9f8f6
commit 463962a58b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 97 additions and 78 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

169
superset-frontend/src/SqlLab/components/ResultSet/index.tsx
View File

@ -301,7 +301,7 @@ const ResultSet = ({
return <div />; return <div />;
}; };
const renderRowsReturned = () => { const renderRowsReturned = (alertMessage: boolean) => {
const { results, rows, queryLimit, limitingFactor } = query; const { results, rows, queryLimit, limitingFactor } = query;
let limitMessage = ''; let limitMessage = '';
const limitReached = results?.displayLimitReached; const limitReached = results?.displayLimitReached;
@ -353,59 +353,70 @@ const ResultSet = ({
const tooltipText = `${rowsReturnedMessage}. ${limitMessage}`; const tooltipText = `${rowsReturnedMessage}. ${limitMessage}`;
if (alertMessage) {
return (
<>
{!limitReached && shouldUseDefaultDropdownAlert && (
<div ref={calculateAlertRefHeight}>
<Alert
type="warning"
message={t('%(rows)d rows returned', { rows })}
onClose={() => setAlertIsOpen(false)}
description={t(
'The number of rows displayed is limited to %(rows)d by the dropdown.',
{ rows },
)}
/>
</div>
)}
{limitReached && (
<div ref={calculateAlertRefHeight}>
<Alert
type="warning"
onClose={() => setAlertIsOpen(false)}
message={t('%(rows)d rows returned', { rows: rowsCount })}
description={
isAdmin
? displayMaxRowsReachedMessage.withAdmin
: displayMaxRowsReachedMessage.withoutAdmin
}
/>
</div>
)}
</>
);
}
const showRowsReturned =
showSqlInline || (!limitReached && !shouldUseDefaultDropdownAlert);
return ( return (
<ReturnedRows> <>
{!limitReached && !shouldUseDefaultDropdownAlert && ( {showRowsReturned && (
<Tooltip <ReturnedRows>
id="sqllab-rowcount-tooltip" <Tooltip
title={tooltipText} id="sqllab-rowcount-tooltip"
placement="left" title={tooltipText}
> placement="left"
<Label
css={css`
line-height: ${theme.typography.sizes.l}px;
`}
> >
{limitMessage && ( <Label
<Icons.ExclamationCircleOutlined css={css`
css={css` line-height: ${theme.typography.sizes.l}px;
font-size: ${theme.typography.sizes.m}px; `}
margin-right: ${theme.gridUnit}px; >
`} {limitMessage && (
/> <Icons.ExclamationCircleOutlined
)} css={css`
{tn('%s row', '%s rows', rows, formattedRowCount)} font-size: ${theme.typography.sizes.m}px;
</Label> margin-right: ${theme.gridUnit}px;
</Tooltip> `}
/>
)}
{tn('%s row', '%s rows', rows, formattedRowCount)}
</Label>
</Tooltip>
</ReturnedRows>
)} )}
{!limitReached && shouldUseDefaultDropdownAlert && ( </>
<div ref={calculateAlertRefHeight}>
<Alert
type="warning"
message={t('%(rows)d rows returned', { rows })}
onClose={() => setAlertIsOpen(false)}
description={t(
'The number of rows displayed is limited to %(rows)d by the dropdown.',
{ rows },
)}
/>
</div>
)}
{limitReached && (
<div ref={calculateAlertRefHeight}>
<Alert
type="warning"
onClose={() => setAlertIsOpen(false)}
message={t('%(rows)d rows returned', { rows: rowsCount })}
description={
isAdmin
? displayMaxRowsReachedMessage.withAdmin
: displayMaxRowsReachedMessage.withoutAdmin
}
/>
</div>
)}
</ReturnedRows>
); );
}; };
@ -531,35 +542,39 @@ const ResultSet = ({
<ResultContainer> <ResultContainer>
{renderControls()} {renderControls()}
{showSql && showSqlInline ? ( {showSql && showSqlInline ? (
<div <>
css={css` <div
display: flex; css={css`
justify-content: space-between; display: flex;
gap: ${GAP}px; justify-content: space-between;
`} gap: ${GAP}px;
> `}
<Card
css={[
css`
height: 28px;
width: calc(100% - ${ROWS_CHIP_WIDTH + GAP}px);
code {
width: 100%;
overflow: hidden;
white-space: nowrap !important;
text-overflow: ellipsis;
display: block;
}
`,
]}
> >
{sql} <Card
</Card> css={[
{renderRowsReturned()} css`
</div> height: 28px;
width: calc(100% - ${ROWS_CHIP_WIDTH + GAP}px);
code {
width: 100%;
overflow: hidden;
white-space: nowrap !important;
text-overflow: ellipsis;
display: block;
}
`,
]}
>
{sql}
</Card>
{renderRowsReturned(false)}
</div>
{renderRowsReturned(true)}
</>
) : ( ) : (
<> <>
{renderRowsReturned()} {renderRowsReturned(false)}
{renderRowsReturned(true)}
{sql} {sql}
</> </>
)} )}

6
superset-frontend/src/SqlLab/reducers/sqlLab.js
View File

@ -637,7 +637,11 @@ export default function sqlLabReducer(state = {}, action) {
// when it started fetching or finished rendering results // when it started fetching or finished rendering results
state: state:
currentState === QueryState.SUCCESS && currentState === QueryState.SUCCESS &&
[QueryState.FETCHING, QueryState.SUCCESS].includes(prevState) [
QueryState.FETCHING,
QueryState.SUCCESS,
QueryState.RUNNING,
].includes(prevState)
? prevState ? prevState
: currentState, : currentState,
}; };