<template>
  <Block :title="$_tr('title')" title-tag="h5" class="mb-xl">
    <component-listing
      id="project-users-listing"
      :static-data="users"
      direction="vertical"
    >
      <template #default="{ item }">
        <CardUser
          v-bind="item"
          :key="item.uuid"
          :image="$_getContentImage(item.image, 'avatar')"
        />
      </template>
    </component-listing>
  </Block>
</template>

<script>
import CardUser from '../users/CardUser'

import Block from '@inside-commons/components/lib/Block'

export default {
  name: 'ProjectUsers',
  $_i18nRootPath: 'customs.PROJECTS.users',
  components: { CardUser, Block },
  props: {
    users: {
      type: Array,
      required: true
    }
  }
}
</script>
