import { useNotification } from '@composables/notification';
import { useMailClient } from '@composables/utils';
import { REGISTER } from '@graphql/mutations/auth.js';
import type { IRegisterResponse } from '@types';

interface IRegisterArguments {
	firstName: string;
	lastName: string;
	phoneNumber: string;
	email: string;
	password: string;
	confirmPassword: string;
	referrer: string;
	isSubscribed: boolean;
}

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

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

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

	async function register(payload: IRegisterArguments) {
		const result = await mutate({
			firstName: payload.firstName,
			lastName: payload.lastName,
			phoneNumber: payload.phoneNumber,
			email: payload.email,
			password: payload.password,
			confirmPassword: payload.confirmPassword,
			referrer: payload.referrer,
			isSubscribed: payload.isSubscribed,
		});

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

			useNotification({
				message: h('div', [
					h('p', t('popup.success.register')),
					mailClientUrl.value
						? h(
								'button',
								{
									class: 'el-notification__button',
									onClick: () => {
										openMailClient();
									},
								},
								t('buttons.goEmail'),
							)
						: '',
				]),
				type: 'success',
			});

			appStore.unsetActiveAuthState();
		}
	}

	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;
		}
		useNotification({
			message,
			type: 'error',
			title: t('popup.errors.main'),
		});
	});

	return {
		register,
		loading,
	};
}