schon/storefront/composables/contact/useContactUs.ts

import {isGraphQLError} from "~/utils/error";
import type {IContactUsResponse} from "~/types";
import {CONTACT_US} from "~/graphql/mutations/contact";
import {useNotification} from "~/composables/notification";

interface IContactUsArguments {
  name: string,
  email: string,
  phoneNumber?: string,
  subject?: string,
  message: string
}

export function useContactUs() {
  const {t} = useI18n();

  const { mutate, loading, error } = useMutation<IContactUsResponse>(CONTACT_US);

  async function contactUs(
      args: IContactUsArguments
  ) {
    const variables: Record<string, any> = {
      name: args.name,
      email: args.email,
      message: args.message
    };

    if (args.phoneNumber) {
      variables.phoneNumber = args.phoneNumber;
    }

    if (args.subject) {
      variables.subject = args.subject;
    }

    const result = await mutate(variables);

    if (result?.data?.contactUs.received) {
      useNotification({
        message: t('popup.success.contactUs'),
        type: 'success'
      });
    }
  }

  watch(error, (err) => {
    if (!err) return;
    console.error('useContactUs error:', err);
    let message = t('popup.errors.defaultError');
    if (isGraphQLError(err)) {
      message = err.graphQLErrors?.[0]?.message || message;
    } else {
      message = err.message;
    }
    useNotification({
      message,
      type: 'error',
      title: t('popup.errors.main')
    });
  });

  return {
    contactUs,
    loading
  };
}