import React from 'react'
import PropTypes from 'prop-types'

import Spinner from '../../components/Spinner'

class HypheView extends React.Component {
  constructor (props) {
    super(props)
    this.state = {
      isLoading: true
    }
  }

  componentDidMount () {
    const webview = document.querySelector('webview')

    webview.addEventListener('did-start-loading', this.loadStart)
    webview.addEventListener('did-stop-loading', this.loadStop)

    webview.addEventListener('new-window', ({ url }) => {
      this.props.onOpenTabFromHyphe(url)
    })
  }

  loadStart = () => {
    this.setState({
      isLoading: true
    })
  }

  loadStop = () => {
    this.setState({
      isLoading: false
    })
  }
  
  render () {
    const { isLoading } = this.state
    return (
      <div className="hyphe-view-container" style={ this.props.style }>
        {isLoading &&
          <div className="spinner-container">
            <Spinner /> 
          </div>
        }
        <webview
          src={ this.props.url }
        />
      </div>
    )
  }
}

HypheView.propTypes = {
  url: PropTypes.string.isRequired,
  onOpenTabFromHyphe: PropTypes.func.isRequired,
}


export default HypheView
@@ -316,16 +316,40 @@
 ebview')
+%0A    this.node = webview
 %0A%0A    we
@@ -461,129 +461,865 @@
 g', 
-this.loadStop)%0A%0A    webview.addEventListener('new-window', (%7B url %7D) =%3E %7B%0A      this.props.onOpenTabFromHyphe(url)%0A    %7D)
+() =%3E %7B%0A      this.loadStop()%0A      webview.executeJavaScript(%0A        // Stop Sigma's ForceAtlas2 in Hyphe tab when changing tab to avoid cpu overhaul%0A        %22window.onblur = function() %7B if (document.querySelector('#stopFA2') !== undefined) document.querySelector('#stopFA2').click() %7D; %22 +%0A        // Remove leave corpus button from Hyphe tab within HyBro%0A        %22document.querySelector('.topbar-project button').remove(); %22 +%0A        %22document.querySelector('#hybro-link').remove();%22%0A      )%0A    %7D)%0A%0A    webview.addEventListener('new-window', (%7B url %7D) =%3E %7B%0A      this.props.onOpenTabFromHyphe(url)%0A    %7D)%0A  %7D%0A%0A  componentDidUpdate (prevProps) %7B%0A    // reload when is network view%0A    if (this.props.isHypheView !== prevProps.isHypheView &&%0A        this.props.isHypheView && %0A        this.node.src === this.props.url ) %7B%0A      this.node.reload()%0A    %7D
 %0A  %7D
@@ -1877,16 +1877,58 @@
 quired,%0A
+  isHypheView: PropTypes.bool.isRequired,%0A
   onOpen

add executeJavaScripto webview on HypheView #98