import type {IPostResponse} from '~/types';
import {GET_POST_BY_SLUG} from "~/graphql/queries/standalone/blog";

export async function usePostBySlug(slug: string) {
  const { locale } = useI18n();

  const variables = reactive({
    slug: slug,
    first: 1
  });

  const { data, error, refresh } = await useAsyncQuery<IPostResponse>(
      GET_POST_BY_SLUG,
      variables
  );

  const post = computed(() => data.value?.posts.edges[0]?.node ?? null);

  watch(locale, async () => {
    if (variables.first >= 100) {
      variables.first = 0;
    } else {
      variables.first += 1;
    }
    await refresh();
  });

  watch(error, (err) => {
    if (err) {
      console.error('usePostBySlug error:', err)
    }
  });

  return {
    post,
    refresh
  };
}