<script setup lang="ts">
import jfapi from '@/jfapi'
import MediaScroller from './MediaScroller.vue'
import type { FeedItem } from '@/feed'
import type { View } from '@/jfapi'
import { getDisplayDuration, getImageLink } from '../utils'

const props = defineProps<{
  view: View
}>()

const Items = async (): Promise<FeedItem[]> => {
  return new Promise(async (resolve) => {
    const feed: FeedItem[] = []
    const data = await jfapi.GetLatest(props.view)
    if (data !== null) {
      console.log(data)
      for (const item of data) {
        feed.push({
          title: item.SeriesName || item.Name,
          subtext: item.SeriesName
            ? `S${item.ParentIndexNumber}:E${item.IndexNumber} - ${item.Name}`
            : String(item.ProductionYear),
          image: getImageLink(item),
          summary: item.Overview,
          infoSubtext:
            item.Type === 'Episode'
              ? `S${item.ParentIndexNumber}:E${item.IndexNumber} - ${item.Name}`
              : item.OriginalTitle != item.Name
                ? item.OriginalTitle
                : '',
          imdbRating: String(item.CommunityRating),
          runtime: getDisplayDuration(item.RunTimeTicks),
          date: String(item.ProductionYear),
          MPAA: item.OfficialRating,
          tag:
            item.UserData?.UnplayedItemCount !== undefined
              ? String(item.UserData.UnplayedItemCount)
              : '',
          itemId: item.Id,
          type: item.Type,
        })
      }
      console.log('LatestMedia.vue =>', feed)
      resolve(feed)
    }
  })
}
</script>

<template>
  <MediaScroller :title="`Latest ${view?.Name}`" :feed-items="Items()" />
</template>
