Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix: Fixed spacing in alert modal #22066

Merged
merged 11 commits into from
Dec 20, 2022
Merged

fix: Fixed spacing in alert modal #22066

Changes from 1 commit
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
c86219c
Fixed spacing in alert modal and translated untranslated strings
lyndsiWilliams Nov 8, 2022
120c352
Adjust styling in alert modal
lyndsiWilliams Nov 22, 2022
af49885
Aligned all elements with 16px border
lyndsiWilliams Nov 23, 2022
44a5883
Move translated text to variables
lyndsiWilliams Dec 7, 2022
03447be
Add space between input labels
lyndsiWilliams Dec 7, 2022
74e5fb5
Use useTheme hook instead of supersetTheme
lyndsiWilliams Dec 8, 2022
c5a4f50
Merge branch 'master' into lyndsi/fix-spacing-in-alert-modal
lyndsiWilliams Dec 8, 2022
aae2308
useTheme wasn't needed after all
lyndsiWilliams Dec 8, 2022
c740394
Move translated strings into a TRANSLATIONS object
lyndsiWilliams Dec 19, 2022
b34e8e6
Merge branch 'lyndsi/fix-spacing-in-alert-modal' of https://github.co…
lyndsiWilliams Dec 19, 2022
f7f6303
fix merge
lyndsiWilliams Dec 19, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 15 additions & 31 deletions superset-frontend/src/views/CRUD/alert/AlertReportModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ import {
SupersetClient,
css,
SupersetTheme,
supersetTheme,
} from '@superset-ui/core';
import rison from 'rison';
import { useSingleViewResource } from 'src/views/CRUD/hooks';
Expand Down Expand Up @@ -555,31 +556,23 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
delete data.last_value_row_json;

updateResource(update_id, data).then(response => {
if (!response) {
return;
}
if (!response) return;

addSuccessToast(t('%s updated', data.type));

if (onAdd) {
onAdd();
}
if (onAdd) onAdd();

hide();
});
}
} else if (currentAlert) {
// Create
createResource(data).then(response => {
if (!response) {
return;
}
if (!response) return;

addSuccessToast(t('%s updated', data.type));

if (onAdd) {
onAdd(response);
}
if (onAdd) onAdd(response);

hide();
});
Expand Down Expand Up @@ -614,9 +607,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
(db?: MetaObject) => {
const database = db || currentAlert?.database;

if (!database || database.label) {
return null;
}
if (!database || database.label) return null;

let result;

Expand Down Expand Up @@ -699,9 +690,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
const getDashboardData = (db?: MetaObject) => {
const dashboard = db || currentAlert?.dashboard;

if (!dashboard || dashboard.label) {
return null;
}
if (!dashboard || dashboard.label) return null;

let result;

Expand All @@ -719,9 +708,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
(chartData?: MetaObject) => {
const chart = chartData || currentAlert?.chart;

if (!chart || chart.label) {
return null;
}
if (!chart || chart.label) return null;

let result;

Expand Down Expand Up @@ -880,9 +867,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({

// Make sure notification settings has the required info
const checkNotificationSettings = () => {
if (!notificationSettings.length) {
return false;
}
if (!notificationSettings.length) return false;

let hasInfo = false;

Expand Down Expand Up @@ -1040,9 +1025,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
]);

// Show/hide
if (isHidden && show) {
setIsHidden(false);
}
if (isHidden && show) setIsHidden(false);

return (
<StyledModal
Expand Down Expand Up @@ -1128,7 +1111,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
onChange={onActiveSwitch}
checked={currentAlert ? currentAlert.active : true}
/>
<div className="switch-label">Active</div>
<div className="switch-label">{t('Active')}</div>
</StyledSwitchContainer>
</div>
<div className="column-section">
Expand Down Expand Up @@ -1285,7 +1268,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
placeholder={t('Time in seconds')}
onChange={onTimeoutVerifyChange}
/>
<span className="input-label">seconds</span>
<span className="input-label">{t('seconds')}</span>
</div>
</StyledInputContainer>
{!isReport && (
Expand All @@ -1300,7 +1283,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
placeholder={t('Time in seconds')}
onChange={onTimeoutVerifyChange}
/>
<span className="input-label">seconds</span>
<span className="input-label">{t('seconds')}</span>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I totally liked what you did here: https://github.com/apache/superset/pull/22262/files#diff-bbf91464669d98b9e120f57ce26155804f7238a277fcc30c0d805a943f6c73edR98 , could we do the same for these?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You got it! Done in this commit. (I think I got them all!)

</div>
</StyledInputContainer>
)}
Expand Down Expand Up @@ -1335,6 +1318,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
ariaLabel={t('Dashboard')}
css={{
display: contentType === 'dashboard' ? 'inline' : 'none',
margin: `${supersetTheme.gridUnit * 2}px 0`,
}}
name="dashboard"
value={
Expand Down Expand Up @@ -1374,7 +1358,7 @@ const AlertReportModal: FunctionComponent<AlertReportModalProps> = ({
checked={forceScreenshot}
onChange={onForceScreenshotChange}
>
Ignore cache when generating screenshot
{t('Ignore cache when generating screenshot')}
</StyledCheckbox>
</div>
)}
Expand Down