IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2024-12-02 05:29:42 -06:00
Code Issues Packages Projects Releases Wiki Activity

PublicDashboards: Warnings when creating a public dashboard are not properly aligned (#73794)

Browse Source
This commit is contained in:
Aditi Patel 2023-08-28 10:52:49 -05:00 committed by GitHub
parent cfe3d6346f
commit b043d8d0e8
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/CreatePublicDashboard/CreatePublicDashboard.tsx
View File

@ -18,7 +18,6 @@ import { UnsupportedTemplateVariablesAlert } from '../ModalAlerts/UnsupportedTem
import { dashboardHasTemplateVariables, getUnsupportedDashboardDatasources } from '../SharePublicDashboardUtils';
import { AcknowledgeCheckboxes } from './AcknowledgeCheckboxes';
import { Description } from './Description';
const selectors = e2eSelectors.pages.ShareDashboardModal.PublicDashboard;
@ -45,14 +44,20 @@ const CreatePublicDashboard = ({ isError }: { isError: boolean }) => {
};
return (
<div>
<p className={styles.title}>Welcome to public dashboards public preview!</p>
<Description />
<div className={styles.container}>
<div>
<p className={styles.title}>Welcome to public dashboards public preview!</p>
<p className={styles.description}>Currently, we don’t support template variables or frontend data sources</p>
</div>
{!hasWritePermissions && <NoUpsertPermissionsAlert mode="create" />}
{dashboardHasTemplateVariables(dashboard.getVariables()) && <UnsupportedTemplateVariablesAlert />}
{!!unsupportedDataSources.length && (
<UnsupportedDataSourcesAlert unsupportedDataSources={unsupportedDataSources.join(', ')} />
)}
<Form onSubmit={onCreate} validateOn="onChange" maxWidth="none">
{({
register,
@ -78,10 +83,19 @@ const CreatePublicDashboard = ({ isError }: { isError: boolean }) => {
};
const getStyles = (theme: GrafanaTheme2) => ({
container: css`
display: flex;
flex-direction: column;
gap: ${theme.spacing(4)};
`,
title: css`
font-size: ${theme.typography.h4.fontSize};
margin: ${theme.spacing(0, 0, 2)};
`,
description: css`
color: ${theme.colors.text.secondary};
margin-bottom: ${theme.spacing(0)};
`,
checkboxes: css`
margin: ${theme.spacing(0, 0, 4)};
`,

25
public/app/features/dashboard/components/ShareModal/SharePublicDashboard/CreatePublicDashboard/Description.tsx
View File

@ -1,25 +0,0 @@
import { css } from '@emotion/css';
import React from 'react';
import { GrafanaTheme2 } from '@grafana/data/src';
import { useStyles2 } from '@grafana/ui/src';
export const Description = () => {
const styles = useStyles2(getStyles);
return (
<div className={styles.container}>
<p className={styles.description}>Currently, we don’t support template variables or frontend data sources</p>
</div>
);
};
const getStyles = (theme: GrafanaTheme2) => ({
container: css`
margin-bottom: ${theme.spacing(3)};
`,
description: css`
color: ${theme.colors.text.secondary};
margin-bottom: ${theme.spacing(1)};
`,
});