<template>
  <div class="threads">
    <thread
      v-for="thread in threads"
      :key="thread.id"
      :thread="thread"
      :dense="dense"
    />
  </div>
</template>

<style lang="sass" scoped>
.threads
  display: flex
  flex-direction: column
  padding: 8px 8px 8px 6px
</style>

<script lang="ts">
import { Component, Prop, Vue } from 'vue-property-decorator'
import { MessageThread } from '@/widgets/messages/types/MessageThread'
import Thread from '@/widgets/messages/components/thread/Thread.vue'

@Component({
  components: { Thread },
})
export default class Threads extends Vue {
  @Prop({ type: Array, required: true })
  threads!: MessageThread[]

  @Prop({ type: Boolean, default: true })
  dense!: boolean
}
</script>
