<commit_before>import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { autorun } from 'mobx';
import { observer } from 'mobx-react';
import Webview from 'react-electron-web-view';
import classnames from 'classnames';

import ServiceModel from '../../../models/Service';
import StatusBarTargetUrl from '../../ui/StatusBarTargetUrl';
import WebviewLoader from '../../ui/WebviewLoader';
import WebviewCrashHandler from './WebviewCrashHandler';
import WebviewErrorHandler from './ErrorHandlers/WebviewErrorHandler';
import ServiceDisabled from './ServiceDisabled';

export default @observer class ServiceWebview extends Component {
  static propTypes = {
    service: PropTypes.instanceOf(ServiceModel).isRequired,
    setWebviewReference: PropTypes.func.isRequired,
    reload: PropTypes.func.isRequired,
    edit: PropTypes.func.isRequired,
    isAppMuted: PropTypes.bool.isRequired,
    enable: PropTypes.func.isRequired,
    isActive: PropTypes.bool,
  };

  static defaultProps = {
    isActive: false,
  };

  state = {
    forceRepaint: false,
    targetUrl: '',
    statusBarVisible: false,
  };

  autorunDisposer = null;

  webview = null;

  componentDidMount() {
    this.autorunDisposer = autorun(() => {
      if (this.props.service.isActive) {
        this.setState({ forceRepaint: true });
        setTimeout(() => {
          this.setState({ forceRepaint: false });
        }, 100);
      }
    });
  }

  componentWillUnmount() {
    this.autorunDisposer();
  }

  updateTargetUrl = (event) => {
    let visible = true;
    if (event.url === '' || event.url === '#') {
      visible = false;
    }
    this.setState({
      targetUrl: event.url,
      statusBarVisible: visible,
    });
  }

  render() {
    const {
      service,
      setWebviewReference,
      reload,
      edit,
      isAppMuted,
      enable,
    } = this.props;

    const webviewClasses = classnames({
      services__webview: true,
      'services__webview-wrapper': true,
      'is-active': service.isActive,
      'services__webview--force-repaint': this.state.forceRepaint,
    });

    let statusBar = null;
    if (this.state.statusBarVisible) {
      statusBar = (
        <StatusBarTargetUrl text={this.state.targetUrl} />
      );
    }

    return (
      <div className={webviewClasses}>
        {service.hasCrashed && (
          <WebviewCrashHandler
            name={service.recipe.name}
            webview={service.webview}
            reload={reload}
          />
        )}
        {service.isLoading && service.isFirstLoad && (
          <WebviewLoader
            loaded={!service.isLoading}
            name={service.name}
          />
        )}
        {service.isError && (
          <WebviewErrorHandler
            name={service.recipe.name}
            errorMessage={service.errorMessage}
            reload={reload}
            edit={edit}
          />
        )}
        {!service.isEnabled ? (
          <ServiceDisabled
            name={service.recipe.name}
            webview={service.webview}
            enable={enable}
          />
        ) : (
          <Webview
            ref={(element) => { this.webview = element; }}
            autosize
            src={service.url}
            preload="./webview/recipe.js"<commit_msg>only show loader when service is enabled<commit_after>import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { autorun } from 'mobx';
import { observer } from 'mobx-react';
import Webview from 'react-electron-web-view';
import classnames from 'classnames';

import ServiceModel from '../../../models/Service';
import StatusBarTargetUrl from '../../ui/StatusBarTargetUrl';
import WebviewLoader from '../../ui/WebviewLoader';
import WebviewCrashHandler from './WebviewCrashHandler';
import WebviewErrorHandler from './ErrorHandlers/WebviewErrorHandler';
import ServiceDisabled from './ServiceDisabled';

export default @observer class ServiceWebview extends Component {
  static propTypes = {
    service: PropTypes.instanceOf(ServiceModel).isRequired,
    setWebviewReference: PropTypes.func.isRequired,
    reload: PropTypes.func.isRequired,
    edit: PropTypes.func.isRequired,
    isAppMuted: PropTypes.bool.isRequired,
    enable: PropTypes.func.isRequired,
    isActive: PropTypes.bool,
  };

  static defaultProps = {
    isActive: false,
  };

  state = {
    forceRepaint: false,
    targetUrl: '',
    statusBarVisible: false,
  };

  autorunDisposer = null;

  webview = null;

  componentDidMount() {
    this.autorunDisposer = autorun(() => {
      if (this.props.service.isActive) {
        this.setState({ forceRepaint: true });
        setTimeout(() => {
          this.setState({ forceRepaint: false });
        }, 100);
      }
    });
  }

  componentWillUnmount() {
    this.autorunDisposer();
  }

  updateTargetUrl = (event) => {
    let visible = true;
    if (event.url === '' || event.url === '#') {
      visible = false;
    }
    this.setState({
      targetUrl: event.url,
      statusBarVisible: visible,
    });
  }

  render() {
    const {
      service,
      setWebviewReference,
      reload,
      edit,
      isAppMuted,
      enable,
    } = this.props;

    const webviewClasses = classnames({
      services__webview: true,
      'services__webview-wrapper': true,
      'is-active': service.isActive,
      'services__webview--force-repaint': this.state.forceRepaint,
    });

    let statusBar = null;
    if (this.state.statusBarVisible) {
      statusBar = (
        <StatusBarTargetUrl text={this.state.targetUrl} />
      );
    }

    return (
      <div className={webviewClasses}>
        {service.hasCrashed && (
          <WebviewCrashHandler
            name={service.recipe.name}
            webview={service.webview}
            reload={reload}
          />
        )}
        {service.isEnabled && service.isLoading && service.isFirstLoad && (
          <WebviewLoader
            loaded={!service.isLoading}
            name={service.name}
          />
        )}
        {service.isError && (
          <WebviewErrorHandler
            name={service.recipe.name}
            errorMessage={service.errorMessage}
            reload={reload}
            edit={edit}
          />
        )}
        {!service.isEnabled ? (
          <ServiceDisabled
            name={service.recipe.name}
            webview={service.webview}
            enable={enable}
          />
        ) : (
          <Webview
            ref={(element) => { this.webview = element; }}
            autosize
            src={service.url}
            preload="./webview/recipe.js"
{'fraction_non_alphanumeric': 0.12673716012084593, 'fraction_numerical': 0.0009063444108761329, 'mean_word_length': 2.2744807121661723, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 23, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4817111', 'n_tokens_mistral': 1910, 'n_tokens_neox': 1903, 'n_words': 356}