<template>
  <base-dashboard-component class="overview-sources">
    <template #header>
      Available datasets
    </template>

    <template #content>
      <div class="columns is-multiline">
        <DataSourceItem
          v-for="ds in sources"
          :key="ds.id"
          :title="ds.title"
          :description="ds.size"
          :is-indexed="ds.indexed"
          :objects="ds.objects"
          :links="ds.links"
          class="column is-2"
        />
      </div>
    </template>
  </base-dashboard-component>
</template>

<script>
import DataSourceItem from './Item/index.vue'

export default {
  components: { DataSourceItem },
  props: {
    sources: {
      type: Array,
      default: () => []
    }
  }
}
</script>
