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

DataLinksEditor: updates component with the new theme model (#33389)

Browse Source
This commit is contained in:
Uchechukwu Obasi 2021-04-26 16:44:03 +01:00 committed by GitHub
parent e6a93d32c0
commit 36d3c053a9
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
packages/grafana-ui/src/components/DataLinks/DataLinkEditor.tsx
View File

@ -1,8 +1,8 @@
import React, { ChangeEvent } from 'react'; import React, { ChangeEvent } from 'react';
import { VariableSuggestion, GrafanaTheme, DataLink } from '@grafana/data'; import { VariableSuggestion, GrafanaThemeV2, DataLink } from '@grafana/data';
import { Switch } from '../Switch/Switch'; import { Switch } from '../Switch/Switch';
import { css } from '@emotion/css'; import { css } from '@emotion/css';
import { useStyles } from '../../themes/index'; import { useStyles2 } from '../../themes/index';
import { DataLinkInput } from './DataLinkInput'; import { DataLinkInput } from './DataLinkInput';
import { Field } from '../Forms/Field'; import { Field } from '../Forms/Field';
import { Input } from '../Input/Input'; import { Input } from '../Input/Input';
@ -15,20 +15,20 @@ interface DataLinkEditorProps {
onChange: (index: number, link: DataLink, callback?: () => void) => void; onChange: (index: number, link: DataLink, callback?: () => void) => void;
} }
const getStyles = (theme: GrafanaTheme) => ({ const getStyles = (theme: GrafanaThemeV2) => ({
listItem: css` listItem: css`
margin-bottom: ${theme.spacing.sm}; margin-bottom: ${theme.spacing()};
`, `,
infoText: css` infoText: css`
padding-bottom: ${theme.spacing.md}; padding-bottom: ${theme.spacing(2)};
margin-left: 66px; margin-left: 66px;
color: ${theme.colors.textWeak}; color: ${theme.colors.text.secondary};
`, `,
}); });
export const DataLinkEditor: React.FC<DataLinkEditorProps> = React.memo( export const DataLinkEditor: React.FC<DataLinkEditorProps> = React.memo(
({ index, value, onChange, suggestions, isLast }) => { ({ index, value, onChange, suggestions, isLast }) => {
const styles = useStyles(getStyles); const styles = useStyles2(getStyles);
const onUrlChange = (url: string, callback?: () => void) => { const onUrlChange = (url: string, callback?: () => void) => {
onChange(index, { ...value, url }, callback); onChange(index, { ...value, url }, callback);