DataLinks: fix syntax highlighting not being applied on first render (#20199)

* Enable prism syntax for data links outside of effect

* Retrieve theme with useTheme hook
This commit is contained in:
Dominik Prokop 2019-11-06 12:41:41 +01:00 committed by GitHub
parent 54602f16a8
commit 46a4118461
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -1,14 +1,14 @@
// Libraries
import React, { FC, useContext, useEffect } from 'react';
import React, { FC } from 'react';
// @ts-ignore
import Prism from 'prismjs';
// Components
import { css } from 'emotion';
import { DataLink } from '@grafana/data';
import { ThemeContext } from '../../index';
import { Button } from '../index';
import { DataLinkEditor } from './DataLinkEditor';
import { VariableSuggestion } from './DataLinkSuggestions';
import { useTheme } from '../../themes/ThemeContext';
interface DataLinksEditorProps {
value: DataLink[];
@ -26,11 +26,8 @@ export const enableDatalinksPrismSyntax = () => {
};
export const DataLinksEditor: FC<DataLinksEditorProps> = React.memo(({ value, onChange, suggestions, maxLinks }) => {
const theme = useContext(ThemeContext);
useEffect(() => {
enableDatalinksPrismSyntax();
});
const theme = useTheme();
enableDatalinksPrismSyntax();
const onAdd = () => {
onChange(value ? [...value, { url: '', title: '' }] : [{ url: '', title: '' }]);