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

react-panel: Replace JSONFormatter npm package with the current monkey patched JsonExplorer

Browse Source
This commit is contained in:
Johannes Schill
2018-11-22 15:51:59 +01:00
parent 5cca489acd
commit 6242379915
1 changed files with 6 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
public/app/core/components/JSONFormatter/JSONFormatter.tsx
View File

@@ -1,16 +1,16 @@
import React, { PureComponent, createRef } from 'react'; import React, { PureComponent, createRef } from 'react';
import JSONFormatterJS, { JSONFormatterConfiguration } from 'json-formatter-js'; // import JSONFormatterJS, { JSONFormatterConfiguration } from 'json-formatter-js';
import { JsonExplorer } from 'app/core/core'; // We have made some monkey-patching of json-formatter-js so we can't switch right now
interface Props { interface Props {
className?: string; className?: string;
json: {}; json: {};
config?: JSONFormatterConfiguration; config?: any;
open?: number; open?: number;
} }
export class JSONFormatter extends PureComponent<Props> { export class JSONFormatter extends PureComponent<Props> {
private wrapperRef = createRef<HTMLDivElement>(); private wrapperRef = createRef<HTMLDivElement>();
private formatter: any;
static defaultProps = { static defaultProps = {
open: 3, open: 3,
@@ -30,21 +30,16 @@ export class JSONFormatter extends PureComponent<Props> {
renderJson = () => { renderJson = () => {
const { json, config, open } = this.props; const { json, config, open } = this.props;
this.formatter = new JSONFormatterJS(json, open, config);
const wrapperEl = this.wrapperRef.current; const wrapperEl = this.wrapperRef.current;
const newJsonHtml = this.formatter.render(); const formatter = new JsonExplorer(json, open, config);
const hasChildren: boolean = wrapperEl.hasChildNodes(); const hasChildren: boolean = wrapperEl.hasChildNodes();
if (hasChildren) { if (hasChildren) {
wrapperEl.replaceChild(newJsonHtml, wrapperEl.lastChild); wrapperEl.replaceChild(formatter.render(), wrapperEl.lastChild);
} else { } else {
wrapperEl.appendChild(newJsonHtml); wrapperEl.appendChild(formatter.render());
} }
}; };
componentWillUnmount() {
this.formatter = null;
}
render() { render() {
const { className } = this.props; const { className } = this.props;
return <div className={className} ref={this.wrapperRef} />; return <div className={className} ref={this.wrapperRef} />;