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 />;
};
const renderRowsReturned = () => {
const renderRowsReturned = (alertMessage: boolean) => {
const { results, rows, queryLimit, limitingFactor } = query;
let limitMessage = '';
const limitReached = results?.displayLimitReached;
@ -353,59 +353,70 @@ const ResultSet = ({
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 (
<ReturnedRows>
{!limitReached && !shouldUseDefaultDropdownAlert && (
<Tooltip
id="sqllab-rowcount-tooltip"
title={tooltipText}
placement="left"
>
<Label
css={css`
line-height: ${theme.typography.sizes.l}px;
`}
<>
{showRowsReturned && (
<ReturnedRows>
<Tooltip
id="sqllab-rowcount-tooltip"
title={tooltipText}
placement="left"
>
{limitMessage && (
<Icons.ExclamationCircleOutlined
css={css`
font-size: ${theme.typography.sizes.m}px;
margin-right: ${theme.gridUnit}px;
`}
/>
)}
{tn('%s row', '%s rows', rows, formattedRowCount)}
</Label>
</Tooltip>
<Label
css={css`
line-height: ${theme.typography.sizes.l}px;
`}
>
{limitMessage && (
<Icons.ExclamationCircleOutlined
css={css`
font-size: ${theme.typography.sizes.m}px;
margin-right: ${theme.gridUnit}px;
`}
/>
)}
{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>
{renderControls()}
{showSql && showSqlInline ? (
<div
css={css`
display: flex;
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;
}
`,
]}
<>
<div
css={css`
display: flex;
justify-content: space-between;
gap: ${GAP}px;
`}
>
{sql}
</Card>
{renderRowsReturned()}
</div>
<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>
{renderRowsReturned(false)}
</div>
{renderRowsReturned(true)}
</>
) : (
<>
{renderRowsReturned()}
{renderRowsReturned(false)}
{renderRowsReturned(true)}
{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
state:
currentState === QueryState.SUCCESS &&
[QueryState.FETCHING, QueryState.SUCCESS].includes(prevState)
[
QueryState.FETCHING,
QueryState.SUCCESS,
QueryState.RUNNING,
].includes(prevState)
? prevState
: currentState,
};