<template>
  <Page
    :extra-categories-fields="extraCategoriesFields"
    :extra-fields="extraFields"
    :add="['news', 'news_categories', 'forms']"
    pagination="infiniteScroll"
  >
    <template #default="{ item }">
      <CapsuleNews
        v-bind="item"
        :key="item.uuid"
        :staggered="true"
        size="half"
      />
    </template>
  </Page>
</template>

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

import CapsuleNews from '../../components/news/CapsuleNews'

import newsCategoriesMixin from '../../mixins/news-categories-mixin'

export default {
  name: 'NewsListingPage',
  components: { Page, CapsuleNews },
  mixins: [newsCategoriesMixin],
  data() {
    return {
      extraFields: [
        {
          news_criticalities: {
            fields: ['title', 'color', 'image'],
            filters: { 'status:eq': 1 }
          }
        }
      ],
      extraCategoriesFields: [
        {
          spaces: {
            fields: ['uuid', 'title', 'slug'],
            filters: { 'status:eq': 1 }
          }
        }
      ]
    }
  }
}
</script>
