<commit_before><template lang="pug">
  li(:class="{ active: isActive, opened: open, children: hasChildren }")
    a.component-link(@click.prevent="select")
      | &lt;{{ component.$options.name || component.$options._componentTag}}&gt;
      span.count(v-if="hasChildren") {{ children.length }}

      .toolbar(v-if="open || isActive")
        .btn(@click.stop.prevent="triggerData")
          strong Reload

        .btn(@click.stop.prevent="inspect") Inspect
        .btn(@click.stop.prevent="sendToConsole") $vm


    ul(v-if="hasChildren")
      component-tree(
        v-show="open",
        v-for="comp in children",
        @dataChange="dataChange",
        @set-open="setOpen",
        :activeKey="activeKey",
        :component="comp",
        :key="comp._uid"
      )

</template>

<script>
import Type from "type-of-is";

export default {
  name: "ComponentTree",
  data() {
    return {
      open: false,
      int: 0,
      children: this.component.$children,
    };
  },

  mounted() {
    this.int = setInterval(() => {
      this.$forceUpdate();
    }, 1000);
  },

  beforeDestroy() {
    clearInterval(this.int);
  },

  props: ["component", "activeKey"],

  computed: {
    hasChildren() {
      return this.children.length > 0;
    },
    isActive() {
      return this.component._uid == this.activeKey;
    },
  },

  watch: {
    isActive(val) {
      if (val) {
        this.setOpen(true);
      }
    },
  },

  methods: {
    setOpen(val) {
      if (this.open !== val) this.open = val;
      this.$emit("set-open", val);
    },
    sendToConsole() {
      window.$vm = this.component;
      console.groupCollapsed(`window.$vm = ${this.component.$options.name}`);
      console.log(this.component);
      console.groupEnd();
    },
    inspect() {
      const coords = this.component.$el.getBoundingClientRect();
      remote.getCurrentWebContents().inspectElement(parseInt(coords.left), parseInt(coords.top));
    },
    dataChange(args) {
      this.$emit("dataChange", args);
    },
    select() {
      this.triggerData();
      this.toggle();
    },
    triggerData() {
      this.dataChange({<commit_msg>remove inspect, as this only works on electron<commit_after><template lang="pug">
  li(:class="{ active: isActive, opened: open, children: hasChildren }")
    a.component-link(@click.prevent="select")
      | &lt;{{ component.$options.name || component.$options._componentTag}}&gt;
      span.count(v-if="hasChildren") {{ children.length }}

      .toolbar(v-if="open || isActive")
        .btn(@click.stop.prevent="triggerData")
          strong Reload
        .btn(@click.stop.prevent="sendToConsole") $vm


    ul(v-if="hasChildren")
      component-tree(
        v-show="open",
        v-for="comp in children",
        @dataChange="dataChange",
        @set-open="setOpen",
        :activeKey="activeKey",
        :component="comp",
        :key="comp._uid"
      )

</template>

<script>
import Type from "type-of-is";

export default {
  name: "ComponentTree",
  data() {
    return {
      open: false,
      int: 0,
      children: this.component.$children,
    };
  },

  mounted() {
    this.int = setInterval(() => {
      this.$forceUpdate();
    }, 1000);
  },

  beforeDestroy() {
    clearInterval(this.int);
  },

  props: ["component", "activeKey"],

  computed: {
    hasChildren() {
      return this.children.length > 0;
    },
    isActive() {
      return this.component._uid == this.activeKey;
    },
  },

  watch: {
    isActive(val) {
      if (val) {
        this.setOpen(true);
      }
    },
  },

  methods: {
    setOpen(val) {
      if (this.open !== val) this.open = val;
      this.$emit("set-open", val);
    },
    sendToConsole() {
      window.$vm = this.component;
      console.groupCollapsed(`window.$vm = ${this.component.$options.name}`);
      console.log(this.component);
      console.groupEnd();
    },

    dataChange(args) {
      this.$emit("dataChange", args);
    },
    select() {
      this.triggerData();
      this.toggle();
    },
    triggerData() {
      this.dataChange({
{'fraction_non_alphanumeric': 0.17473580732366675, 'fraction_numerical': 0.0029491275497665276, 'mean_word_length': 2.4638297872340424, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 13, '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': '7352759', 'n_tokens_mistral': 1313, 'n_tokens_neox': 1286, 'n_words': 212}