<template>
  <Page
    :banner-data="bannerData"
    :items-per-page="6"
    :extra-fields="extraFields"
    :filters="[]"
    :extra-request-filters="extraRequestFilters"
    endpoint="content/new_comer"
  >
    <template #default="{ item }">
      <CapsuleNewComers :key="item.uuid" v-bind="item" size="small" />
    </template>
  </Page>
</template>

<script>
import Page from '@inside-news/components/pages/ListingPage'

import CapsuleNewComers from '../../components/new-comers/CapsuleNewComers'

export default {
  name: 'NewComersListingPage',
  components: { Page, CapsuleNewComers },
  data() {
    return {
      bannerData: {
        page: 'new-comers-listing',
        introductionKey: 'body',
        html: true,
        add: ['new-comer']
      },
      extraFields: ['date', { services: ['uuid', 'title'] }, 'function'],
      extraRequestFilters: {
        sort: 'date:desc'
      }
    }
  }
}
</script>
