diff --git a/packages/grafana-ui/src/components/index.ts b/packages/grafana-ui/src/components/index.ts index 9784ee14e5b..7d1261ef7fc 100644 --- a/packages/grafana-ui/src/components/index.ts +++ b/packages/grafana-ui/src/components/index.ts @@ -1,6 +1,6 @@ export { DeleteButton } from './DeleteButton/DeleteButton'; export { Tooltip } from './Tooltip/Tooltip'; -export { PopperController } from './Tooltip/PopperController'; +export { PopperController, PopperContent } from './Tooltip/PopperController'; export { Popper } from './Tooltip/Popper'; export { Portal } from './Portal/Portal'; export { CustomScrollbar } from './CustomScrollbar/CustomScrollbar'; diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.test.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.test.tsx new file mode 100644 index 00000000000..362b9ee531c --- /dev/null +++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.test.tsx @@ -0,0 +1,21 @@ +import React from 'react'; +import { shallow } from 'enzyme'; +import { PanelHeaderCorner } from './PanelHeaderCorner'; +import { PanelModel } from '../../state'; + +describe('Render', () => { + it('should render component', () => { + const panel = new PanelModel({}); + const links: any[] = [ + { + url: 'asd', + title: 'asd', + }, + ]; + + const wrapper = shallow(); + const instance = wrapper.instance() as PanelHeaderCorner; + + expect(instance.getInfoContent()).toBeDefined(); + }); +}); diff --git a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx index d92d4f0963d..2df808c19a5 100644 --- a/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx +++ b/public/app/features/dashboard/dashgrid/PanelHeader/PanelHeaderCorner.tsx @@ -1,7 +1,7 @@ import React, { Component } from 'react'; import { renderMarkdown } from '@grafana/data'; -import { Tooltip, ScopedVars } from '@grafana/ui'; +import { Tooltip, ScopedVars, PopperContent } from '@grafana/ui'; import { DataLink } from '@grafana/data'; import { PanelModel } from 'app/features/dashboard/state/PanelModel'; @@ -44,7 +44,7 @@ export class PanelHeaderCorner extends Component { getInfoContent = (): JSX.Element => { const { panel } = this.props; - const markdown = panel.description; + const markdown = panel.description || ''; const linkSrv = new LinkSrv(templateSrv, this.timeSrv); const interpolatedMarkdown = templateSrv.replace(markdown, panel.scopedVars); const markedInterpolatedMarkdown = renderMarkdown(interpolatedMarkdown); @@ -71,7 +71,7 @@ export class PanelHeaderCorner extends Component { ); }; - renderCornerType(infoMode: InfoMode, content: string | JSX.Element) { + renderCornerType(infoMode: InfoMode, content: PopperContent) { const theme = infoMode === InfoMode.Error ? 'error' : 'info'; return ( @@ -95,7 +95,7 @@ export class PanelHeaderCorner extends Component { } if (infoMode === InfoMode.Info || infoMode === InfoMode.Links) { - return this.renderCornerType(infoMode, this.getInfoContent()); + return this.renderCornerType(infoMode, this.getInfoContent); } return null;