<commit_before><template>
<div class="subject-content">
  <div
    v-for="message in messages"
    :key="message.name"
    :class="['message-wrapper', message.received ? 'received' : 'sent', {'user' : message.user}]">
    <div
      class="message"
      v-html="message.text">
    </div>
  </div>
</div>
</template>

<script>
export default {
  name: 'Subject',
  props: {
    subject: String
  },
  watch: {
    '$route' (to, from) {
      clearInterval(this.interval)
      this.$store.commit('RESET_MESSAGES')
      this.subjectIndex = 0
      this.start()
    }
  },
  data () {
    return {
      subjectIndex: 0,
      interval: null
    }
  },
  computed: {
    subjectMessages () {
      const subject = this.state.subjects.find(subject => subject.name === this.subject) || []
      return subject.messages
    },
    messages () {
      return this.state.messages
    }
  },
  methods: {
    start() {
      this.interval = setInterval(() => {
        const message = this.subjectMessages[this.subjectIndex++]
        if (message) {
          this.displayMessage(message)
        } else {<commit_msg>First message displayed on start<commit_after><template>
<div class="subject-content">
  <div
    v-for="message in messages"
    :key="message.name"
    :class="['message-wrapper', message.received ? 'received' : 'sent', {'user' : message.user}]">
    <div
      class="message"
      v-html="message.text">
    </div>
  </div>
</div>
</template>

<script>
export default {
  name: 'Subject',
  props: {
    subject: String
  },
  watch: {
    '$route' (to, from) {
      clearInterval(this.interval)
      this.$store.commit('RESET_MESSAGES')
      this.subjectIndex = 0
      this.start()
    }
  },
  data () {
    return {
      subjectIndex: 0,
      interval: null
    }
  },
  computed: {
    subjectMessages () {
      const subject = this.state.subjects.find(subject => subject.name === this.subject) || []
      return subject.messages
    },
    messages () {
      return this.state.messages
    }
  },
  methods: {
    start() {
      // display first message on start
      this.displayMessage(this.subjectMessages[this.subjectIndex++])

      // delay the other messages
      this.interval = setInterval(() => {
        const message = this.subjectMessages[this.subjectIndex++]
        if (message) {
          this.displayMessage(message)
        } else {
{'fraction_non_alphanumeric': 0.15484683172471675, 'fraction_numerical': 0.001678556441460344, 'mean_word_length': 2.4500723589001447, 'pattern_counts': {'":': 0, '<': 21, '<?xml version=': 0, '>': 25, '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': '6162454', 'n_tokens_mistral': 741, 'n_tokens_neox': 731, 'n_words': 148}