mirror of https://github.com/grafana/grafana
parent
cfae98fae2
commit
cda7897323
@ -0,0 +1,59 @@ |
||||
import React, { PureComponent } from 'react'; |
||||
import Remarkable from 'remarkable'; |
||||
import { getBackendSrv } from '../../services/backend_srv'; |
||||
import { DataSource } from 'app/types'; |
||||
|
||||
interface Props { |
||||
dataSource: DataSource; |
||||
type: string; |
||||
} |
||||
|
||||
interface State { |
||||
isError: boolean; |
||||
isLoading: boolean; |
||||
help: any; |
||||
} |
||||
|
||||
export default class PanelHelp extends PureComponent<Props, State> { |
||||
componentDidMount(): void { |
||||
this.loadHelp(); |
||||
} |
||||
|
||||
loadHelp = () => { |
||||
const { dataSource, type } = this.props; |
||||
this.setState({ isLoading: true }); |
||||
|
||||
getBackendSrv() |
||||
.get(`/api/plugins/${dataSource.meta.id}/markdown/${type}`) |
||||
.then(response => { |
||||
const markdown = new Remarkable(); |
||||
const helpHtml = markdown.render(response); |
||||
|
||||
this.setState({ |
||||
isError: false, |
||||
isLoading: false, |
||||
help: helpHtml, |
||||
}); |
||||
}) |
||||
.catch(() => { |
||||
this.setState({ |
||||
isError: true, |
||||
isLoading: false, |
||||
}); |
||||
}); |
||||
}; |
||||
|
||||
render() { |
||||
const { isError, isLoading, help } = this.state; |
||||
|
||||
if (isLoading) { |
||||
return <h2>Loading help...</h2>; |
||||
} |
||||
|
||||
if (isError) { |
||||
return <h3>'Error occurred when loading help'</h3>; |
||||
} |
||||
|
||||
return <div className="markdown-html" dangerouslySetInnerHTML={{ __html: help }} />; |
||||
} |
||||
} |
Loading…
Reference in new issue