import { computed, type Ref } from 'vue'

import { useAwardsStore } from '../../stores/awards'

type AwardsStore = ReturnType<typeof useAwardsStore>

export function useHomeArchivePresentation(store: AwardsStore, archiveYear: Ref<number>) {
  const archiveYears = computed(() => {
    const knownYears = new Map<number, number>()
    for (const entry of store.overview.archiveYears ?? []) {
      knownYears.set(entry.year, entry.winnerCount)
    }

    for (const entry of store.overview.winnersPreview) {
      if (!knownYears.has(entry.year)) {
        knownYears.set(
          entry.year,
          store.overview.winnersPreview.filter((winner) => winner.year === entry.year).length,
        )
      }
    }

    if (store.archive.items.length > 0) {
      knownYears.set(store.archive.year, store.archive.items.length)
    }

    return [...knownYears.entries()]
      .sort(([left], [right]) => right - left)
      .map(([year, winnerCount]) => ({
        year,
        label: String(year),
        winnerCount: year === store.archive.year ? store.archive.items.length : winnerCount,
        winners: year === store.archive.year ? store.archive.items : store.overview.winnersPreview.filter((entry) => entry.year === year),
        active: archiveYear.value === year,
      }))
  })

  const selectedArchive = computed(() => ({
    year: store.archive.year,
    winners: store.archive.items.map((winner) => ({
      category: winner.category,
      name: winner.winnerName,
      handle: winner.winnerSlug,
      platform: winner.winnerPlatform,
      url: winner.winnerUrl,
    })),
  }))

  const winnerShowcase = computed(() => selectedArchive.value.winners.slice(0, 4))

  function archiveYearButtonStyle(active: boolean) {
    return active
      ? "display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,210,122,.26);background:linear-gradient(135deg,#2a1842,#3a2168);color:#fff6fb;font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;cursor:pointer;text-align:left;box-shadow:0 14px 28px rgba(20,8,40,.24);"
      : "display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 16px;border-radius:16px;border:1px solid rgba(255,210,122,.16);background:linear-gradient(135deg,#2a1842,#3a2168);color:#fff6fb;font-family:'Outfit',sans-serif;font-size:15px;font-weight:700;cursor:pointer;text-align:left;box-shadow:0 10px 24px rgba(20,8,40,.14);opacity:.9;"
  }

  function winnerPlatformKey(url: string) {
    const normalized = url.toLowerCase()
    if (normalized.includes('twitch.tv')) return 'twitch'
    if (normalized.includes('youtube.com') || normalized.includes('youtu.be')) return 'youtube'
    if (normalized.includes('x.com') || normalized.includes('twitter.com')) return 'x'
    if (normalized.includes('instagram.com')) return 'instagram'
    if (normalized.includes('cake.gg') || normalized.includes('cake.')) return 'cake'
    return 'link'
  }

  function winnerPlatformLabel(url: string) {
    const key = winnerPlatformKey(url)
    if (key === 'twitch') return 'Twitch'
    if (key === 'youtube') return 'YouTube'
    if (key === 'x') return 'X'
    if (key === 'instagram') return 'Instagram'
    if (key === 'cake') return 'Cake'
    return 'Profil'
  }

  function winnerPlatformStyle(url: string) {
    const key = winnerPlatformKey(url)
    if (key === 'twitch') return "flex:none;display:inline-flex;align-items:center;gap:7px;color:#c9b1ff;text-decoration:none;font-family:'Outfit',sans-serif;font-weight:700;font-size:12px;"
    if (key === 'youtube') return "flex:none;display:inline-flex;align-items:center;gap:7px;color:#ffb3c1;text-decoration:none;font-family:'Outfit',sans-serif;font-weight:700;font-size:12px;"
    if (key === 'x') return "flex:none;display:inline-flex;align-items:center;gap:7px;color:#d8d3e6;text-decoration:none;font-family:'Outfit',sans-serif;font-weight:700;font-size:12px;"
    if (key === 'instagram') return "flex:none;display:inline-flex;align-items:center;gap:7px;color:#ffb5db;text-decoration:none;font-family:'Outfit',sans-serif;font-weight:700;font-size:12px;"
    if (key === 'cake') return "flex:none;display:inline-flex;align-items:center;gap:7px;color:#8b6cdb;text-decoration:none;font-family:'Outfit',sans-serif;font-weight:700;font-size:12px;"
    return "flex:none;display:inline-flex;align-items:center;gap:7px;color:#ffd27a;text-decoration:none;font-family:'Outfit',sans-serif;font-weight:700;font-size:12px;"
  }

  return {
    archiveYears,
    selectedArchive,
    winnerShowcase,
    archiveYearButtonStyle,
    winnerPlatformKey,
    winnerPlatformLabel,
    winnerPlatformStyle,
  }
}
