import { Loading } from 'bill/index'
import { defineAsyncComponent } from 'vue'

import type { AsyncComponentLoader, Component } from 'vue'

export const loadPack = <T, K extends (...args: any[]) => Promise<T>>(fn: K | Promise<T>): Promise<T> => {
    Loading.show()
    const ret = typeof fn === 'function' ? fn() : fn
    if (ret.finally) {
      ret.finally(() => Loading.hide())
    } else {
      ret.then(() => Loading.hide())
      ret.catch(() => Loading.hide())
    }
    return ret
}

export const createLoadPack = <T, K extends (...args: any) => Promise<T>>(fn: K): K => 
  ((...args) => loadPack(() => fn(...args))) as K

export const loadComponent = <T extends Component>(loader: AsyncComponentLoader<T>) =>
  defineAsyncComponent(createLoadPack(loader))

export const showLoad = () => Loading.show()
export const hideLoad = () => Loading.hide()