<commit_before><template>
  <div :class="{ 'open': open || forceOpen || filter }">
    <i v-if="collectionCount(indexTree)" class="fa fa-caret-right tree-toggle" aria-hidden="true" @click="toggleBranch()"></i>
    <a v-link="{name: 'DataIndexSummary', params: {index: indexTree.name}}" class="tree-item truncate"
       :class="{ 'active': isIndexActive(indexTree.name) }">
      <i class="fa fa-database" aria-hidden="true"></i>
      {{{indexTree.name | highlight filter}}} ({{collectionCount(indexTree)}})
    </a>
    <ul class="collections">
      <li v-for="collectionTree in indexTree.collections.stored | orderBy 1" v-if="filter === '' || collectionTree.indexOf(filter) >= 0">
        <a class="tree-item truncate"
           v-link="{name: 'DataCollectionBrowse', params: {index: indexTree.name, collection: collectionTree}}"
           :class="{ 'active': isCollectionActive(collectionTree) }">
           <i class="fa fa-th-list" aria-hidden="true" title="Persisted collection"></i>
           {{{collectionTree | highlight filter}}}
         </a>
      </li>
      <li v-for="collectionTree in indexTree.collections.realtime | orderBy 1" v-if="filter === '' || collectionTree.indexOf(filter) >= 0">
        <a class="tree-item truncate"
           v-link="{name: 'DataCollectionWatch', params: {index: indexTree.name, collection: collectionTree}}"
           :class="{ 'active': isCollectionActive(collectionTree) }">
          <i class="fa fa-bolt" aria-hidden="true" title="Volatile collection"></i>
          {{{collectionTree | highlight filter}}}
        </a>
      </li>
    </ul>
  </div>
</template>

<script>
import { highlight } from '../../../filters/highlight.filter'

export default {
  props: {
    forceOpen: {
      type: Boolean,
      default: false
    },
    index: String,
    filter: String,
    collection: String,
    routeName: String,
    indexTree: Object
  },
  data: function () {
    return {
      open: false
    }
  },
  filters: {
    highlight
  },
  methods: {

    toggleBranch () {
      // TODO This state should be one day persistent across page refreshes
      this.open = !this.open
    },
    collectionCount (index) {
      let count = 0

      if (!index.collections) {
        return 0
      }

      if (index.collections.stored) {
        count += index.collections.stored.length
      }

      if (index.collections.realtime) {
        count += index.collections.realtime.length
      }

      return count
    },
    isTreeOpen (currentIndex, indexName) {
      if (currentIndex === indexName) {
        this.open = true
      }
    },
    isIndexActive (indexName) {
      return this.index === indexName && !this.collection
    },
    isCollectionActive (collectionName) {
      return this.collection === collectionName
    }
  },
  watch: {
    index (index) {
      this.isTreeOpen(index, this.indexTree.name)
    },
    collection () {
      this.isTreeOpen(this.index, this.indexTree.name)
    }
  },
  ready: function () {
    this.isTreeOpen(this.index, this.indexTree.name)
  }<commit_msg>fix highlight bug<commit_after><template>
  <div :class="{ 'open': open || forceOpen || filter }">
    <i v-if="collectionCount(indexTree)" class="fa fa-caret-right tree-toggle" aria-hidden="true" @click="toggleBranch()"></i>
    <a v-link="{name: 'DataIndexSummary', params: {index: indexTree.name}}" class="tree-item truncate"
       :class="{ 'active': isIndexActive(indexTree.name) }">
      <i class="fa fa-database" aria-hidden="true"></i>
      {{{indexTree.name | highlight filter}}} ({{collectionCount(indexTree)}})
    </a>
    <ul class="collections">
      <li v-for="collectionTree in indexTree.collections.stored | orderBy 1" v-if="filter === '' || collectionTree.indexOf(filter) >= 0">
        <a class="tree-item truncate"
           v-link="{name: 'DataCollectionBrowse', params: {index: indexTree.name, collection: collectionTree}}"
           :class="{ 'active': isCollectionActive(indexTree.name, collectionTree) }">
           <i class="fa fa-th-list" aria-hidden="true" title="Persisted collection"></i>
           {{{collectionTree | highlight filter}}}
         </a>
      </li>
      <li v-for="collectionTree in indexTree.collections.realtime | orderBy 1" v-if="filter === '' || collectionTree.indexOf(filter) >= 0">
        <a class="tree-item truncate"
           v-link="{name: 'DataCollectionWatch', params: {index: indexTree.name, collection: collectionTree}}"
           :class="{ 'active': isCollectionActive(indexTree.name, collectionTree) }">
          <i class="fa fa-bolt" aria-hidden="true" title="Volatile collection"></i>
          {{{collectionTree | highlight filter}}}
        </a>
      </li>
    </ul>
  </div>
</template>

<script>
import { highlight } from '../../../filters/highlight.filter'

export default {
  props: {
    forceOpen: {
      type: Boolean,
      default: false
    },
    index: String,
    filter: String,
    collection: String,
    routeName: String,
    indexTree: Object
  },
  data: function () {
    return {
      open: false
    }
  },
  filters: {
    highlight
  },
  methods: {

    toggleBranch () {
      // TODO This state should be one day persistent across page refreshes
      this.open = !this.open
    },
    collectionCount (index) {
      let count = 0

      if (!index.collections) {
        return 0
      }

      if (index.collections.stored) {
        count += index.collections.stored.length
      }

      if (index.collections.realtime) {
        count += index.collections.realtime.length
      }

      return count
    },
    isTreeOpen (currentIndex, indexName) {
      if (currentIndex === indexName) {
        this.open = true
      }
    },
    isIndexActive (indexName) {
      return this.index === indexName && !this.collection
    },
    isCollectionActive (indexName, collectionName) {
      return this.index === indexName && this.collection === collectionName
    }
  },
  watch: {
    index (index) {
      this.isTreeOpen(index, this.indexTree.name)
    },
    collection () {
      this.isTreeOpen(this.index, this.indexTree.name)
    }
  },
  ready: function () {
    this.isTreeOpen(this.index, this.indexTree.name)
  }
{'fraction_non_alphanumeric': 0.15572050992415684, 'fraction_numerical': 0.0019364208487978054, 'mean_word_length': 2.740494870247435, 'pattern_counts': {'":': 0, '<': 53, '<?xml version=': 0, '>': 57, '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': '3737075', 'n_tokens_mistral': 1895, 'n_tokens_neox': 1859, 'n_words': 407}