<commit_before>import * as React from 'react';
import { t } from 'i18next';
import classNames from 'classnames';
import './rating-mode.scss';
import ClickOutside from '../dim-ui/click-outside';
import { settings } from '../settings/settings';
import { StoreServiceType } from '../inventory/d2-stores.service';
import { $rootScope } from 'ngimport';
import { D2ManifestDefinitions } from '../destiny2/d2-definitions.service';
import { getReviewModes } from '../destinyTrackerApi/reviewModesFetcher';

interface Props {
  defs: D2ManifestDefinitions;
  D2StoresService: StoreServiceType;
}

interface State {
  open: boolean;
  reviewsModeSelection: number;
}

// TODO: observe Settings changes - changes in the reviews pane aren't reflected here without an app refresh.
export default class RatingMode extends React.Component<Props, State> {
  private dropdownToggler: HTMLElement | null;

  private reviewModeOptions = getReviewModes(this.props.defs);

  constructor(props: Props) {
    super(props);
    this.state = { open: false, reviewsModeSelection: settings.reviewsModeSelection };
  }

  render() {
    const { open, reviewsModeSelection } = this.state;

    if (!this.props.defs) {
      return;
    }

    return (
      <div>
        <ClickOutside onClickOutside={this.closeDropdown}>
          <span className="link" onClick={this.toggleDropdown} title={t('DtrReview.ForGameMode')}>
            <i className={classNames('fa', 'fa fa-thumbs-up')}/>
          </span>
          {open &&
            <div className="mode-popup">
              <label className="mode-label" htmlFor="reviewMode">{t('DtrReview.ForGameMode')}</label>
              <select name="reviewMode" value={reviewsModeSelection} onChange={this.modeChange}>
                {this.reviewModeOptions.map((r) => <option key={r.mode} value={r.mode}>{r.description}</option>)}
              </select>
            </div>}
          </ClickOutside>
      </div>
    );
  }

  private toggleDropdown = () => {
    this.setState({ open: !this.state.open });
  }

  private closeDropdown = (e?) => {
    if (!e || !this.dropdownToggler || !this.dropdownToggler.contains(e.target)) {
      this.setState({ open: false });
    }
  }

  private modeChange = (e?) => {
    if (!e || !e.target) {
      return;
    }

    const newModeSelection = e.target.value;
    settings.reviewsModeSelection = newModeSelection;<commit_msg>Simplified class declaration.<commit_after>import * as React from 'react';
import { t } from 'i18next';
import './rating-mode.scss';
import ClickOutside from '../dim-ui/click-outside';
import { settings } from '../settings/settings';
import { StoreServiceType } from '../inventory/d2-stores.service';
import { $rootScope } from 'ngimport';
import { D2ManifestDefinitions } from '../destiny2/d2-definitions.service';
import { getReviewModes } from '../destinyTrackerApi/reviewModesFetcher';

interface Props {
  defs: D2ManifestDefinitions;
  D2StoresService: StoreServiceType;
}

interface State {
  open: boolean;
  reviewsModeSelection: number;
}

// TODO: observe Settings changes - changes in the reviews pane aren't reflected here without an app refresh.
export default class RatingMode extends React.Component<Props, State> {
  private dropdownToggler: HTMLElement | null;

  private reviewModeOptions = getReviewModes(this.props.defs);

  constructor(props: Props) {
    super(props);
    this.state = { open: false, reviewsModeSelection: settings.reviewsModeSelection };
  }

  render() {
    const { open, reviewsModeSelection } = this.state;

    if (!this.props.defs) {
      return;
    }

    return (
      <div>
        <ClickOutside onClickOutside={this.closeDropdown}>
          <span className="link" onClick={this.toggleDropdown} title={t('DtrReview.ForGameMode')}>
            <i className='fa fa fa-thumbs-up'/>
          </span>
          {open &&
            <div className="mode-popup">
              <label className="mode-label" htmlFor="reviewMode">{t('DtrReview.ForGameMode')}</label>
              <select name="reviewMode" value={reviewsModeSelection} onChange={this.modeChange}>
                {this.reviewModeOptions.map((r) => <option key={r.mode} value={r.mode}>{r.description}</option>)}
              </select>
            </div>}
          </ClickOutside>
      </div>
    );
  }

  private toggleDropdown = () => {
    this.setState({ open: !this.state.open });
  }

  private closeDropdown = (e?) => {
    if (!e || !this.dropdownToggler || !this.dropdownToggler.contains(e.target)) {
      this.setState({ open: false });
    }
  }

  private modeChange = (e?) => {
    if (!e || !e.target) {
      return;
    }

    const newModeSelection = e.target.value;
    settings.reviewsModeSelection = newModeSelection;
{'fraction_non_alphanumeric': 0.1422849915682968, 'fraction_numerical': 0.003372681281618887, 'mean_word_length': 3.229055258467023, 'pattern_counts': {'":': 0, '<': 35, '<?xml version=': 0, '>': 43, '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': '5813427', 'n_tokens_mistral': 1436, 'n_tokens_neox': 1410, 'n_words': 307}