import { toRefs } from '@vue/reactivity' import { defineComponent, getCurrentInstance } from 'vue' import type { ComponentInternalInstance, DefineComponent } from 'vue' import { useRoute } from 'vue-router' import type { LegacyContext } from '../legacy' import { useNuxtApp } from '../nuxt' import { asyncData } from './asyncData' export const NuxtComponentIndicator = '__nuxt_component' export const NuxtComponentPendingPromises = '_pendingPromises' export interface NuxtComponentInternalInstance extends ComponentInternalInstance { [NuxtComponentPendingPromises]: Array> } export function getCurrentNuxtComponentInstance (): NuxtComponentInternalInstance { const vm = getCurrentInstance() as NuxtComponentInternalInstance if (!vm || !vm.proxy.$options[NuxtComponentIndicator]) { throw new Error('This method can only be used within a component defined with `defineNuxtComponent()`.') } return vm } export function enqueueNuxtComponent (p: Promise) { const vm = getCurrentNuxtComponentInstance() vm[NuxtComponentPendingPromises].push(p) } async function runLegacyAsyncData (res: Record | Promise>, fn: (context: LegacyContext) => Promise>) { const nuxt = useNuxtApp() const route = useRoute() const vm = getCurrentNuxtComponentInstance() const { fetchKey } = vm.proxy.$options const key = typeof fetchKey === 'function' ? fetchKey(() => '') : fetchKey || route.fullPath const { data } = await asyncData(`options:asyncdata:${key}`, () => fn(nuxt._legacyContext)) Object.assign(await res, toRefs(data)) } export const defineNuxtComponent: typeof defineComponent = function defineNuxtComponent (options: any): any { const { setup } = options if (!setup && !options.asyncData) { return { [NuxtComponentIndicator]: true, ...options } } return { [NuxtComponentIndicator]: true, ...options, setup (props, ctx) { const vm = getCurrentNuxtComponentInstance() let promises = vm[NuxtComponentPendingPromises] = vm[NuxtComponentPendingPromises] || [] const res = setup?.(props, ctx) || {} if (options.asyncData) { promises.push(runLegacyAsyncData(res, options.asyncData)) } if (!promises.length && !(res instanceof Promise)) { return res } return Promise.resolve(res) .then(() => Promise.all(promises)) .then(() => res) .finally(() => { promises.length = 0 promises = null delete vm[NuxtComponentPendingPromises] }) } } as DefineComponent }