<commit_before>import { Component, HostBinding, Input, OnInit } from '@angular/core';
import { Session } from '../../../services/session';
import { QualityScoreService } from './quality-score.service';
import { MindsUser } from '../../../interfaces/entities';

/**
 * The logic that handles the `m-accountQualityScore` component
 */
@Component({
  selector: 'm-accountQualityScore',
  templateUrl: 'quality-score.component.html',
  styleUrls: ['./quality-score.component.scss'],
  providers: [QualityScoreService],
})
export class QualityScoreComponent implements OnInit {
  /**
   * Represents the user to fetch the score for
   */
  @Input() targetUser: MindsUser;

  /**
   * Represents the color for the component's badge
   */
  @HostBinding('style.--score-color') color = 'hsl(0, 55%, 45%)';

  /**
   * Represents the account quality score fetched from the backend
   */
  public qualityScore = 0;

  /**
   * Represents if the data are still being fetched
   */
  public inProgress = true;

  constructor(
    private session: Session,
    private qualityScoreService: QualityScoreService
  ) {}

  async ngOnInit() {
    await this.setQualityScoreAsync();
    this.setColor();
    this.formatQualityScore();
    this.inProgress = false;
  }

  /**
   * Checks if the provided user is an Admin
   */
  public isAdmin(): boolean {
    return this.session.isAdmin();
  }

  /**
   * Prepare the quality score value to be a value between 0 and 100.
   * Note: the value is received as a float number with a value between 0 and 1.
   * @private
   */
  private formatQualityScore(): void {
    this.qualityScore = Math.floor(this.qualityScore * 100);
  }

  /**
   * Calculates the correct color to use for the badge based on the quality score value.
   * Updates the color property.
   * @private
   */
  private setColor(): void {
    const hue = (this.qualityScore * 130).toString(10);
    this.color = `hsl(${hue}, 55%, 45%)`;
  }

  /**
   * Updates the quality score property value
   * @private
   */
  private async setQualityScoreAsync(): Promise<void> {
    this.qualityScore = await this.qualityScoreService
      .getUserQualityScore(this.targetUser.guid)
      .toPromise();
  }
}<commit_msg>(fix): race condition with change detection and loading the scores<commit_after>import {
  ChangeDetectorRef,
  Component,
  HostBinding,
  Input,
  OnInit,
} from '@angular/core';
import { Session } from '../../../services/session';
import { QualityScoreService } from './quality-score.service';
import { MindsUser } from '../../../interfaces/entities';

/**
 * The logic that handles the `m-accountQualityScore` component
 */
@Component({
  selector: 'm-accountQualityScore',
  templateUrl: 'quality-score.component.html',
  styleUrls: ['./quality-score.component.scss'],
  providers: [QualityScoreService],
})
export class QualityScoreComponent implements OnInit {
  /**
   * Represents the user to fetch the score for
   */
  @Input() targetUser: MindsUser;

  /**
   * Represents the color for the component's badge
   */
  @HostBinding('style.--score-color') color = 'hsl(0, 55%, 45%)';

  /**
   * Represents the account quality score fetched from the backend
   */
  public qualityScore = 0;

  /**
   * Represents if the data are still being fetched
   */
  public inProgress = true;

  constructor(
    private session: Session,
    private qualityScoreService: QualityScoreService,
    private cd: ChangeDetectorRef
  ) {}

  ngOnInit() {
    this.loadQualityScoreAsync();
  }

  /**
   * Checks if the provided user is an Admin
   */
  public isAdmin(): boolean {
    return this.session.isAdmin();
  }

  /**
   * Prepare the quality score value to be a value between 0 and 100.
   * Note: the value is received as a float number with a value between 0 and 1.
   * @private
   */
  private formatQualityScore(): void {
    this.qualityScore = Math.floor(this.qualityScore * 100);
  }

  /**
   * Calculates the correct color to use for the badge based on the quality score value.
   * Updates the color property.
   * @private
   */
  private setColor(): void {
    const hue = (this.qualityScore * 130).toString(10);
    this.color = `hsl(${hue}, 55%, 45%)`;
  }

  /**
   * Updates the quality score property value
   * @private
   */
  private async loadQualityScoreAsync(): Promise<void> {
    this.inProgress = true;
    try {
      this.qualityScore = await this.qualityScoreService
        .getUserQualityScore(this.targetUser.guid)
        .toPromise();
      this.setColor();
      this.formatQualityScore();
    } catch (err) {
      // ?
    } finally {
      this.inProgress = false;
      // Ensure change detection has happened
      this.cd.markForCheck();
      this.cd.detectChanges();
    }
  }
}
{'fraction_non_alphanumeric': 0.12563344594594594, 'fraction_numerical': 0.010135135135135136, 'mean_word_length': 3.055650684931507, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, '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': '3402883', 'n_tokens_mistral': 1454, 'n_tokens_neox': 1376, 'n_words': 418}