import {REGISTER} from "@/graphql/mutations/auth.js";
import {useMailClient} from "@/composables/utils";
import {isGraphQLError} from "~/utils/error";
import type {IRegisterResponse} from "~/types";

export function useRegister() {
  const {t} = useI18n();
  const appStore = useAppStore();

  const { mailClientUrl, detectMailClient, openMailClient } = useMailClient();

  const { mutate, loading, error } = useMutation<IRegisterResponse>(REGISTER);

  async function register(
      firstName: string,
      lastName: string,
      phoneNumber: string,
      email: string,
      password: string,
      confirmPassword: string
  ) {
    const result = await mutate({
      firstName,
      lastName,
      phoneNumber,
      email,
      password,
      confirmPassword
    });

    if (result?.data?.createUser?.success) {
      detectMailClient(email);

      ElNotification({
        message: h('div', [
          h('p', t('popup.success.register')),
          mailClientUrl.value ? h(
            'button',
            {
              style: {
                marginTop: '10px',
                padding: '6px 12px',
                backgroundColor: '#000000',
                color: '#fff',
                border: 'none',
                cursor: 'pointer',
              },
              onClick: () => {
                openMailClient()
              }
            },
            t('buttons.goEmail')
          ) : ''
        ]),
        type: 'success'
      })

      appStore.unsetActiveState();
    }
  }

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

  return {
    register,
    loading
  };
}