import Component from '@glimmer/component';
import { tracked } from "@glimmer/tracking";


export default class WordsPhraseRowComponent extends Component {
  @tracked phraseWords = [];

  constructor(...args) {
    super(...args);
    this.phraseWords = this.getRelatedPhraseWords();
  }

  getRelatedPhraseWords()
  {
    let phraseWords = this.args.allWords.filter((word) => {
      if (word.phraseId == this.args.model.phraseId) {
        return word;
      }
    });

    phraseWords.sort(function(a,b) {
      return a.ogntSort - b.ogntSort;
    });

    /**
     * The first item in the array should contain our ULB gloss.
     * We need to take that gloss and add it to the next row in order
     * for our table to render correctly.
     */
    let ulbGloss = phraseWords.shift();
    phraseWords[0].ulb = ulbGloss.ulb;
    phraseWords[0].rootRow = true;

    return phraseWords;
  }

  get
  rowCount()
  {
    return this.phraseWords.length;
  }
}
