<commit_before>import CustomFeatureControl from 'components/AnalysisPanel/CustomFeatureControl';
import ReportSubscribeButtons from 'components/Shared/ReportSubscribe';
import {attributes} from 'constants/AppConstants';
import text from 'js/languages';
import SVGIcon from 'utils/svgIcon';
import {defaultColorTheme} from '../../config';

import React, {
  Component,
  PropTypes
} from 'react';

export default class InfoWindow extends Component {
  static contextTypes = {
    language: PropTypes.string.isRequired,
    map: PropTypes.object.isRequired,
    settings: PropTypes.object.isRequired
  };

  constructor(props) {
    super(props);
    this.state = {
      activeSelectedFeature: '',
      prevButtonHover: false,
      nextButtonHover: false
    };
  }

  previous = () => {
    this.context.map.infoWindow.selectPrevious();
    const selectedFeature = this.context.map.infoWindow.getSelectedFeature();
    this.setState({
      activeSelectedFeature: `{"name": "${selectedFeature.attributes[selectedFeature._layer.displayField]}", "id": "${selectedFeature.attributes[selectedFeature._layer.objectIdField]}"}`
    });
  };

  next = () => {
    this.context.map.infoWindow.selectNext();
    const selectedFeature = this.context.map.infoWindow.getSelectedFeature();
    this.setState({
      activeSelectedFeature: `{"name": "${selectedFeature.attributes[selectedFeature._layer.displayField]}", "id": "${selectedFeature.attributes[selectedFeature._layer.objectIdField]}"}`
    });
  };

  clearFeatures = () => {
    const {map} = this.context;
    const features = map.infoWindow.features;
    const selectedIndex = map.infoWindow.selectedIndex;

    const newFeatures = [
      ...features.slice(0, selectedIndex),
      ...features.slice(selectedIndex + 1)
    ];

    map.infoWindow.clearFeatures();
    map.infoWindow.hide();

    map.infoWindow.setFeatures(newFeatures);
    map.infoWindow.show();
    map.infoWindow.select(0);
  };

  renderInstructionList = (instruction, index) => {
    return (
      <li key={index}>{instruction}</li>
    );
  };
  
  changeSelectedFeature = evt => {
    this.setState({
      activeSelectedFeature: evt.target.value
    }, () => {
      const selectedFeature = JSON.parse(this.state.activeSelectedFeature);
      const name = selectedFeature.name;
      const id = selectedFeature.id;
      const features = this.context.map.infoWindow.features;
      let index = 0;
      features.forEach(feature => {
        if (feature.attributes[feature._layer.displayField] === name && feature.attributes[feature._layer.objectIdField].toString() === id) {
          index = features.indexOf(feature);
        }
      });
      this.context.map.infoWindow.select(index);
    });
  }
  
  prevToggleHover = () => {
    this.setState({
      prevButtonHover: !this.state.prevButtonHover
    });
  };
  
  nextToggleHover = () => {
    this.setState({
      nextButtonHover: !this.state.nextButtonHover
    });
  };
  
  selectedFeatureOption = (feature, index) =>
  <option
    value={`{"name": "${feature.attributes[feature._layer.displayField] ? feature.attributes[feature._layer.displayField] : feature.attributes[feature._layer.objectIdField]}", "id": "${feature.attributes[feature._layer.objectIdField]}"}`}
    key={`selected-feature-${index}`}
  >
    {feature.attributes[feature._layer.displayField] ? feature.attributes[feature._layer.displayField] : feature.attributes[feature._layer.objectIdField]}
  </option>;

  createDropdown = (selectedIndex, count) => {
    const { customColorTheme } = this.context.settings;
    const {prevButtonHover, nextButtonHover, activeSelectedFeature} = this.state;<commit_msg>Add additional checks to use displayField or objectIdField<commit_after>import CustomFeatureControl from 'components/AnalysisPanel/CustomFeatureControl';
import ReportSubscribeButtons from 'components/Shared/ReportSubscribe';
import {attributes} from 'constants/AppConstants';
import text from 'js/languages';
import SVGIcon from 'utils/svgIcon';
import {defaultColorTheme} from '../../config';

import React, {
  Component,
  PropTypes
} from 'react';

export default class InfoWindow extends Component {
  static contextTypes = {
    language: PropTypes.string.isRequired,
    map: PropTypes.object.isRequired,
    settings: PropTypes.object.isRequired
  };

  constructor(props) {
    super(props);
    this.state = {
      activeSelectedFeature: '',
      prevButtonHover: false,
      nextButtonHover: false
    };
  }

  previous = () => {
    this.context.map.infoWindow.selectPrevious();
    const selectedFeature = this.context.map.infoWindow.getSelectedFeature();
    this.setState({
      activeSelectedFeature: `{"name": "${selectedFeature.attributes[selectedFeature._layer.displayField] ? selectedFeature.attributes[selectedFeature._layer.displayField] : selectedFeature.attributes[selectedFeature._layer.objectIdField]}", "id": "${selectedFeature.attributes[selectedFeature._layer.objectIdField]}"}`
    });
  };

  next = () => {
    this.context.map.infoWindow.selectNext();
    const selectedFeature = this.context.map.infoWindow.getSelectedFeature();
    this.setState({
      activeSelectedFeature: `{"name": "${selectedFeature.attributes[selectedFeature._layer.displayField] ? selectedFeature.attributes[selectedFeature._layer.displayField] : selectedFeature.attributes[selectedFeature._layer.objectIdField]}", "id": "${selectedFeature.attributes[selectedFeature._layer.objectIdField]}"}`
    });
  };

  clearFeatures = () => {
    const {map} = this.context;
    const features = map.infoWindow.features;
    const selectedIndex = map.infoWindow.selectedIndex;

    const newFeatures = [
      ...features.slice(0, selectedIndex),
      ...features.slice(selectedIndex + 1)
    ];

    map.infoWindow.clearFeatures();
    map.infoWindow.hide();

    map.infoWindow.setFeatures(newFeatures);
    map.infoWindow.show();
    map.infoWindow.select(0);
  };

  renderInstructionList = (instruction, index) => {
    return (
      <li key={index}>{instruction}</li>
    );
  };
  
  changeSelectedFeature = evt => {
    this.setState({
      activeSelectedFeature: evt.target.value
    }, () => {
      const selectedFeature = JSON.parse(this.state.activeSelectedFeature);
      const name = selectedFeature.name;
      const id = selectedFeature.id;
      const features = this.context.map.infoWindow.features;
      let index = 0;
      features.forEach(feature => {
        if (feature.attributes[feature._layer.displayField] || feature.attributes[feature._layer.objectIdField] === name && feature.attributes[feature._layer.objectIdField].toString() === id) {
          index = features.indexOf(feature);
        }
      });
      this.context.map.infoWindow.select(index);
    });
  }
  
  prevToggleHover = () => {
    this.setState({
      prevButtonHover: !this.state.prevButtonHover
    });
  };
  
  nextToggleHover = () => {
    this.setState({
      nextButtonHover: !this.state.nextButtonHover
    });
  };
  
  selectedFeatureOption = (feature, index) =>
  <option
    value={`{"name": "${feature.attributes[feature._layer.displayField] ? feature.attributes[feature._layer.displayField] : feature.attributes[feature._layer.objectIdField]}", "id": "${feature.attributes[feature._layer.objectIdField]}"}`}
    key={`selected-feature-${index}`}
  >
    {feature.attributes[feature._layer.displayField] ? feature.attributes[feature._layer.displayField] : feature.attributes[feature._layer.objectIdField]}
  </option>;

  createDropdown = (selectedIndex, count) => {
    const { customColorTheme } = this.context.settings;
    const {prevButtonHover, nextButtonHover, activeSelectedFeature} = this.state;
{'fraction_non_alphanumeric': 0.1389574938255557, 'fraction_numerical': 0.001039906408423242, 'mean_word_length': 3.9993502274204027, 'pattern_counts': {'":': 12, '<': 11, '<?xml version=': 0, '>': 33, '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': '660312', 'n_tokens_mistral': 2150, 'n_tokens_neox': 2150, 'n_words': 339}