import type { Language  } from '../../runtime';
import { AsyncData  } from '../../runtime';
import type { IMultiSuggest } from '../../types';
import { useRoute } from 'vue-router';

export async function useFetchMultiSuggest(
  apiMethod: (...args: any[]) => Promise<IMultiSuggest | null>,
  phrasesLimit: number,
  modelsLimit: number,
  categoriesLimit: number,
  watchRoute = false
) {
  const route = useRoute();
  const searchValue = useState<string>('searchValue', () => '');
  const lang = useLang() as Language;
  const slug = useSlug();
  const key = watchRoute ? AsyncData.MultiSuggestRouteSearch : AsyncData.MultiSuggestSearch;
  const stateKey = computed(() => `data-${key}-${watchRoute ? slug.value : searchValue.value}-${lang}`);

  const { data, status } = await useAsyncData<IMultiSuggest | null>(
    key,
    () => useApiFetcher<IMultiSuggest | null>(
      stateKey.value,
      apiMethod,
      lang,
      watchRoute ? slug.value : searchValue.value,
      phrasesLimit,
      modelsLimit,
      categoriesLimit
    )(),
    {
      watch: [() => watchRoute ? String(route.params?.slug) : searchValue.value],
    }
  );

  return { data, status };
}