<script setup lang="ts">
import type { Records, View } from '@/jfapi'
import NextUp from './NextUp.vue'
import LatestMedia from './LatestMedia.vue'
import { onBeforeMount, ref } from 'vue'
import jfapi from '@/jfapi'

const views = ref<View[]>()
onBeforeMount(async () => {
  const viewlist = ref<Records<View> | null>()
  viewlist.value = await jfapi.LoadViews()
  if (viewlist.value === null) {
    // error
  } else {
    views.value = viewlist.value.Items
  }
  console.log(views.value)
})
</script>
<template>
  <NextUp />
  <div class="latest" v-if="views && views.length > 0">
    <LatestMedia v-for="view of views" :view="view" :key="view.Id" />
  </div>
</template>

<style scoped></style>
