import { SWITCH_LANGUAGE } from '@graphql/mutations/languages.js';
import type { IUserResponse, LocaleDefinition } from '@types';

export function useLanguageSwitch() {
	const userStore = useUserStore();
	const router = useRouter();
	const { $apollo } = useNuxtApp();
	const { $appHelpers } = useNuxtApp();

	const switchLocalePath = useSwitchLocalePath();

	const cookieLocale = useCookie($appHelpers.COOKIES_LOCALE_KEY, {
		default: () => $appHelpers.DEFAULT_LOCALE,
		path: '/',
	});

	const isAuthenticated = computed(() => userStore.isAuthenticated);
	const userUuid = computed(() => userStore.user?.uuid);

	const { mutate, loading, error } = useMutation<IUserResponse>(SWITCH_LANGUAGE);

	let isSwitching = false;

	async function switchLanguage(locale: string) {
		if (isSwitching || cookieLocale.value === locale) return;

		try {
			isSwitching = true;

			cookieLocale.value = locale;

			await $apollo.defaultClient.clearStore();

			await router.push({
				path: switchLocalePath(cookieLocale.value as LocaleDefinition['code']),
			});

			if (isAuthenticated.value) {
				const result = await mutate({
					uuid: userUuid.value,
					language: locale,
				});

				if (result?.data?.updateUser) {
					userStore.setUser(result.data.updateUser.user);
				}
			}

			await new Promise((resolve) => setTimeout(resolve, 100));
			await $apollo.defaultClient.refetchQueries({
				include: 'active',
			});
		} catch (error) {
			console.error('Error switching language:', error);
		} finally {
			isSwitching = false;
		}
	}

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

	return {
		switchLanguage,
		loading,
	};
}