import type { Item } from '~/services/api'
import { ref } from 'vue'
import { Api } from '~/services/api'

export function useItems() {
  const config = useRuntimeConfig()
  const client = new Api({ baseURL: config.public.apiBase })

  const leftItems = ref<Item[]>([])
  const rightItems = ref<Item[]>([])
  const rightItemsTotal = ref(0)
  const leftItemsTotal = ref(0)
  const leftSearch = ref('')
  const rightSearch = ref('')
  const leftLoading = ref(false)
  const rightLoading = ref(false)
  const leftPage = ref(1)
  const rightPage = ref(1)
  const leftHasMore = ref(true)
  const rightHasMore = ref(true)

  async function fetchLeft(reset = false): Promise<void> {
    if (reset) {
      if (leftLoading.value) return
      leftLoading.value = true
      try {
        const data = await client.api.itemsList({
          page: 1,
          limit: 20,
          ...(leftSearch.value ? { search: leftSearch.value } : {}),
        })
        leftItems.value = [...(data.data ?? [])]
        leftHasMore.value = data.hasMore ?? false
        leftItemsTotal.value = data.total || 0
        leftPage.value = 2
      }
      finally {
        leftLoading.value = false
      }
      return
    }
    if (!leftHasMore.value || leftLoading.value) return
    leftLoading.value = true
    try {
      const data = await client.api.itemsList({
        page: leftPage.value,
        limit: 20,
        ...(leftSearch.value ? { search: leftSearch.value } : {}),
      })
      leftItems.value.push(...(data.data ?? []))
      leftHasMore.value = data.hasMore ?? false
      leftItemsTotal.value = data.total || 0
      leftPage.value++
    }
    finally {
      leftLoading.value = false
    }
  }

  async function fetchRight(reset = false): Promise<void> {
    if (reset) {
      if (rightLoading.value) return
      rightLoading.value = true
      try {
        const data = await client.api.itemsSelectedList({
          page: 1,
          limit: 20,
          ...(rightSearch.value ? { search: rightSearch.value } : {}),
        })
        rightItems.value = [...(data.data ?? [])]
        rightHasMore.value = data.hasMore ?? false
        rightItemsTotal.value = data.total || 0
        rightPage.value = 2
      }
      finally {
        rightLoading.value = false
      }
      return
    }
    if (!rightHasMore.value || rightLoading.value) return
    rightLoading.value = true
    try {
      const data = await client.api.itemsSelectedList({
        page: rightPage.value,
        limit: 20,
        ...(rightSearch.value ? { search: rightSearch.value } : {}),
      })
      rightItems.value.push(...(data.data ?? []))
      rightHasMore.value = data.hasMore ?? false
      rightItemsTotal.value = data.total || 0
      rightPage.value++
    }
    finally {
      rightLoading.value = false
    }
  }

  async function selectItem(id: number): Promise<void> {
    await client.api.itemsSelectCreate({ id })
    await Promise.all([fetchLeft(true), fetchRight(true)])
  }

  async function deselectItem(id: number): Promise<void> {
    await client.api.itemsDeselectCreate({ id })
    await Promise.all([fetchLeft(true), fetchRight(true)])
  }

  async function reorderItem(id: number, afterId: number | null): Promise<void> {
    await client.api.itemsReorderUpdate({ id, afterId })
  }

  async function addItem(id: number): Promise<void> {
    await client.api.itemsAddCreate({ id })
    await Promise.all([fetchLeft(true), fetchRight(true)])
  }

  return {
    leftItems,
    leftItemsTotal,
    rightItems,
    rightItemsTotal,
    leftSearch,
    rightSearch,
    leftLoading,
    rightLoading,
    leftHasMore,
    rightHasMore,
    fetchLeft,
    fetchRight,
    selectItem,
    deselectItem,
    reorderItem,
    addItem,
  }
}