IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

Chore: Migrate more theme v1 usage to v2 (#58121)

Browse Source
This commit is contained in:
kay delaney
2022-11-03 13:54:18 +00:00
committed by GitHub
parent c1c8dc8749
commit f37e53f060
30 changed files with 242 additions and 253 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
public/app/features/dashboard/components/SaveDashboard/SaveDashboardErrorProxy.tsx
View File

@@ -1,9 +1,9 @@
import { css } from '@emotion/css';
import React, { useEffect } from 'react';
import { GrafanaTheme } from '@grafana/data';
import { GrafanaTheme2 } from '@grafana/data';
import { FetchError } from '@grafana/runtime';
import { Button, ConfirmModal, Modal, stylesFactory, useTheme } from '@grafana/ui';
import { Button, ConfirmModal, Modal, useStyles2 } from '@grafana/ui';
import { DashboardModel } from 'app/features/dashboard/state';
import { SaveDashboardAsButton } from './SaveDashboardButton';
@@ -77,10 +77,9 @@ export const SaveDashboardErrorProxy: React.FC<SaveDashboardErrorProxyProps> = (
);
};
const ConfirmPluginDashboardSaveModal: React.FC<SaveDashboardModalProps> = ({ onDismiss, dashboard }) => {
const theme = useTheme();
const ConfirmPluginDashboardSaveModal = ({ onDismiss, dashboard }: SaveDashboardModalProps) => {
const { onDashboardSave } = useDashboardSave(dashboard);
const styles = getConfirmPluginDashboardSaveModalStyles(theme);
const styles = useStyles2(getConfirmPluginDashboardSaveModalStyles);
return (
<Modal className={styles.modal} title="Plugin dashboard" icon="copy" isOpen={true} onDismiss={onDismiss}>
@@ -122,21 +121,21 @@ const isHandledError = (errorStatus: string) => {
}
};
const getConfirmPluginDashboardSaveModalStyles = stylesFactory((theme: GrafanaTheme) => ({
const getConfirmPluginDashboardSaveModalStyles = (theme: GrafanaTheme2) => ({
modal: css`
width: 500px;
`,
modalText: css`
font-size: ${theme.typography.heading.h4};
color: ${theme.colors.link};
margin-bottom: calc(${theme.spacing.d} * 2);
padding-top: ${theme.spacing.d};
font-size: ${theme.typography.h4.fontSize};
color: ${theme.colors.text.primary};
margin-bottom: ${theme.spacing(4)}
padding-top: ${theme.spacing(2)};
`,
modalButtonRow: css`
margin-bottom: 14px;
a,
button {
margin-right: ${theme.spacing.d};
margin-right: ${theme.spacing(2)};
}
`,
}));
});

25
public/app/features/dashboard/components/SaveDashboard/forms/SaveProvisionedDashboardForm.tsx
View File

@@ -2,14 +2,12 @@ import { css } from '@emotion/css';
import { saveAs } from 'file-saver';
import React, { useCallback, useState } from 'react';
import { GrafanaTheme } from '@grafana/data';
import { Stack } from '@grafana/experimental';
import { Button, ClipboardButton, HorizontalGroup, stylesFactory, TextArea, useTheme } from '@grafana/ui';
import { Button, ClipboardButton, HorizontalGroup, TextArea } from '@grafana/ui';
import { SaveDashboardFormProps } from '../types';
export const SaveProvisionedDashboardForm: React.FC<SaveDashboardFormProps> = ({ dashboard, onCancel }) => {
const theme = useTheme();
const [dashboardJSON, setDashboardJson] = useState(() => {
const clone = dashboard.getSaveModelClone();
delete clone.id;
@@ -23,7 +21,6 @@ export const SaveProvisionedDashboardForm: React.FC<SaveDashboardFormProps> = ({
saveAs(blob, dashboard.title + '-' + new Date().getTime() + '.json');
}, [dashboard.title, dashboardJSON]);
const styles = getStyles(theme);
return (
<>
<Stack direction="column" gap={2}>
@@ -70,14 +67,12 @@ export const SaveProvisionedDashboardForm: React.FC<SaveDashboardFormProps> = ({
);
};
const getStyles = stylesFactory((theme: GrafanaTheme) => {
return {
json: css`
height: 400px;
width: 100%;
overflow: auto;
resize: none;
font-family: monospace;
`,
};
});
const styles = {
json: css`
height: 400px;
width: 100%;
overflow: auto;
resize: none;
font-family: monospace;
`,
};