import { usePaymentStore } from '#lib/stores'
import {
  useCancelPromotion,
  useDepositData,
  usePromotion,
} from '#lib/composables'
import type { EWalletOption, EWalletResponseItem } from '#lib/types'
import { E_WALLET_EMPTY_INFO } from '#lib/constants'
import { reactive, computed, ref } from 'vue'

/**
 * Custom composable function for managing eWallet functionality.
 * @returns The eWallet composable object.
 * @namespace
 */
export function useEWallet() {
  const depositStore = usePaymentStore()

  const { fetchEWallets, fetchEWalletCode } = useDepositData()
  const { isUsingPromotion } = usePromotion()
  const { openModalCancelPromotion } = useCancelPromotion()

  /**
   * Fetches eWallet data from the server.
   * including eWallets and eWallet code.
   */
  const fetchData = async (): Promise<void> => {
    await Promise.all([fetchEWallets(), fetchEWalletCode()])
  }

  /**
   * The eWallet information.
   * Example:
   * {
   *   account_name: 'Nguyễn Văn A',
   *   account_no: '0123456789',
   *   qr_code: 'https://qr.momo.vn/...',
   * }
   */
  const eWalletInfo = reactive<EWalletResponseItem>({
    ...E_WALLET_EMPTY_INFO,
  })

  /**
   * The eWallet code.
   * Example: 'VSA2123213'
   */
  const eWalletCode = computed(() => {
    return depositStore.eWalletCode
  })

  /**
   * The eWallet provider options.
   * Example:
   * [
   *   {
   *     label: 'Momo',
   *     value: 'momo',
   *     items: [
   *       {
   *         account_name: 'Nguyễn Văn A',
   *         account_no: '0123456789',
   *         qr_code: 'https://qr.momo.vn/...',
   *       },
   *     ],
   *   },
   * ]
   */
  const eWalletProviderOptions = computed(() => {
    return depositStore.eWallets
  })

  const eWalletTypeActive = eWalletProviderOptions.value.find(
    (item) => !item.isMaintainance,
  )

  const eWalletTypeSelected = ref<string>(eWalletTypeActive?.value ?? '')

  /**
   * The eWallet options.
   * Example:
   * [
   *   { value: '0123456789', label: 'Nguyễn Văn A - 0123456789' },
   * ]
   */
  const eWalletOptions = computed<EWalletOption[]>(() => {
    return (
      eWalletProviderOptions.value
        .find((item) => item.value === eWalletTypeSelected.value)
        ?.items?.map((item) => {
          item.label = `${item.account_name} - ${item.account_no}`
          item.value = item.account_no
          return item
        }) ?? []
    )
  })

  /**
   * Changes the eWallet.
   * @param item The eWallet item.
   */
  function onChangeEWallet(item: EWalletOption): void {
    if (isUsingPromotion.value) {
      openModalCancelPromotion()
      return
    }

    Object.assign(eWalletInfo, item?.value ? item : E_WALLET_EMPTY_INFO)
  }

  /**
   * Changes the eWallet provider.
   * @param type The eWallet provider type.
   */
  const onChangeEWalletProvider = (type: string): void => {
    eWalletTypeSelected.value = type
    Object.assign(eWalletInfo, { ...E_WALLET_EMPTY_INFO })
  }

  return {
    fetchData,
    onChangeEWalletProvider,
    onChangeEWallet,
    eWalletProviderOptions,
    eWalletOptions,
    eWalletInfo,
    eWalletCode,
    eWalletTypeSelected,
  }
}