import Controller from "@ember/controller";
import EmberObject, { action } from "@ember/object";
import { INPUT_DELAY } from "discourse-common/config/environment";
import discourseDebounce from "discourse-common/lib/debounce";
import { isEmpty } from "@ember/utils";
import { observes } from "discourse-common/utils/decorators";

export default Controller.extend({
  filter: null,
  showWords: false,

  _filterContent() {
    if (isEmpty(this.allWatchedWords)) {
      return;
    }

    if (!this.filter) {
      this.set("model", this.allWatchedWords);
      return;
    }

    const filter = this.filter.toLowerCase();
    const model = [];

    this.allWatchedWords.forEach((wordsForAction) => {
      const wordRecords = wordsForAction.words.filter((wordRecord) => {
        return wordRecord.word.indexOf(filter) > -1;
      });

      model.pushObject(
        EmberObject.create({
          nameKey: wordsForAction.nameKey,
          name: wordsForAction.name,
          words: wordRecords,
        })
      );
    });
    this.set("model", model);
  },

  @observes("filter")
  filterContent() {
    discourseDebounce(this, this._filterContent, INPUT_DELAY);
  },

  @action
  clearFilter() {
    this.set("filter", "");
  },

  @action
  toggleMenu() {
    $(".admin-detail").toggleClass("mobile-closed mobile-open");
  },
});