import { computed, ref, type ComputedRef } from 'vue'

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

type AwardsStore = ReturnType<typeof useAwardsStore>

export function useHomeLandingModalState(
  store: AwardsStore,
  archiveYears: ComputedRef<Array<{ year: number }>>,
  resetInteractionState: () => void,
) {
  const modal = ref<null | 'show' | 'vote' | 'nominate' | 'clip'>(null)
  const accountModal = ref(false)
  const deleteConfirm = ref(false)
  const accountActionError = ref('')
  const privacyModal = ref(false)
  const archiveModal = ref(false)
  const archiveYear = ref(2025)

  const privacyModalOpen = computed(() => privacyModal.value)
  const accountModalOpen = computed(() => accountModal.value)
  const archiveModalOpen = computed(() => archiveModal.value)
  const modalOpen = computed(() => modal.value !== null)
  const isShow = computed(() => modal.value === 'show')
  const isVote = computed(() => modal.value === 'vote')
  const isPicker = computed(() => modal.value === 'vote' || modal.value === 'nominate')
  const isClip = computed(() => modal.value === 'clip')
  const deleteNotConfirm = computed(() => !deleteConfirm.value)

  function openModal(kind: 'show' | 'vote' | 'nominate' | 'clip') {
    modal.value = kind
    resetInteractionState()
  }

  function closeModal() {
    modal.value = null
    resetInteractionState()
  }

  function openVote(event?: Event) {
    event?.preventDefault()
    openModal('vote')
  }

  function openShow(event?: Event) {
    event?.preventDefault()
    openModal('show')
  }

  function openNominate(event?: Event) {
    event?.preventDefault()
    openModal('nominate')
  }

  function openClip(event?: Event) {
    event?.preventDefault()
    openModal('clip')
  }

  function stop(event: Event) {
    event.stopPropagation()
  }

  function onOpenAccount() {
    accountModal.value = true
    deleteConfirm.value = false
    accountActionError.value = ''
  }

  function onCloseAccount() {
    accountModal.value = false
    deleteConfirm.value = false
    accountActionError.value = ''
  }

  function onOpenPrivacy() {
    privacyModal.value = true
  }

  function onClosePrivacy() {
    privacyModal.value = false
  }

  async function onOpenArchive() {
    archiveModal.value = true
    const latestArchiveYear = archiveYears.value[0]?.year ?? store.overview.year - 1
    archiveYear.value = latestArchiveYear
    await store.loadArchive(latestArchiveYear)
  }

  function onCloseArchive() {
    archiveModal.value = false
  }

  async function setArchiveYear(year: number) {
    archiveYear.value = year
    await store.loadArchive(year)
  }

  function onRequestDelete() {
    deleteConfirm.value = true
  }

  function onCancelDelete() {
    deleteConfirm.value = false
    accountActionError.value = ''
  }

  return {
    modal,
    accountModal,
    deleteConfirm,
    accountActionError,
    privacyModal,
    archiveModal,
    archiveYear,
    privacyModalOpen,
    accountModalOpen,
    archiveModalOpen,
    modalOpen,
    isShow,
    isVote,
    isPicker,
    isClip,
    deleteNotConfirm,
    openModal,
    closeModal,
    openVote,
    openShow,
    openNominate,
    openClip,
    stop,
    onOpenAccount,
    onCloseAccount,
    onOpenPrivacy,
    onClosePrivacy,
    onOpenArchive,
    onCloseArchive,
    setArchiveYear,
    onRequestDelete,
    onCancelDelete,
  }
}
