import JSONView from 'jquery-jsonview/dist/jquery.jsonview'
import 'jquery-jsonview/dist/jquery.jsonview.css'
import React from 'react'
import './JSONView.scss'

export default class JSONViewWrapper extends React.Component {
  /// //////////////////////////////////////////////////////
  //
  //
  /// //////////////////////////////////////////////////////
  constructor (props) {
    super(props)
  }

  /// //////////////////////////////////////////////////////
  //
  //
  /// //////////////////////////////////////////////////////
  componentDidMount () {
    this.load(this.props.src)
  }

  /// //////////////////////////////////////////////////////
  //
  //
  /// //////////////////////////////////////////////////////
  componentDidUpdate () {
    $(this.container).empty()

    this.load(this.props.src)
  }

  /// //////////////////////////////////////////////////////
  //
  //
  /// //////////////////////////////////////////////////////
  load (src) {
    $(this.container).JSONView(src, {
      collapsed: false
    })
  }

  /// //////////////////////////////////////////////////////
  //
  //
  /// //////////////////////////////////////////////////////
  render () {
    return (
      <div
        className='json-view'
        ref={(div) => this.container = div}
      />
    )
  }
}
