schon/storefront/app/composables/feedbacks/useFeedbacks.ts

import { GET_FEEDBACKS } from '@graphql/queries/standalone/feedbacks';
import type {IFeedback, IFeedbacksResponse} from '@types';

interface IFeedbackArgs {
  feedbackAfter?: string;
  feedbackOrderBy?: string;
  feedbackUuid?: string;
  productUuid?: string;
  userUuid?: string;
}

interface IFeedbackVars {
  feedbackFirst: number;
  feedbackAfter?: string;
  feedbackOrderBy?: string;
  feedbackUuid?: string;
  productUuid?: string;
  userUuid?: string;
}

export function useBrands(args: IFeedbackArgs = {}) {
  const variables = reactive<IFeedbackVars>({
    feedbackFirst: 3,
    feedbackAfter: args.feedbackAfter,
    feedbackOrderBy: args.feedbackOrderBy,
    feedbackUuid: args.feedbackUuid,
    productUuid: args.productUuid,
    userUuid: args.userUuid,
  });

  const pending = ref(false);
  const feedbacks = ref<IFeedback[]>([]);
  const pageInfo = ref<{
    hasNextPage: boolean;
    endCursor: string;
  }>({
    hasNextPage: false,
    endCursor: '',
  });
  const error = ref<string | null>(null);

  const getFeedbacks = async (): Promise<void> => {
    pending.value = true;

    const queryVariables = {
      feedbackFirst: variables.first,
      feedbackAfter: variables.feedbackAfter || undefined,
      feedbackOrderBy: variables.feedbackOrderBy || undefined,
      feedbackUuid: variables.feedbackUuid || undefined,
      productUuid: variables.productUuid || undefined,
      userUuid: variables.userUuid || undefined,
    };

    const { data, error: mistake } = await useAsyncQuery<IFeedbacksResponse>(GET_FEEDBACKS, queryVariables);

    if (data.value?.feedbacks?.edges) {
      pageInfo.value = data.value?.brands.pageInfo;

      if (variables.feedbackAfter) {
        feedbacks.value = [
          ...feedbacks.value,
          ...data.value.feedbacks.edges,
        ];
      } else {
        feedbacks.value = data.value?.feedbacks.edges;
      }
    }

    if (mistake.value) {
      error.value = mistake.value;
    }

    pending.value = false;
  };

  watch(error, (e) => {
    if (e) console.error('useFeedbacks error:', e);
  });

  return {
    pending,
    feedbacks,
    pageInfo,
    variables,
    getFeedbacks,
  };
}