<commit_before>import React from "react";
import {render} from "react-dom";
import {Link, browserHistory} from "react-router";
import {Table, Thead, Th, Tr, Td} from "reactable";
import _ from "lodash";
import classNames from "classnames";
import {connect} from "react-redux";

import HttpService from "../http/HttpService";
import ActionsUtils from "../actions/ActionsUtils";
import DialogMessages from "../common/DialogMessages";
import DateUtils from "../common/DateUtils";
import LoaderSpinner from "../components/Spinner.js";
import AddProcessDialog from "../components/AddProcessDialog.js";
import HealthCheck from "../components/HealthCheck.js";

import "../stylesheets/processes.styl";
import filterIcon from '../assets/img/search.svg'
import createProcessIcon from '../assets/img/create-process.svg'
import editIcon from '../assets/img/edit-icon.png'
import PeriodicallyReloadingComponent from './../components/PeriodicallyReloadingComponent'

class Processes extends PeriodicallyReloadingComponent {

  constructor(props) {
    super(props);

    this.state = {
      processes: [],
      statuses: {},
      filterVal: '',
      favouriteList: new Set(),
      showLoader: true,
      showAddProcess: false,
      currentPage: 0,
      sort: { column: "id", direction: 1}

    }
  }

  reload() {
    this.reloadStatuses();
  }

  onMount() {
    this.reloadProcesses();
  }

  reloadProcesses() {
    HttpService.fetchProcesses().then ((fetchedProcesses) => {
      if (!this.state.showAddProcess) {
        this.setState({processes: fetchedProcesses, showLoader: false})
      }
    }).catch( e => this.setState({ showLoader: false }))
  }

  reloadStatuses() {
    HttpService.fetchProcessesStatus().then ((statuses) => {
      if (!this.state.showAddProcess) {
        this.setState({ statuses: statuses, showLoader: false })
      }
    }).catch( e => this.setState({ showLoader: false }))
  }


  isGraph(process) {
    return process.processType == "graph"
  }

  showProcess(process) {
    if(this.isGraph(process)) {
      browserHistory.push('/visualization/' + process.id)
    }
  }

  showMetrics(process) {
    browserHistory.push('/metrics/' + process.id)
  }

  handleChange(event) {
    this.setState({filterVal: event.target.value});
  }

  deploy(process) {
    this.props.actions.toggleConfirmDialog(true, DialogMessages.deploy(process.id), () => {
      return HttpService.deploy(process.id).then(this.reload)
    })
  }

  stop(process) {
    this.props.actions.toggleConfirmDialog(true, DialogMessages.stop(process.id), () => {
      return HttpService.stop(process.id).then(this.reload)
    })
  }

  getFilterValue() {
    return this.state.filterVal.toLowerCase();
  }

  setFavourite(process) {
    var favouriteArray = this.state.favouriteList;
    if ( favouriteArray.has(process) ){
      favouriteArray.delete(process);
    } else {
      favouriteArray.add(process);
    }
    this.setState({favouriteList: favouriteArray});
  }

  isFavourite(process){
    var isFavourite = classNames({
      'favourite-icon': true,
      'is-favourite': this.state.favouriteList.has(process)
    });
    return isFavourite;
  }

  editIconClass(process){
    return classNames({
      "edit-icon": true,
      "btn disabled edit-disabled": !this.isGraph(process),
    })
  }

  processStatusClass(process) {
    const processId = process.name;
    const shouldRun = process.currentlyDeployedAt.length > 0;
    const statusesKnown = this.state.statuses;
    const isRunning = statusesKnown && _.get(this.state.statuses[processId], 'isRunning');
    if (isRunning) {
      return "status-running";
    } else if (shouldRun) {
      return statusesKnown ? "status-notrunning" : "status-unknown"
    } else return null;
  }

  processStatusTitle(processStatusClass) {
    if (processStatusClass == "status-running") {
      return "Running"
    } else if (processStatusClass == "status-notrunning") {
      return "Not running"
    } else if (processStatusClass == "status-unknown") {
      return "Unknown state"<commit_msg>[FIX] status unknown when statuses not loaded yet<commit_after>import React from "react";
import {render} from "react-dom";
import {Link, browserHistory} from "react-router";
import {Table, Thead, Th, Tr, Td} from "reactable";
import _ from "lodash";
import classNames from "classnames";
import {connect} from "react-redux";

import HttpService from "../http/HttpService";
import ActionsUtils from "../actions/ActionsUtils";
import DialogMessages from "../common/DialogMessages";
import DateUtils from "../common/DateUtils";
import LoaderSpinner from "../components/Spinner.js";
import AddProcessDialog from "../components/AddProcessDialog.js";
import HealthCheck from "../components/HealthCheck.js";

import "../stylesheets/processes.styl";
import filterIcon from '../assets/img/search.svg'
import createProcessIcon from '../assets/img/create-process.svg'
import editIcon from '../assets/img/edit-icon.png'
import PeriodicallyReloadingComponent from './../components/PeriodicallyReloadingComponent'

class Processes extends PeriodicallyReloadingComponent {

  constructor(props) {
    super(props);

    this.state = {
      processes: [],
      statuses: {},
      statusesLoaded: false,
      filterVal: '',
      favouriteList: new Set(),
      showLoader: true,
      showAddProcess: false,
      currentPage: 0,
      sort: { column: "id", direction: 1}

    }
  }

  reload() {
    this.reloadStatuses();
  }

  onMount() {
    this.reloadProcesses();
  }

  reloadProcesses() {
    HttpService.fetchProcesses().then ((fetchedProcesses) => {
      if (!this.state.showAddProcess) {
        this.setState({processes: fetchedProcesses, showLoader: false})
      }
    }).catch( e => this.setState({ showLoader: false }))
  }

  reloadStatuses() {
    HttpService.fetchProcessesStatus().then ((statuses) => {
      if (!this.state.showAddProcess) {
        this.setState({ statuses: statuses, showLoader: false, statusesLoaded: true })
      }
    }).catch( e => this.setState({ showLoader: false }))
  }


  isGraph(process) {
    return process.processType == "graph"
  }

  showProcess(process) {
    if(this.isGraph(process)) {
      browserHistory.push('/visualization/' + process.id)
    }
  }

  showMetrics(process) {
    browserHistory.push('/metrics/' + process.id)
  }

  handleChange(event) {
    this.setState({filterVal: event.target.value});
  }

  deploy(process) {
    this.props.actions.toggleConfirmDialog(true, DialogMessages.deploy(process.id), () => {
      return HttpService.deploy(process.id).then(this.reload)
    })
  }

  stop(process) {
    this.props.actions.toggleConfirmDialog(true, DialogMessages.stop(process.id), () => {
      return HttpService.stop(process.id).then(this.reload)
    })
  }

  getFilterValue() {
    return this.state.filterVal.toLowerCase();
  }

  setFavourite(process) {
    var favouriteArray = this.state.favouriteList;
    if ( favouriteArray.has(process) ){
      favouriteArray.delete(process);
    } else {
      favouriteArray.add(process);
    }
    this.setState({favouriteList: favouriteArray});
  }

  isFavourite(process){
    var isFavourite = classNames({
      'favourite-icon': true,
      'is-favourite': this.state.favouriteList.has(process)
    });
    return isFavourite;
  }

  editIconClass(process){
    return classNames({
      "edit-icon": true,
      "btn disabled edit-disabled": !this.isGraph(process),
    })
  }

  processStatusClass(process) {
    const processId = process.name;
    const shouldRun = process.currentlyDeployedAt.length > 0;
    const statusesKnown = this.state.statusesLoaded;
    const isRunning = statusesKnown && _.get(this.state.statuses[processId], 'isRunning');
    if (isRunning) {
      return "status-running";
    } else if (shouldRun) {
      return statusesKnown ? "status-notrunning" : "status-unknown"
    } else return null;
  }

  processStatusTitle(processStatusClass) {
    if (processStatusClass == "status-running") {
      return "Running"
    } else if (processStatusClass == "status-notrunning") {
      return "Not running"
    } else if (processStatusClass == "status-unknown") {
      return "Unknown state"
{'fraction_non_alphanumeric': 0.1384108385206884, 'fraction_numerical': 0.0007323324789454412, 'mean_word_length': 3.522075055187638, 'pattern_counts': {'":': 4, '<': 3, '<?xml version=': 0, '>': 17, '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': '4533894', 'n_tokens_mistral': 2516, 'n_tokens_neox': 2454, 'n_words': 494}