<commit_before>/*
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/.
 */

import * as React from 'react';
import * as _ from 'lodash';

import { styled } from '@csegames/linaria/react';
import AbilityButton from './AbilityButton';

const Container = styled.div`
  display: flex;
  justify-content: center;
`;

export interface ApiAbilityInfo {
  id: number;
  name: string;
  icon: string;
  description: string;
  tracks: any;
}

export interface AbilityBarProps {
}

export interface AbilityBarState {
  clientAbilities: AbilityBarItem[];
}

export type InitialAbilityInfo = ApiAbilityInfo & AbilityBarItem;

export class AbilityBar extends React.Component<AbilityBarProps, AbilityBarState> {
  constructor(props: AbilityBarProps) {
    super(props);
    this.state = {
      clientAbilities: [],
    };
  }

  public render() {
    const { clientAbilities } = this.state;

    return (
      <Container className={'ability-bar'}>
        {clientAbilities.map((clientAbility: AbilityBarItem, index: number) => {
          const abilityInfo = this.getAbility(clientAbility);

          return abilityInfo ? (
            <AbilityButton
              key={abilityInfo.id}
              abilityInfo={abilityInfo}
              index={index + 1}
              numberOfAbilities={clientAbilities.length}
            />
          ) : null;
        })}
      </Container>
    );
  }

  public componentDidMount() {
    game.abilityBarState.onUpdated(this.updateAbilities);
    game.store.onUpdated(() => this.forceUpdate());

    if (game.abilityBarState.isReady) {
      this.updateAbilities();
    }
  }

  public shouldComponentUpdate(nextProps: AbilityBarProps, nextState: AbilityBarState) {
    return true;
    // return !_.isEqual(nextState.clientAbilities, this.state.clientAbilities) ||
    //   !_.isEqual(nextProps.apiAbilities, this.props.apiAbilities);
  }

  private updateAbilities = () => {
    const sortedAbilities = Object.values(game.abilityBarState.abilities).sort(this.sortByAbilityID);

    this.setState({ clientAbilities: sortedAbilities });

    if (game.store.refetch) {
      window.setTimeout(() => game.store.refetch(), 50);
    }
  }

  private sortByAbilityID = (a: AbilityBarItem, b: AbilityBarItem) => {<commit_msg>Keep trying to refetch every 3 seconds if no api ability info for buttons<commit_after>/*
 * This Source Code Form is subject to the terms of the Mozilla Public
 * License, v. 2.0. If a copy of the MPL was not distributed with this
 * file, You can obtain one at http://mozilla.org/MPL/2.0/.
 */

import * as React from 'react';
import * as _ from 'lodash';

import { styled } from '@csegames/linaria/react';
import AbilityButton from './AbilityButton';

const Container = styled.div`
  display: flex;
  justify-content: center;
`;

export interface ApiAbilityInfo {
  id: number;
  name: string;
  icon: string;
  description: string;
  tracks: any;
}

export interface AbilityBarProps {
}

export interface AbilityBarState {
  clientAbilities: AbilityBarItem[];
}

export type InitialAbilityInfo = ApiAbilityInfo & AbilityBarItem;

export class AbilityBar extends React.Component<AbilityBarProps, AbilityBarState> {
  private refetchAbilitiesTimeout: number;
  private clientAbilitiesCache: ArrayMap<AbilityBarItem>;
  constructor(props: AbilityBarProps) {
    super(props);
    this.state = {
      clientAbilities: [],
    };
  }

  public render() {
    const { clientAbilities } = this.state;

    return (
      <Container className={'ability-bar'}>
        {clientAbilities.map((clientAbility: AbilityBarItem, index: number) => {
          const abilityInfo = this.getAbility(clientAbility);

          return abilityInfo ? (
            <AbilityButton
              key={abilityInfo.id}
              abilityInfo={abilityInfo}
              index={index + 1}
              numberOfAbilities={clientAbilities.length}
            />
          ) : null;
        })}
      </Container>
    );
  }

  public componentDidMount() {
    game.abilityBarState.onUpdated(() => {
      this.updateAbilities();
    });
    game.store.onUpdated(() => this.forceUpdate());

    if (!game.store.myCharacter || !game.store.myCharacter.abilities) {
      this.refetchBadAPIAbilities();
    }

    if (game.abilityBarState.isReady) {
      this.updateAbilities();
    }
  }

  public shouldComponentUpdate(nextProps: AbilityBarProps, nextState: AbilityBarState) {
    return true;
    // return !_.isEqual(nextState.clientAbilities, this.state.clientAbilities) ||
    //   !_.isEqual(nextProps.apiAbilities, this.props.apiAbilities);
  }

  public componentWillUnmount() {
    window.clearTimeout(this.refetchAbilitiesTimeout);
  }

  private updateAbilities = () => {
    if (!this.clientAbilitiesCache || !_.isEqual(this.clientAbilitiesCache, game.abilityBarState.abilities)) {
      this.clientAbilitiesCache = game.abilityBarState.abilities;
      const sortedAbilities = Object.values(game.abilityBarState.abilities).sort(this.sortByAbilityID);

      this.setState({ clientAbilities: sortedAbilities });

      if (game.store.refetch) {
        window.setTimeout(() => game.store.refetch(), 50);
      }
    }
  }

  private refetchBadAPIAbilities = () => {
    if (!game.store.myCharacter || !game.store.myCharacter.abilities) {
      game.store.refetch();
      this.refetchAbilitiesTimeout = window.setTimeout(this.refetchBadAPIAbilities, 3000);
      return;
    }

    window.clearTimeout(this.refetchAbilitiesTimeout);
    this.refetchAbilitiesTimeout = null;
  }

  private sortByAbilityID = (a: AbilityBarItem, b: AbilityBarItem) => {
{'fraction_non_alphanumeric': 0.11616954474097331, 'fraction_numerical': 0.0033141461712890286, 'mean_word_length': 3.2663690476190474, 'pattern_counts': {'":': 0, '<': 12, '<?xml version=': 0, '>': 24, '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': '4547898', 'n_tokens_mistral': 1734, 'n_tokens_neox': 1698, 'n_words': 366}