<template>
  <UsersListingBlock
    :static-data="contacts"
    :block-options="blockOptions"
    class="mb-xl"
  >
    <template #default="{ item }">
      <UserCard
        :key="item.uuid"
        v-bind="item"
        :image="$_getContentImage(item.image, 'thumbnail')"
      />
    </template>
  </UsersListingBlock>
</template>

<script>
import UsersListingBlock from '@inside-users/components/lib/UsersListingBlock'

import UserCard from '../UserCard'

export default {
  name: 'SpaceKeyContacts',
  $_i18nRootPath: 'customs.SPACES.keyContacts',
  components: { UsersListingBlock, UserCard },
  props: {
    contacts: {
      type: Array,
      required: true
    }
  },
  computed: {
    blockOptions() {
      return {
        title: this.$_tr('title'),
        titleTag: 'h4'
      }
    }
  }
}
</script>
